bugfix: copy/regenerate link for invitation action added to connection request lis in orgs feature.
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
'use client';
|
||||
'use client';
|
||||
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Check, Link2, Trash2, X } from 'lucide-react';
|
||||
import { Check, Trash2, UserPlus, X } from 'lucide-react';
|
||||
import { useAuth } from '@/lib/hooks/useAuth';
|
||||
import { useOrganizationInviteLinkCopy } from '@/lib/hooks/useOrganizationInviteLinkCopy';
|
||||
import {
|
||||
@@ -10,9 +10,11 @@ import {
|
||||
type CounterpartSearchResultDto,
|
||||
type OrganizationInvitationHistoryItemDto,
|
||||
} from '@/lib/api/organization';
|
||||
import { invitationTargetFromConnectionRow } from '@/components/invitations/organizationInviteLinks';
|
||||
import { CopyInvitationLinkButton } from '@/components/ui/organizations/CopyInvitationLinkButton';
|
||||
import { InvitationHistoryDialog } from '@/components/ui/organizations/InvitationHistoryDialog';
|
||||
import { Button } from '@/components/ui/common/Button';
|
||||
import { Badge, organizationLinkStatusVariant } from '@/components/ui/common/Badge';
|
||||
import { Badge, organizationConnectionStatusVariant } from '@/components/ui/common/Badge';
|
||||
import { Input } from '@/components/ui/common/Input';
|
||||
import { SearchBar } from '@/components/ui/common/SearchBar';
|
||||
import { Table } from '@/components/ui/common/Table';
|
||||
@@ -24,11 +26,22 @@ function formatOrganizationStatusLabel(status: string): string {
|
||||
return lower.charAt(0).toUpperCase() + lower.slice(1);
|
||||
}
|
||||
|
||||
function formatLinkStatusLabel(status: CounterpartItemDto['status']): string {
|
||||
if (status === 'PENDING') return 'Link request pending';
|
||||
if (status === 'ACTIVE') return 'Linked';
|
||||
if (status === 'REJECTED') return 'Link request rejected';
|
||||
return formatOrganizationStatusLabel(status);
|
||||
function formatConnectionStatusLabel(
|
||||
row: CounterpartItemDto,
|
||||
currentOrganizationId: string,
|
||||
): string {
|
||||
if (row.status === 'PENDING') {
|
||||
if (
|
||||
row.pendingInvitationId &&
|
||||
row.requestedByOrganizationId === currentOrganizationId
|
||||
) {
|
||||
return 'Invitation pending';
|
||||
}
|
||||
return 'Connection request pending';
|
||||
}
|
||||
if (row.status === 'ACTIVE') return 'Connected';
|
||||
if (row.status === 'REJECTED') return 'Connection request declined';
|
||||
return formatOrganizationStatusLabel(row.status);
|
||||
}
|
||||
|
||||
function formatApiMessage(err: unknown): string {
|
||||
@@ -41,7 +54,7 @@ function formatApiMessage(err: unknown): string {
|
||||
|
||||
function formatTableDate(value: string): string {
|
||||
const d = new Date(value);
|
||||
if (Number.isNaN(d.getTime())) return '—';
|
||||
if (Number.isNaN(d.getTime())) return '\u2014';
|
||||
return d.toLocaleDateString();
|
||||
}
|
||||
|
||||
@@ -57,8 +70,8 @@ export default function OrganizationsPage() {
|
||||
const [mode, setMode] = useState<TableMode>('existing');
|
||||
const [searching, setSearching] = useState(false);
|
||||
const [searchResults, setSearchResults] = useState<CounterpartSearchResultDto[]>([]);
|
||||
const [requestLinkRowId, setRequestLinkRowId] = useState<string | null>(null);
|
||||
const [deleteLinkRowId, setDeleteLinkRowId] = useState<string | null>(null);
|
||||
const [pendingConnectionRowId, setPendingConnectionRowId] = useState<string | null>(null);
|
||||
const [deleteConnectionRowId, setDeleteConnectionRowId] = useState<string | null>(null);
|
||||
|
||||
const [items, setItems] = useState<CounterpartItemDto[]>([]);
|
||||
const [manualOrganizationName, setManualOrganizationName] = useState('');
|
||||
@@ -131,12 +144,12 @@ export default function OrganizationsPage() {
|
||||
}
|
||||
}
|
||||
|
||||
async function submitRequestLink(targetOrganizationId: string) {
|
||||
setRequestLinkRowId(targetOrganizationId);
|
||||
async function submitConnectionRequest(targetOrganizationId: string) {
|
||||
setPendingConnectionRowId(targetOrganizationId);
|
||||
setError('');
|
||||
try {
|
||||
await organizationApi.createLink(targetOrganizationId);
|
||||
setSuccess(`${counterpartLabel} link request sent`);
|
||||
await organizationApi.createConnectionRequest(targetOrganizationId);
|
||||
setSuccess(`${counterpartLabel} connection request sent.`);
|
||||
setSearchResults([]);
|
||||
setQuery('');
|
||||
setMode('existing');
|
||||
@@ -144,7 +157,7 @@ export default function OrganizationsPage() {
|
||||
} catch (e) {
|
||||
setError(formatApiMessage(e));
|
||||
} finally {
|
||||
setRequestLinkRowId(null);
|
||||
setPendingConnectionRowId(null);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -210,31 +223,60 @@ export default function OrganizationsPage() {
|
||||
}
|
||||
}
|
||||
|
||||
async function respondToPendingLink(linkId: string, action: 'ACCEPT' | 'REJECT') {
|
||||
setRequestLinkRowId(linkId);
|
||||
async function handleCopyInvitationFromRow(row: CounterpartItemDto) {
|
||||
const target = invitationTargetFromConnectionRow(row, currentOrganization!.id);
|
||||
if (!target) return;
|
||||
setError('');
|
||||
try {
|
||||
await organizationApi.respondLink(linkId, action);
|
||||
setSuccess(action === 'ACCEPT' ? 'Link request accepted' : 'Link request rejected');
|
||||
await loadList();
|
||||
await copyInvitationLink(
|
||||
{
|
||||
id: target.id,
|
||||
organizationName: row.organizationName,
|
||||
ownerEmail: target.ownerEmail,
|
||||
status: target.status,
|
||||
createdAt: row.createdAt,
|
||||
acceptedAt: target.acceptedAt,
|
||||
},
|
||||
{
|
||||
onRegenerated: async () => {
|
||||
await loadList();
|
||||
},
|
||||
},
|
||||
);
|
||||
setSuccess('Invitation link copied to clipboard.');
|
||||
setTimeout(() => setSuccess(''), 3000);
|
||||
} catch (e) {
|
||||
setError(formatApiMessage(e));
|
||||
} finally {
|
||||
setRequestLinkRowId(null);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteLinkedOrganization(linkId: string) {
|
||||
setDeleteLinkRowId(linkId);
|
||||
async function respondToPendingConnection(connectionId: string, action: 'ACCEPT' | 'REJECT') {
|
||||
setPendingConnectionRowId(connectionId);
|
||||
setError('');
|
||||
try {
|
||||
await organizationApi.deleteLink(linkId);
|
||||
setSuccess('Linked organization removed');
|
||||
await organizationApi.respondToConnectionRequest(connectionId, action);
|
||||
setSuccess(
|
||||
action === 'ACCEPT' ? 'Connection request accepted.' : 'Connection request declined.',
|
||||
);
|
||||
await loadList();
|
||||
} catch (e) {
|
||||
setError(formatApiMessage(e));
|
||||
} finally {
|
||||
setDeleteLinkRowId(null);
|
||||
setPendingConnectionRowId(null);
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteConnection(connectionId: string) {
|
||||
setDeleteConnectionRowId(connectionId);
|
||||
setError('');
|
||||
try {
|
||||
await organizationApi.deleteConnection(connectionId);
|
||||
setSuccess('Connection removed.');
|
||||
await loadList();
|
||||
} catch (e) {
|
||||
setError(formatApiMessage(e));
|
||||
} finally {
|
||||
setDeleteConnectionRowId(null);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -255,7 +297,8 @@ export default function OrganizationsPage() {
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold text-text-primary">{tabLabel}</h1>
|
||||
<p className="text-sm text-text-secondary mt-1">
|
||||
Search organizations and send link requests or invitation links in one place.
|
||||
Search organizations, send connection requests to existing accounts, or invitation
|
||||
links when they are not on DyoLink yet.
|
||||
</p>
|
||||
</div>
|
||||
<Button type="button" size="sm" onClick={() => void openInvitationHistory()}>
|
||||
@@ -334,7 +377,7 @@ export default function OrganizationsPage() {
|
||||
existingRows.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={5} className="px-6 py-8 text-sm text-text-secondary">
|
||||
No organizations linked or pending yet. Use search to find and connect.
|
||||
No connections yet. Search to send a connection request or an invitation link.
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
@@ -343,6 +386,10 @@ export default function OrganizationsPage() {
|
||||
row.status === 'PENDING' &&
|
||||
row.requestedByOrganizationId !== null &&
|
||||
row.requestedByOrganizationId !== currentOrganization.id;
|
||||
const invitationTarget = invitationTargetFromConnectionRow(
|
||||
row,
|
||||
currentOrganization.id,
|
||||
);
|
||||
|
||||
return (
|
||||
<tr key={row.id} className="hover:bg-background-secondary/45">
|
||||
@@ -354,31 +401,39 @@ export default function OrganizationsPage() {
|
||||
{formatTableDate(row.createdAt)}
|
||||
</td>
|
||||
<td className="px-6 py-1.5 text-center align-middle">
|
||||
<Badge variant={organizationLinkStatusVariant(row.status)} fixedWidth={false}>
|
||||
{formatLinkStatusLabel(row.status)}
|
||||
<Badge variant={organizationConnectionStatusVariant(row.status)} fixedWidth={false}>
|
||||
{formatConnectionStatusLabel(row, currentOrganization.id)}
|
||||
</Badge>
|
||||
</td>
|
||||
<td className="px-6 py-1.5 text-right">
|
||||
<div className="inline-flex items-center gap-2">
|
||||
{invitationTarget && (
|
||||
<CopyInvitationLinkButton
|
||||
invitation={invitationTarget}
|
||||
copied={copiedId === invitationTarget.id}
|
||||
copying={copyingInvitationId === invitationTarget.id}
|
||||
onCopy={() => void handleCopyInvitationFromRow(row)}
|
||||
/>
|
||||
)}
|
||||
{canRespond && (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
className="p-2 rounded-md text-text-secondary hover:bg-background-card/80 hover:text-text-primary disabled:text-text-muted disabled:opacity-50"
|
||||
disabled={requestLinkRowId !== null && requestLinkRowId !== row.id}
|
||||
onClick={() => void respondToPendingLink(row.id, 'ACCEPT')}
|
||||
aria-label="Accept link request"
|
||||
title="Accept link request"
|
||||
disabled={pendingConnectionRowId !== null && pendingConnectionRowId !== row.id}
|
||||
onClick={() => void respondToPendingConnection(row.id, 'ACCEPT')}
|
||||
aria-label="Accept connection request"
|
||||
title="Accept connection request"
|
||||
>
|
||||
<Check className="w-4 h-4" />
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="p-2 rounded-md text-text-secondary hover:bg-red-500/15 hover:text-red-600 disabled:text-text-muted disabled:opacity-50"
|
||||
disabled={requestLinkRowId !== null && requestLinkRowId !== row.id}
|
||||
onClick={() => void respondToPendingLink(row.id, 'REJECT')}
|
||||
aria-label="Reject link request"
|
||||
title="Reject link request"
|
||||
disabled={pendingConnectionRowId !== null && pendingConnectionRowId !== row.id}
|
||||
onClick={() => void respondToPendingConnection(row.id, 'REJECT')}
|
||||
aria-label="Decline connection request"
|
||||
title="Decline connection request"
|
||||
>
|
||||
<X className="w-4 h-4" />
|
||||
</button>
|
||||
@@ -388,10 +443,10 @@ export default function OrganizationsPage() {
|
||||
<button
|
||||
type="button"
|
||||
className="p-2 rounded-md text-text-secondary hover:bg-red-500/15 hover:text-red-600 disabled:text-text-muted disabled:opacity-50"
|
||||
disabled={deleteLinkRowId !== null && deleteLinkRowId !== row.id}
|
||||
onClick={() => void deleteLinkedOrganization(row.id)}
|
||||
aria-label="Delete link"
|
||||
title="Delete link"
|
||||
disabled={deleteConnectionRowId !== null && deleteConnectionRowId !== row.id}
|
||||
onClick={() => void deleteConnection(row.id)}
|
||||
aria-label="Remove connection"
|
||||
title="Remove connection"
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
</button>
|
||||
@@ -415,12 +470,14 @@ export default function OrganizationsPage() {
|
||||
<button
|
||||
type="button"
|
||||
className="p-2 rounded-md text-text-secondary hover:bg-background-card/80 hover:text-text-primary disabled:text-text-muted disabled:opacity-50"
|
||||
disabled={requestLinkRowId !== null && requestLinkRowId !== r.id}
|
||||
onClick={() => void submitRequestLink(r.id)}
|
||||
aria-label="Send link request"
|
||||
title="Send link request"
|
||||
disabled={
|
||||
pendingConnectionRowId !== null && pendingConnectionRowId !== r.id
|
||||
}
|
||||
onClick={() => void submitConnectionRequest(r.id)}
|
||||
aria-label="Send connection request"
|
||||
title="Send connection request"
|
||||
>
|
||||
<Link2 className="w-4 h-4" />
|
||||
<UserPlus className="w-4 h-4" />
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
Reference in New Issue
Block a user