useHostInfo

useHostInfo asks the host to identify itself (System.host_info) and returns a HostInfo as data: the platform category ("Web" | "Android" | "Ios" | "Desktop" | "Cli" | "Unknown"), the host's human-readable name ("Polkadot Desktop", "dotli", "truapi-host") and its own version string. Use it to adapt layout density per platform, to label telemetry, or to put the exact host build into a bug report.

The call is best-effort by design: data is null standalone and on hosts that predate the method, so branch on it before rendering. The answer never changes for the life of the connection, so it is fetched once and cached.

Usage

import { useHostInfo } from "@use-truapi/react";

function HostBadge() {
  const { data: host, isPending } = useHostInfo();

  if (isPending) return null;
  if (!host) return <span>Running standalone</span>;
  return (
    <span>
      {host.name} {host.version} · {host.platform}
    </span>
  );
}

<script setup lang="ts">
import { useHostInfo } from "@use-truapi/vue";

const { data: host, isPending } = useHostInfo();
</script>

<template>
  <span v-if="isPending" />
  <span v-else-if="!host">Running standalone</span>
  <span v-else>{{ host.name }} {{ host.version }} · {{ host.platform }}</span>
</template>

See also

• useHostMode answers the coarser "am I in a host at all?" question.
• useProductContext is the host's view of your identity.

API reference

React

function useHostInfo(options?): UseQueryResult<HostInfo | null, Error>;

Host identity and version (System.host_info); null standalone or on hosts that predate it.

Parameters

Returns

UseQueryResult<HostInfo | null, Error>

Vue

function useHostInfo(options?): QueryResult<HostInfo | null>;

Host identity and version (System.host_info); null standalone or on hosts that predate it.

Parameters

Returns

QueryResult<HostInfo | null>