frontend client for gemstone. decentralised workplace app
1import { Text } from "@/components/primitives/Text";
2import { useFacet } from "@/lib/facet";
3import type { Did } from "@/lib/types/atproto";
4import { getBskyProfile } from "@/queries/get-profile";
5import { useQuery } from "@tanstack/react-query";
6import React from "react";
7import { View } from "react-native";
8
9export const Name = React.memo(({ did }: { did: Did }) => {
10 const {
11 data: profile,
12 isPending,
13 isError,
14 } = useQuery({
15 queryKey: ["profile", did],
16 queryFn: async () => {
17 return await getBskyProfile(did);
18 },
19 });
20
21 const { typography } = useFacet();
22
23 return isPending ? (
24 <View></View>
25 ) : isError ? (
26 <Text>:(</Text>
27 ) : (
28 profile && (
29 <Text style={typography.weights.byName.normal}>
30 {profile.displayName ?? profile.handle}
31 </Text>
32 )
33 );
34});
35
36Name.displayName = "Name";