diff --git a/packages/app/src/api/spheres.ts b/packages/app/src/api/spheres.ts
index bfde271..5bf2ed7 100644
--- a/packages/app/src/api/spheres.ts
+++ b/packages/app/src/api/spheres.ts
@@ -102,11 +102,15 @@ export function getSphereMembers(handle: string) {
return apiFetch<{ members: MemberData[] }>(`/api/spheres/${encodeURIComponent(handle)}/members`);
}
-export function inviteMember(handle: string, did: string, role: "admin" | "member" = "member") {
+export function inviteMember(
+ handle: string,
+ identifier: string,
+ role: "admin" | "member" = "member",
+) {
return apiFetch(`/api/spheres/${encodeURIComponent(handle)}/members`, {
method: "POST",
headers: { "Content-Type": "application/json" },
- body: JSON.stringify({ did, role }),
+ body: JSON.stringify({ identifier, role }),
});
}
diff --git a/packages/app/src/pages/sphere-members.tsx b/packages/app/src/pages/sphere-members.tsx
index dfcfb44..27275da 100644
--- a/packages/app/src/pages/sphere-members.tsx
+++ b/packages/app/src/pages/sphere-members.tsx
@@ -41,7 +41,7 @@ export function SphereMembersPage() {
function MembersContent({ handle, sphereName }: { handle: string; sphereName: string }) {
const members = useQuery(() => getSphereMembers(handle), [handle]);
- const inviteDid = useSignal("");
+ const inviteIdentifier = useSignal("");
const inviteRole = useSignal<"admin" | "member">("member");
const inviteError = useSignal("");
const memberError = useSignal("");
@@ -51,13 +51,13 @@ function MembersContent({ handle, sphereName }: { handle: string; sphereName: st
const handleInvite = async (e: Event) => {
e.preventDefault();
- const did = inviteDid.value.trim();
- if (!did) return;
+ const identifier = inviteIdentifier.value.trim();
+ if (!identifier) return;
inviting.value = true;
inviteError.value = "";
try {
- await inviteMember(handle, did, inviteRole.value);
- inviteDid.value = "";
+ await inviteMember(handle, identifier, inviteRole.value);
+ inviteIdentifier.value = "";
members.refetch();
} catch (err) {
inviteError.value = err instanceof Error ? err.message : "Failed to invite member.";
@@ -179,9 +179,9 @@ function MembersContent({ handle, sphereName }: { handle: string; sphereName: st
(inviteDid.value = (e.target as HTMLInputElement).value)}
+ placeholder="handle or did:plc:..."
+ value={inviteIdentifier.value}
+ onInput={(e) => (inviteIdentifier.value = (e.target as HTMLInputElement).value)}
/>