mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-08-09 21:25:45 +08:00
feat(core): improve mcp management (#15221)
#### PR Dependency Tree * **PR #15221** 👈 This tree was auto-generated by [Charcoal](https://github.com/danerwilliams/charcoal) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added MCP credential management (create/reveal, list, rotate, revoke) with expiration and status tracking. * Introduced read-only vs read/write access modes, with read/write tooling enabled only when permitted. * Added workspace MCP credential configuration UI, including token reveal and setup generation. * Added MCP credential GraphQL APIs to back the UI. * **Changes** * Replaced legacy access-token support with MCP credentials across authentication and realtime updates. * **Bug Fixes** * MCP authentication now reliably rejects revoked, rotated, expired, or disabled-user credentials. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
DarkSky
+209
@@ -0,0 +1,209 @@
|
||||
import { Button, Input, Modal, notify } from '@affine/component';
|
||||
import { useAsyncCallback } from '@affine/core/components/hooks/affine-async-hooks';
|
||||
import type { McpCredential } from '@affine/core/modules/cloud/services/mcp-credential';
|
||||
import { McpAccessMode } from '@affine/graphql';
|
||||
import { useI18n } from '@affine/i18n';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
import * as styles from './setting-panel.css';
|
||||
|
||||
type RevealedCredential = {
|
||||
credential: McpCredential;
|
||||
token: string;
|
||||
};
|
||||
|
||||
export const McpCredentialModal = ({
|
||||
mode,
|
||||
revealed,
|
||||
config,
|
||||
workspaceName,
|
||||
readWriteAvailable,
|
||||
onCreate,
|
||||
onClose,
|
||||
}: {
|
||||
mode: 'create' | 'reveal' | null;
|
||||
revealed: RevealedCredential | null;
|
||||
config: string;
|
||||
workspaceName?: string;
|
||||
readWriteAvailable: boolean;
|
||||
onCreate: (
|
||||
name: string,
|
||||
accessMode: McpAccessMode,
|
||||
expirationDays: number
|
||||
) => void | Promise<void>;
|
||||
onClose: () => void;
|
||||
}) => {
|
||||
const t = useI18n();
|
||||
const [name, setName] = useState('');
|
||||
const [expirationDays, setExpirationDays] = useState(90);
|
||||
const [accessMode, setAccessMode] = useState(McpAccessMode.READ_ONLY);
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!mode) {
|
||||
setName('');
|
||||
setExpirationDays(90);
|
||||
setAccessMode(McpAccessMode.READ_ONLY);
|
||||
setSubmitting(false);
|
||||
}
|
||||
}, [mode]);
|
||||
|
||||
const copy = useAsyncCallback(
|
||||
async (value: string) => {
|
||||
await navigator.clipboard.writeText(value);
|
||||
notify.success({ title: t['Copied to clipboard']() });
|
||||
},
|
||||
[t]
|
||||
);
|
||||
|
||||
const submit = useAsyncCallback(async () => {
|
||||
setSubmitting(true);
|
||||
try {
|
||||
await onCreate(name.trim(), accessMode, expirationDays);
|
||||
} finally {
|
||||
setSubmitting(false);
|
||||
}
|
||||
}, [accessMode, expirationDays, name, onCreate]);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open={mode !== null}
|
||||
onOpenChange={open => {
|
||||
if (!open) onClose();
|
||||
}}
|
||||
contentOptions={{ className: styles.modal }}
|
||||
>
|
||||
{mode === 'create' ? (
|
||||
<>
|
||||
<div className={styles.modalTitle}>
|
||||
{t['com.affine.integration.mcp-server.create.title']()}
|
||||
</div>
|
||||
<div className={styles.description}>
|
||||
{t['com.affine.integration.mcp-server.create.description']()}
|
||||
</div>
|
||||
<div className={styles.form}>
|
||||
<label className={styles.field}>
|
||||
<span>
|
||||
{t['com.affine.integration.mcp-server.field.label']()}
|
||||
</span>
|
||||
<Input
|
||||
value={name}
|
||||
maxLength={64}
|
||||
placeholder="Claude Desktop"
|
||||
onChange={setName}
|
||||
autoFocus
|
||||
/>
|
||||
</label>
|
||||
<label className={styles.field}>
|
||||
<span>
|
||||
{t['com.affine.integration.mcp-server.field.access']()}
|
||||
</span>
|
||||
{readWriteAvailable ? (
|
||||
<select
|
||||
className={styles.select}
|
||||
value={accessMode}
|
||||
onChange={event =>
|
||||
setAccessMode(event.currentTarget.value as McpAccessMode)
|
||||
}
|
||||
>
|
||||
<option value={McpAccessMode.READ_ONLY}>
|
||||
{t['com.affine.integration.mcp-server.access.read-only']()}
|
||||
</option>
|
||||
<option value={McpAccessMode.READ_WRITE}>
|
||||
{t['com.affine.integration.mcp-server.access.read-write']()}
|
||||
</option>
|
||||
</select>
|
||||
) : (
|
||||
<div className={styles.fixedValue}>
|
||||
{t['com.affine.integration.mcp-server.access.read-only']()}
|
||||
<span className={styles.description}>
|
||||
{t[
|
||||
'com.affine.integration.mcp-server.access.read-only-desc'
|
||||
]()}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</label>
|
||||
<label className={styles.field}>
|
||||
<span>
|
||||
{t['com.affine.integration.mcp-server.field.expiry']()}
|
||||
</span>
|
||||
<select
|
||||
className={styles.select}
|
||||
value={expirationDays}
|
||||
onChange={event =>
|
||||
setExpirationDays(Number(event.currentTarget.value))
|
||||
}
|
||||
>
|
||||
{[30, 90, 365].map(days => (
|
||||
<option value={days} key={days}>
|
||||
{t['com.affine.integration.mcp-server.expiry.days']({
|
||||
days: days.toString(),
|
||||
})}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div className={styles.modalActions}>
|
||||
<Button onClick={onClose}>{t['Cancel']()}</Button>
|
||||
<Button
|
||||
variant="primary"
|
||||
disabled={!name.trim() || submitting}
|
||||
loading={submitting}
|
||||
onClick={submit}
|
||||
>
|
||||
{t['com.affine.integration.mcp-server.action.create']()}
|
||||
</Button>
|
||||
</div>
|
||||
</>
|
||||
) : revealed ? (
|
||||
<>
|
||||
<div className={styles.modalTitle}>
|
||||
{t['com.affine.integration.mcp-server.reveal.title']()}
|
||||
</div>
|
||||
<div className={styles.warning}>
|
||||
{t['com.affine.integration.mcp-server.reveal.warning']()}
|
||||
</div>
|
||||
<div className={styles.summary}>
|
||||
{revealed.credential.name} · {workspaceName} ·{' '}
|
||||
{revealed.credential.accessMode === McpAccessMode.READ_WRITE
|
||||
? t['com.affine.integration.mcp-server.access.read-write']()
|
||||
: t['com.affine.integration.mcp-server.access.read-only']()}{' '}
|
||||
· {new Date(revealed.credential.expiresAt).toLocaleString()}
|
||||
</div>
|
||||
{revealed.credential.graceEndsAt ? (
|
||||
<div className={styles.warning}>
|
||||
{t['com.affine.integration.mcp-server.reveal.old-valid-until']({
|
||||
date: new Date(
|
||||
revealed.credential.graceEndsAt
|
||||
).toLocaleString(),
|
||||
})}
|
||||
</div>
|
||||
) : null}
|
||||
<div className={styles.codeHeader}>
|
||||
<span>{t['com.affine.integration.mcp-server.reveal.token']()}</span>
|
||||
<Button onClick={() => copy(revealed.token)}>
|
||||
{t['com.affine.integration.mcp-server.action.copy-token']()}
|
||||
</Button>
|
||||
</div>
|
||||
<pre className={styles.preArea}>{revealed.token}</pre>
|
||||
<div className={styles.codeHeader}>
|
||||
<span>
|
||||
{t['com.affine.integration.mcp-server.reveal.config']()}
|
||||
</span>
|
||||
<Button variant="primary" onClick={() => copy(config)}>
|
||||
{t['com.affine.integration.mcp-server.action.copy-json']()}
|
||||
</Button>
|
||||
</div>
|
||||
<pre className={styles.preArea}>{config}</pre>
|
||||
<div className={styles.modalActions}>
|
||||
<Button variant="primary" onClick={onClose}>
|
||||
{t['com.affine.integration.mcp-server.action.done']()}
|
||||
</Button>
|
||||
</div>
|
||||
</>
|
||||
) : null}
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
+160
-35
@@ -2,47 +2,172 @@ import { cssVar } from '@toeverything/theme';
|
||||
import { cssVarV2 } from '@toeverything/theme/v2';
|
||||
import { style } from '@vanilla-extract/css';
|
||||
|
||||
export const connectButton = style({
|
||||
width: '100%',
|
||||
marginTop: '24px',
|
||||
});
|
||||
|
||||
export const section = style({
|
||||
export const stack = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
border: `1px solid ${cssVar('borderColor')}`,
|
||||
borderRadius: '8px',
|
||||
padding: '8px 16px',
|
||||
gap: '0px',
|
||||
marginBottom: '16px',
|
||||
gap: 24,
|
||||
});
|
||||
|
||||
export const sectionHeader = style({
|
||||
export const panel = style({
|
||||
border: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
|
||||
borderRadius: 8,
|
||||
overflow: 'hidden',
|
||||
background: cssVarV2('layer/background/primary'),
|
||||
});
|
||||
export const panelHeader = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
gap: '8px',
|
||||
gap: 12,
|
||||
padding: '12px 16px',
|
||||
borderBottom: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
|
||||
});
|
||||
|
||||
export const preArea = style({
|
||||
backgroundColor: cssVarV2('layer/background/secondary'),
|
||||
padding: '16px 16px',
|
||||
borderRadius: '8px',
|
||||
margin: '8px 0',
|
||||
fontFamily: cssVar('fontMonoFamily'),
|
||||
overflowX: 'auto',
|
||||
});
|
||||
|
||||
export const sectionDescription = style({
|
||||
fontSize: 13,
|
||||
lineHeight: '22px',
|
||||
color: cssVarV2('text/secondary'),
|
||||
});
|
||||
|
||||
export const sectionTitle = style({
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: 1.25,
|
||||
export const title = style({
|
||||
fontSize: cssVar('fontSm'),
|
||||
fontWeight: 600,
|
||||
color: cssVarV2('text/primary'),
|
||||
});
|
||||
export const description = style({
|
||||
fontSize: cssVar('fontXs'),
|
||||
lineHeight: '20px',
|
||||
color: cssVarV2('text/secondary'),
|
||||
});
|
||||
export const empty = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
gap: 8,
|
||||
padding: '28px 20px',
|
||||
textAlign: 'center',
|
||||
});
|
||||
export const skeletons = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 12,
|
||||
padding: 16,
|
||||
});
|
||||
export const rows = style({ display: 'flex', flexDirection: 'column' });
|
||||
export const row = style({
|
||||
display: 'grid',
|
||||
gridTemplateColumns: 'minmax(0, 1fr) auto',
|
||||
alignItems: 'center',
|
||||
gap: 12,
|
||||
padding: '12px 16px',
|
||||
borderBottom: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
|
||||
selectors: { '&:last-child': { borderBottom: 0 } },
|
||||
});
|
||||
export const rowDisabled = style({
|
||||
opacity: 0.55,
|
||||
background: cssVarV2('layer/background/secondary'),
|
||||
});
|
||||
export const rowMain = style({
|
||||
minWidth: 0,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 4,
|
||||
});
|
||||
export const rowTitle = style({
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 8,
|
||||
fontSize: cssVar('fontSm'),
|
||||
fontWeight: 600,
|
||||
color: cssVarV2('text/primary'),
|
||||
});
|
||||
export const tag = style({
|
||||
borderRadius: 999,
|
||||
padding: '2px 8px',
|
||||
fontSize: 11,
|
||||
lineHeight: '16px',
|
||||
fontWeight: 400,
|
||||
color: cssVarV2('text/secondary'),
|
||||
background: cssVarV2('layer/background/secondary'),
|
||||
});
|
||||
export const rowActions = style({ display: 'flex', gap: 8 });
|
||||
export const capabilities = style({
|
||||
display: 'grid',
|
||||
gridTemplateColumns: 'repeat(3, minmax(0, 1fr))',
|
||||
});
|
||||
export const capability = style({
|
||||
padding: '14px 16px',
|
||||
fontSize: cssVar('fontXs'),
|
||||
color: cssVarV2('text/secondary'),
|
||||
borderRight: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
|
||||
selectors: { '&:last-child': { borderRight: 0 } },
|
||||
});
|
||||
export const modal = style({
|
||||
width: 500,
|
||||
maxWidth: 'calc(100vw - 32px)',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 16,
|
||||
padding: 20,
|
||||
});
|
||||
export const modalTitle = style({
|
||||
fontSize: 18,
|
||||
fontWeight: 600,
|
||||
color: cssVarV2('text/primary'),
|
||||
});
|
||||
export const form = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 16,
|
||||
});
|
||||
export const field = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 6,
|
||||
fontSize: cssVar('fontXs'),
|
||||
color: cssVarV2('text/secondary'),
|
||||
});
|
||||
export const fixedValue = style({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: 2,
|
||||
padding: '8px 10px',
|
||||
borderRadius: 8,
|
||||
background: cssVarV2('layer/background/secondary'),
|
||||
color: cssVarV2('text/primary'),
|
||||
});
|
||||
export const select = style({
|
||||
height: 32,
|
||||
borderRadius: 8,
|
||||
border: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
|
||||
padding: '0 10px',
|
||||
background: cssVarV2('layer/background/primary'),
|
||||
color: cssVarV2('text/primary'),
|
||||
});
|
||||
export const warning = style({
|
||||
padding: 12,
|
||||
borderRadius: 8,
|
||||
background: cssVarV2('layer/background/secondary'),
|
||||
color: cssVarV2('text/primary'),
|
||||
fontSize: cssVar('fontXs'),
|
||||
});
|
||||
export const summary = style({
|
||||
fontSize: cssVar('fontXs'),
|
||||
color: cssVarV2('text/secondary'),
|
||||
});
|
||||
export const codeHeader = style({
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
fontSize: cssVar('fontSm'),
|
||||
fontWeight: 600,
|
||||
});
|
||||
export const preArea = style({
|
||||
maxHeight: 180,
|
||||
overflow: 'auto',
|
||||
margin: 0,
|
||||
padding: 12,
|
||||
borderRadius: 8,
|
||||
background: cssVarV2('layer/background/secondary'),
|
||||
fontFamily: cssVar('fontMonoFamily'),
|
||||
fontSize: cssVar('fontXs'),
|
||||
whiteSpace: 'pre-wrap',
|
||||
wordBreak: 'break-all',
|
||||
});
|
||||
export const modalActions = style({
|
||||
display: 'flex',
|
||||
justifyContent: 'flex-end',
|
||||
gap: 8,
|
||||
});
|
||||
|
||||
+292
-208
@@ -1,244 +1,328 @@
|
||||
import { Button, ErrorMessage, notify, Skeleton } from '@affine/component';
|
||||
import {
|
||||
Button,
|
||||
ErrorMessage,
|
||||
notify,
|
||||
Skeleton,
|
||||
useConfirmModal,
|
||||
} from '@affine/component';
|
||||
import { useAsyncCallback } from '@affine/core/components/hooks/affine-async-hooks';
|
||||
import { AccessTokenService, ServerService } from '@affine/core/modules/cloud';
|
||||
import type { AccessToken } from '@affine/core/modules/cloud/stores/access-token';
|
||||
import {
|
||||
McpCredentialService,
|
||||
ServerService,
|
||||
} from '@affine/core/modules/cloud';
|
||||
import type { McpCredential } from '@affine/core/modules/cloud/services/mcp-credential';
|
||||
import { WorkspaceService } from '@affine/core/modules/workspace';
|
||||
import { UserFriendlyError } from '@affine/error';
|
||||
import { McpAccessMode } from '@affine/graphql';
|
||||
import { useI18n } from '@affine/i18n';
|
||||
import { useLiveData, useService } from '@toeverything/infra';
|
||||
import { type ReactNode, useEffect, useMemo, useState } from 'react';
|
||||
import { useCallback, useEffect, useMemo, useState } from 'react';
|
||||
|
||||
import { IntegrationSettingHeader } from '../setting';
|
||||
import { McpCredentialModal } from './credential-modal';
|
||||
import MCPIcon from './MCP.inline.svg';
|
||||
import * as styles from './setting-panel.css';
|
||||
|
||||
type RevealedCredential = {
|
||||
credential: McpCredential;
|
||||
token: string;
|
||||
};
|
||||
|
||||
const formatDate = (value: string) => new Date(value).toLocaleString();
|
||||
|
||||
export const McpServerSettingPanel = () => {
|
||||
return <McpServerSetting />;
|
||||
};
|
||||
|
||||
const McpServerSettingHeader = ({ action }: { action?: ReactNode }) => {
|
||||
const t = useI18n();
|
||||
|
||||
return (
|
||||
<IntegrationSettingHeader
|
||||
icon={<img src={MCPIcon} />}
|
||||
name={t['com.affine.integration.mcp-server.name']()}
|
||||
desc={t['com.affine.integration.mcp-server.desc']()}
|
||||
action={action}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
const McpServerSetting = () => {
|
||||
const workspaceService = useService(WorkspaceService);
|
||||
const serverService = useService(ServerService);
|
||||
const credentialsService = useService(McpCredentialService);
|
||||
const credentials = useLiveData(credentialsService.credentials$);
|
||||
const loading = useLiveData(credentialsService.loading$);
|
||||
const error = useLiveData(credentialsService.error$);
|
||||
const readWriteAvailable = useLiveData(
|
||||
credentialsService.readWriteAvailable$
|
||||
);
|
||||
const workspaceId = workspaceService.workspace.id;
|
||||
const workspaceName = useLiveData(workspaceService.workspace.name$);
|
||||
const accessTokenService = useService(AccessTokenService);
|
||||
const accessTokens = useLiveData(accessTokenService.accessTokens$);
|
||||
const isRevalidating = useLiveData(accessTokenService.isRevalidating$);
|
||||
const error = useLiveData(accessTokenService.error$);
|
||||
const [mutating, setMutating] = useState(false);
|
||||
const [revealedAccessToken, setRevealedAccessToken] =
|
||||
useState<AccessToken | null>(null);
|
||||
const t = useI18n();
|
||||
const { openConfirmModal } = useConfirmModal();
|
||||
const [modal, setModal] = useState<'create' | 'reveal' | null>(null);
|
||||
const [revealed, setRevealed] = useState<RevealedCredential | null>(null);
|
||||
const [mutatingId, setMutatingId] = useState<string | null>(null);
|
||||
|
||||
const mcpAccessToken = useMemo(() => {
|
||||
return accessTokens?.find(token => token.name === 'mcp');
|
||||
}, [accessTokens]);
|
||||
const statusLabel = useCallback(
|
||||
(status: McpCredential['status']) => {
|
||||
switch (status) {
|
||||
case 'ACTIVE':
|
||||
return t['com.affine.integration.mcp-server.status.active']();
|
||||
case 'ROTATING':
|
||||
return t['com.affine.integration.mcp-server.status.rotating']();
|
||||
case 'EXPIRING':
|
||||
return t['com.affine.integration.mcp-server.status.expiring']();
|
||||
case 'EXPIRED':
|
||||
return t['com.affine.integration.mcp-server.status.expired']();
|
||||
case 'REVOKED':
|
||||
return t['com.affine.integration.mcp-server.status.revoked']();
|
||||
default:
|
||||
return status;
|
||||
}
|
||||
},
|
||||
[t]
|
||||
);
|
||||
|
||||
const hasMcpToken = Boolean(revealedAccessToken || mcpAccessToken);
|
||||
const hasCopyableToken = Boolean(revealedAccessToken);
|
||||
const isRedactedDisplay = hasMcpToken && !hasCopyableToken;
|
||||
const revalidate = useCallback(() => {
|
||||
// oxlint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
credentialsService.revalidate(workspaceId);
|
||||
}, [credentialsService, workspaceId]);
|
||||
|
||||
const code = useMemo(() => {
|
||||
return revealedAccessToken
|
||||
? JSON.stringify(
|
||||
{
|
||||
mcpServers: {
|
||||
[`affine_workspace_${workspaceService.workspace.id}`]: {
|
||||
type: 'streamable-http',
|
||||
url: `${serverService.server.baseUrl}/api/workspaces/${workspaceService.workspace.id}/mcp`,
|
||||
note: `Read docs from AFFiNE workspace "${workspaceName}"`,
|
||||
headers: {
|
||||
Authorization: `Bearer ${revealedAccessToken.token}`,
|
||||
},
|
||||
},
|
||||
},
|
||||
useEffect(() => revalidate(), [revalidate]);
|
||||
|
||||
const config = useMemo(() => {
|
||||
if (!revealed) return '';
|
||||
return JSON.stringify(
|
||||
{
|
||||
mcpServers: {
|
||||
[`affine_workspace_${workspaceId}`]: {
|
||||
type: 'streamable-http',
|
||||
url: `${serverService.server.baseUrl}/api/workspaces/${workspaceId}/mcp`,
|
||||
headers: { Authorization: `Bearer ${revealed.token}` },
|
||||
},
|
||||
null,
|
||||
2
|
||||
)
|
||||
: null;
|
||||
}, [revealedAccessToken, workspaceName, workspaceService, serverService]);
|
||||
|
||||
const copyJsonDisabled = !code || mutating || isRedactedDisplay;
|
||||
const copyJsonTooltip = isRedactedDisplay
|
||||
? t['com.affine.integration.mcp-server.copy-json.disabled-hint']()
|
||||
: undefined;
|
||||
|
||||
const showLoading = accessTokens === null && isRevalidating;
|
||||
const showError = accessTokens === null && error !== null;
|
||||
|
||||
useEffect(() => {
|
||||
accessTokenService.revalidate();
|
||||
}, [accessTokenService]);
|
||||
|
||||
const handleGenerateAccessToken = useAsyncCallback(async () => {
|
||||
setMutating(true);
|
||||
try {
|
||||
if (mcpAccessToken) {
|
||||
await accessTokenService.revokeUserAccessToken(mcpAccessToken.id);
|
||||
}
|
||||
const createdToken =
|
||||
await accessTokenService.generateUserAccessToken('mcp');
|
||||
setRevealedAccessToken(createdToken);
|
||||
} catch (err) {
|
||||
notify.error({
|
||||
error: UserFriendlyError.fromAny(err),
|
||||
});
|
||||
} finally {
|
||||
setMutating(false);
|
||||
}
|
||||
}, [accessTokenService, mcpAccessToken]);
|
||||
|
||||
const handleRevokeAccessToken = useAsyncCallback(async () => {
|
||||
setMutating(true);
|
||||
try {
|
||||
if (mcpAccessToken) {
|
||||
await accessTokenService.revokeUserAccessToken(mcpAccessToken.id);
|
||||
}
|
||||
setRevealedAccessToken(null);
|
||||
} catch (err) {
|
||||
notify.error({
|
||||
error: UserFriendlyError.fromAny(err),
|
||||
});
|
||||
} finally {
|
||||
setMutating(false);
|
||||
}
|
||||
}, [accessTokenService, mcpAccessToken]);
|
||||
|
||||
if (showLoading) {
|
||||
return (
|
||||
<div>
|
||||
<McpServerSettingHeader />
|
||||
<Skeleton />
|
||||
</div>
|
||||
},
|
||||
},
|
||||
null,
|
||||
2
|
||||
);
|
||||
}
|
||||
}, [revealed, serverService.server.baseUrl, workspaceId]);
|
||||
|
||||
if (showError) {
|
||||
return (
|
||||
<div>
|
||||
<McpServerSettingHeader />
|
||||
<ErrorMessage>{error}</ErrorMessage>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
const create = useAsyncCallback(
|
||||
async (name: string, accessMode: McpAccessMode, expirationDays: number) => {
|
||||
try {
|
||||
const result = await credentialsService.create({
|
||||
workspaceId,
|
||||
name,
|
||||
accessMode,
|
||||
expirationDays,
|
||||
});
|
||||
setRevealed(result);
|
||||
setModal('reveal');
|
||||
} catch (error) {
|
||||
notify.error({ error: UserFriendlyError.fromAny(error) });
|
||||
}
|
||||
},
|
||||
[credentialsService, workspaceId]
|
||||
);
|
||||
|
||||
const rotate = useAsyncCallback(
|
||||
async (credential: McpCredential) => {
|
||||
setMutatingId(credential.id);
|
||||
try {
|
||||
const result = await credentialsService.rotate(
|
||||
credential.id,
|
||||
workspaceId,
|
||||
90
|
||||
);
|
||||
setRevealed(result);
|
||||
setModal('reveal');
|
||||
} catch (error) {
|
||||
notify.error({ error: UserFriendlyError.fromAny(error) });
|
||||
} finally {
|
||||
setMutatingId(null);
|
||||
}
|
||||
},
|
||||
[credentialsService, workspaceId]
|
||||
);
|
||||
|
||||
const confirmRotate = useCallback(
|
||||
(credential: McpCredential) => {
|
||||
openConfirmModal({
|
||||
title: t['com.affine.integration.mcp-server.rotate.title'](),
|
||||
description:
|
||||
t['com.affine.integration.mcp-server.rotate.description'](),
|
||||
confirmText: t['com.affine.integration.mcp-server.action.rotate'](),
|
||||
cancelText: t['Cancel'](),
|
||||
onConfirm: () => rotate(credential),
|
||||
});
|
||||
},
|
||||
[openConfirmModal, rotate, t]
|
||||
);
|
||||
|
||||
const confirmRevoke = useCallback(
|
||||
(credential: McpCredential) => {
|
||||
openConfirmModal({
|
||||
title: t['com.affine.integration.mcp-server.revoke.title']({
|
||||
name: credential.name,
|
||||
}),
|
||||
description:
|
||||
t['com.affine.integration.mcp-server.revoke.description'](),
|
||||
confirmText: t['com.affine.integration.mcp-server.action.revoke'](),
|
||||
cancelText: t['Cancel'](),
|
||||
confirmButtonOptions: { variant: 'error' },
|
||||
onConfirm: async () => {
|
||||
setMutatingId(credential.id);
|
||||
try {
|
||||
await credentialsService.revoke(credential.id, workspaceId);
|
||||
} catch (error) {
|
||||
notify.error({ error: UserFriendlyError.fromAny(error) });
|
||||
} finally {
|
||||
setMutatingId(null);
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
[credentialsService, openConfirmModal, t, workspaceId]
|
||||
);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<McpServerSettingHeader />
|
||||
<div className={styles.stack}>
|
||||
<IntegrationSettingHeader
|
||||
icon={<img src={MCPIcon} />}
|
||||
name={t['com.affine.integration.mcp-server.name']()}
|
||||
desc={t['com.affine.integration.mcp-server.desc']()}
|
||||
/>
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>Personal access token</div>
|
||||
{!hasMcpToken ? (
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={handleGenerateAccessToken}
|
||||
disabled={mutating}
|
||||
>
|
||||
Create New
|
||||
</Button>
|
||||
) : (
|
||||
<Button
|
||||
variant="error"
|
||||
onClick={handleRevokeAccessToken}
|
||||
disabled={mutating}
|
||||
>
|
||||
Delete
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
<p className={styles.sectionDescription}>
|
||||
This access token is used for the MCP service, please keep this
|
||||
information secure. Deleting it will invalidate the access token.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>Server Config</div>
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={() => {
|
||||
if (!code) return;
|
||||
// oxlint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
navigator.clipboard.writeText(code);
|
||||
notify.success({
|
||||
title: t['Copied to clipboard'](),
|
||||
});
|
||||
}}
|
||||
disabled={copyJsonDisabled}
|
||||
tooltip={copyJsonTooltip}
|
||||
>
|
||||
Copy json
|
||||
<section className={styles.panel}>
|
||||
<div className={styles.panelHeader}>
|
||||
<div>
|
||||
<div className={styles.title}>
|
||||
{t['com.affine.integration.mcp-server.credentials.title']()}
|
||||
</div>
|
||||
<div className={styles.description}>
|
||||
{t['com.affine.integration.mcp-server.credentials.description']()}
|
||||
</div>
|
||||
</div>
|
||||
<Button variant="primary" onClick={() => setModal('create')}>
|
||||
{t['com.affine.integration.mcp-server.action.create']()}
|
||||
</Button>
|
||||
</div>
|
||||
{code ? (
|
||||
<pre className={styles.preArea}>{code}</pre>
|
||||
|
||||
{loading && credentials === null ? (
|
||||
<div className={styles.skeletons}>
|
||||
<Skeleton />
|
||||
<Skeleton />
|
||||
</div>
|
||||
) : error && credentials === null ? (
|
||||
<div className={styles.empty}>
|
||||
<ErrorMessage>
|
||||
{t['com.affine.integration.mcp-server.load-error']()}
|
||||
</ErrorMessage>
|
||||
<Button onClick={revalidate}>{t['Retry']()}</Button>
|
||||
</div>
|
||||
) : credentials?.length ? (
|
||||
<div className={styles.rows}>
|
||||
{credentials.map(credential => (
|
||||
<div
|
||||
className={`${styles.row} ${
|
||||
credential.status === 'EXPIRED' ||
|
||||
credential.status === 'REVOKED'
|
||||
? styles.rowDisabled
|
||||
: ''
|
||||
}`}
|
||||
key={credential.id}
|
||||
>
|
||||
<div className={styles.rowMain}>
|
||||
<div className={styles.rowTitle}>
|
||||
{credential.name}
|
||||
<span className={styles.tag}>
|
||||
{statusLabel(credential.status)}
|
||||
</span>
|
||||
</div>
|
||||
<div className={styles.description}>
|
||||
{credential.accessMode === McpAccessMode.READ_WRITE
|
||||
? t[
|
||||
'com.affine.integration.mcp-server.access.read-write'
|
||||
]()
|
||||
: t[
|
||||
'com.affine.integration.mcp-server.access.read-only'
|
||||
]()}{' '}
|
||||
· •••• {credential.fingerprint} ·{' '}
|
||||
{t['com.affine.integration.mcp-server.meta.expires']({
|
||||
date: formatDate(credential.expiresAt),
|
||||
})}
|
||||
</div>
|
||||
<div className={styles.description}>
|
||||
{t['com.affine.integration.mcp-server.meta.created']({
|
||||
date: formatDate(credential.createdAt),
|
||||
})}{' '}
|
||||
·{' '}
|
||||
{credential.lastUsedAt
|
||||
? t['com.affine.integration.mcp-server.meta.last-used']({
|
||||
date: formatDate(credential.lastUsedAt),
|
||||
})
|
||||
: t[
|
||||
'com.affine.integration.mcp-server.meta.never-used'
|
||||
]()}
|
||||
{credential.graceEndsAt
|
||||
? ` · ${t[
|
||||
'com.affine.integration.mcp-server.meta.grace-until'
|
||||
]({ date: formatDate(credential.graceEndsAt) })}`
|
||||
: null}
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.rowActions}>
|
||||
{credential.status !== 'REVOKED' &&
|
||||
credential.status !== 'EXPIRED' ? (
|
||||
<>
|
||||
<Button
|
||||
onClick={() => confirmRotate(credential)}
|
||||
disabled={mutatingId === credential.id}
|
||||
>
|
||||
{t['com.affine.integration.mcp-server.action.rotate']()}
|
||||
</Button>
|
||||
<Button
|
||||
variant="error"
|
||||
onClick={() => confirmRevoke(credential)}
|
||||
disabled={mutatingId === credential.id}
|
||||
>
|
||||
{t['com.affine.integration.mcp-server.action.revoke']()}
|
||||
</Button>
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<p
|
||||
className={styles.sectionDescription}
|
||||
style={{ textAlign: 'center' }}
|
||||
>
|
||||
No access token found, please generate one first.
|
||||
</p>
|
||||
<div className={styles.empty}>
|
||||
<div className={styles.title}>
|
||||
{t['com.affine.integration.mcp-server.empty.title']()}
|
||||
</div>
|
||||
<div className={styles.description}>
|
||||
{t['com.affine.integration.mcp-server.empty.description']()}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>Support tools</div>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>doc-read</div>
|
||||
</div>
|
||||
<div className={styles.sectionDescription}>
|
||||
Return the complete text and basic metadata of a single document
|
||||
identified by docId; use this when the user needs the full content
|
||||
of a specific file rather than a search result.
|
||||
<section className={styles.panel}>
|
||||
<div className={styles.panelHeader}>
|
||||
<div className={styles.title}>
|
||||
{t['com.affine.integration.mcp-server.capabilities.title']()}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>doc-semantic-search</div>
|
||||
</div>
|
||||
<div className={styles.sectionDescription}>
|
||||
Retrieve conceptually related passages by performing vector-based
|
||||
semantic similarity search across embedded documents; use this tool
|
||||
only when exact keyword search fails or the user explicitly needs
|
||||
meaning-level matches (e.g., paraphrases, synonyms, broader
|
||||
concepts, recent documents).
|
||||
</div>
|
||||
<div className={styles.capabilities}>
|
||||
{(['read', 'keyword-search', 'semantic-search'] as const).map(key => (
|
||||
<div className={styles.capability} key={key}>
|
||||
{t[`com.affine.integration.mcp-server.capabilities.${key}`]()}
|
||||
</div>
|
||||
))}
|
||||
{readWriteAvailable ? (
|
||||
<div className={styles.capability}>
|
||||
{t['com.affine.integration.mcp-server.capabilities.write']()}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div className={styles.section}>
|
||||
<div className={styles.sectionHeader}>
|
||||
<div className={styles.sectionTitle}>doc-keyword-search</div>
|
||||
</div>
|
||||
<div className={styles.sectionDescription}>
|
||||
Fuzzy search all workspace documents for the exact keyword or phrase
|
||||
supplied and return passages ranked by textual match. Use this tool
|
||||
by default whenever a straightforward term-based or keyword-base
|
||||
lookup is sufficient.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<McpCredentialModal
|
||||
mode={modal}
|
||||
revealed={revealed}
|
||||
config={config}
|
||||
workspaceName={workspaceName}
|
||||
readWriteAvailable={readWriteAvailable}
|
||||
onCreate={create}
|
||||
onClose={() => {
|
||||
setModal(null);
|
||||
setRevealed(null);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -16,7 +16,6 @@ export {
|
||||
DEFAULT_SELF_HOSTED_SERVER_NAME,
|
||||
getSelfHostedServerName,
|
||||
} from './server-name';
|
||||
export { AccessTokenService } from './services/access-token';
|
||||
export { AuthService, type DeviceAuthSession } from './services/auth';
|
||||
export { CaptchaService } from './services/captcha';
|
||||
export { DefaultServerService } from './services/default-server';
|
||||
@@ -26,6 +25,7 @@ export { FetchService } from './services/fetch';
|
||||
export { GraphQLService } from './services/graphql';
|
||||
export { InvitationService } from './services/invitation';
|
||||
export { InvoicesService } from './services/invoices';
|
||||
export { McpCredentialService } from './services/mcp-credential';
|
||||
export type { PublicUserInfo } from './services/public-user';
|
||||
export { PublicUserService } from './services/public-user';
|
||||
export { RealtimeService } from './services/realtime';
|
||||
@@ -115,8 +115,8 @@ import { NbstoreService } from '../storage';
|
||||
import { DocScope, DocService, DocsService } from '../doc';
|
||||
import { DocCreatedByUpdatedBySyncStore } from './stores/doc-created-by-updated-by-sync';
|
||||
import { GlobalDialogService } from '../dialogs';
|
||||
import { AccessTokenService } from './services/access-token';
|
||||
import { AccessTokenStore } from './stores/access-token';
|
||||
import { McpCredentialService } from './services/mcp-credential';
|
||||
import { McpCredentialStore } from './stores/mcp-credential';
|
||||
|
||||
export function configureCloudModule(framework: Framework) {
|
||||
configureDefaultAuthProvider(framework);
|
||||
@@ -194,8 +194,8 @@ export function configureCloudModule(framework: Framework) {
|
||||
.store(PublicUserStore, [GraphQLService])
|
||||
.service(UserSettingsService, [UserSettingsStore])
|
||||
.store(UserSettingsStore, [GraphQLService, NbstoreService])
|
||||
.service(AccessTokenService, [AccessTokenStore])
|
||||
.store(AccessTokenStore, [GraphQLService, NbstoreService]);
|
||||
.service(McpCredentialService, [McpCredentialStore])
|
||||
.store(McpCredentialStore, [GraphQLService]);
|
||||
|
||||
framework
|
||||
.scope(WorkspaceScope)
|
||||
|
||||
@@ -1,54 +0,0 @@
|
||||
import { Framework } from '@toeverything/infra';
|
||||
import { Subject } from 'rxjs';
|
||||
import { describe, expect, test, vi } from 'vitest';
|
||||
|
||||
import { AccessTokenStore } from '../stores/access-token';
|
||||
import { AccessTokenService } from './access-token';
|
||||
|
||||
function createStore() {
|
||||
return {
|
||||
subscribeUserAccessTokens: vi.fn(() => new Subject()),
|
||||
listUserAccessTokens: vi.fn().mockResolvedValue([
|
||||
{
|
||||
id: 'token-1',
|
||||
name: 'MCP',
|
||||
createdAt: '2026-01-01T00:00:00.000Z',
|
||||
expiresAt: null,
|
||||
},
|
||||
]),
|
||||
generateUserAccessToken: vi.fn().mockResolvedValue({
|
||||
id: 'token-1',
|
||||
name: 'MCP',
|
||||
createdAt: '2026-01-01T00:00:00.000Z',
|
||||
expiresAt: null,
|
||||
token: 'secret-token',
|
||||
}),
|
||||
} as unknown as AccessTokenStore;
|
||||
}
|
||||
|
||||
describe('AccessTokenService', () => {
|
||||
test('does not store generated plaintext token in the long-lived list', async () => {
|
||||
const framework = new Framework();
|
||||
framework
|
||||
.store(AccessTokenStore, createStore())
|
||||
.service(AccessTokenService, [AccessTokenStore]);
|
||||
const service = framework.provider().get(AccessTokenService);
|
||||
|
||||
const accessToken = await service.generateUserAccessToken('MCP');
|
||||
|
||||
expect(accessToken.token).toBe('secret-token');
|
||||
expect(service.accessTokens$.value).toEqual([
|
||||
{
|
||||
id: 'token-1',
|
||||
name: 'MCP',
|
||||
createdAt: '2026-01-01T00:00:00.000Z',
|
||||
expiresAt: null,
|
||||
},
|
||||
]);
|
||||
expect(JSON.stringify(service.accessTokens$.value)).not.toContain(
|
||||
'secret-token'
|
||||
);
|
||||
|
||||
service.dispose();
|
||||
});
|
||||
});
|
||||
@@ -1,85 +0,0 @@
|
||||
import { LiveData, OnEvent, Service } from '@toeverything/infra';
|
||||
|
||||
import { AccountChanged } from '../events/account-changed';
|
||||
import { RealtimeLiveQuery } from '../realtime/live-query';
|
||||
import type {
|
||||
AccessToken,
|
||||
AccessTokenStore,
|
||||
ListedAccessToken,
|
||||
} from '../stores/access-token';
|
||||
|
||||
@OnEvent(AccountChanged, e => e.onAccountChanged)
|
||||
export class AccessTokenService extends Service {
|
||||
constructor(private readonly accessTokenStore: AccessTokenStore) {
|
||||
super();
|
||||
this.liveQuery.start();
|
||||
}
|
||||
|
||||
accessTokens$ = new LiveData<ListedAccessToken[] | null>(null);
|
||||
isRevalidating$ = new LiveData(false);
|
||||
error$ = new LiveData<any>(null);
|
||||
private readonly liveQuery = new RealtimeLiveQuery({
|
||||
request: signal => this.requestAccessTokens(signal),
|
||||
subscribe: () => this.accessTokenStore.subscribeUserAccessTokens(),
|
||||
applySnapshot: accessTokens => {
|
||||
this.error$.value = null;
|
||||
this.accessTokens$.value = accessTokens;
|
||||
},
|
||||
applyEvent: () => 'revalidate' as const,
|
||||
onError: error => {
|
||||
this.error$.value = error;
|
||||
},
|
||||
});
|
||||
|
||||
async generateUserAccessToken(name: string): Promise<AccessToken> {
|
||||
const accessToken =
|
||||
await this.accessTokenStore.generateUserAccessToken(name);
|
||||
const { token: _token, ...listedAccessToken } = accessToken;
|
||||
this.accessTokens$.value = [
|
||||
...(this.accessTokens$.value || []),
|
||||
listedAccessToken,
|
||||
];
|
||||
|
||||
await this.waitForRevalidation();
|
||||
|
||||
return accessToken;
|
||||
}
|
||||
|
||||
async revokeUserAccessToken(id: string) {
|
||||
await this.accessTokenStore.revokeUserAccessToken(id);
|
||||
this.accessTokens$.value =
|
||||
this.accessTokens$.value?.filter(token => token.id !== id) ?? null;
|
||||
await this.waitForRevalidation();
|
||||
}
|
||||
|
||||
revalidate = () => {
|
||||
this.liveQuery.revalidate();
|
||||
};
|
||||
|
||||
private onAccountChanged() {
|
||||
this.accessTokens$.value = null;
|
||||
this.revalidate();
|
||||
}
|
||||
|
||||
async waitForRevalidation(signal?: AbortSignal) {
|
||||
this.revalidate();
|
||||
await this.isRevalidating$.waitFor(
|
||||
isRevalidating => !isRevalidating,
|
||||
signal
|
||||
);
|
||||
}
|
||||
|
||||
override dispose(): void {
|
||||
super.dispose();
|
||||
this.liveQuery.dispose();
|
||||
}
|
||||
|
||||
private async requestAccessTokens(signal: AbortSignal) {
|
||||
this.isRevalidating$.value = true;
|
||||
try {
|
||||
return await this.accessTokenStore.listUserAccessTokens(signal);
|
||||
} finally {
|
||||
this.isRevalidating$.value = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
import type {
|
||||
CreateMcpCredentialMutationVariables,
|
||||
McpCredentialsQuery,
|
||||
} from '@affine/graphql';
|
||||
import { LiveData, Service } from '@toeverything/infra';
|
||||
|
||||
import type { McpCredentialStore } from '../stores/mcp-credential';
|
||||
|
||||
export type McpCredential = McpCredentialsQuery['mcpCredentials'][number];
|
||||
|
||||
export class McpCredentialService extends Service {
|
||||
private revalidationId = 0;
|
||||
|
||||
constructor(private readonly store: McpCredentialStore) {
|
||||
super();
|
||||
}
|
||||
|
||||
credentials$ = new LiveData<McpCredential[] | null>(null);
|
||||
readWriteAvailable$ = new LiveData(false);
|
||||
loading$ = new LiveData(false);
|
||||
error$ = new LiveData<unknown>(null);
|
||||
|
||||
async revalidate(workspaceId: string) {
|
||||
const revalidationId = ++this.revalidationId;
|
||||
this.loading$.value = true;
|
||||
try {
|
||||
const result = await this.store.list(workspaceId);
|
||||
if (revalidationId !== this.revalidationId) return;
|
||||
this.credentials$.value = result.mcpCredentials;
|
||||
this.readWriteAvailable$.value = result.mcpCredentialReadWriteAvailable;
|
||||
this.error$.value = null;
|
||||
} catch (error) {
|
||||
if (revalidationId !== this.revalidationId) return;
|
||||
this.error$.value = error;
|
||||
} finally {
|
||||
if (revalidationId === this.revalidationId) {
|
||||
this.loading$.value = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async create(input: CreateMcpCredentialMutationVariables['input']) {
|
||||
const revealed = await this.store.create(input);
|
||||
await this.revalidate(input.workspaceId);
|
||||
return revealed;
|
||||
}
|
||||
|
||||
async rotate(id: string, workspaceId: string, expirationDays: number) {
|
||||
const revealed = await this.store.rotate(id, workspaceId, expirationDays);
|
||||
await this.revalidate(workspaceId);
|
||||
return revealed;
|
||||
}
|
||||
|
||||
async revoke(id: string, workspaceId: string) {
|
||||
await this.store.revoke(id, workspaceId);
|
||||
await this.revalidate(workspaceId);
|
||||
}
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import {
|
||||
generateUserAccessTokenMutation,
|
||||
revokeUserAccessTokenMutation,
|
||||
} from '@affine/graphql';
|
||||
import type { AccessTokenSnapshot } from '@affine/realtime';
|
||||
import { Store } from '@toeverything/infra';
|
||||
|
||||
import type { NbstoreService } from '../../storage';
|
||||
import type { GraphQLService } from '../services/graphql';
|
||||
|
||||
export type AccessToken = AccessTokenSnapshot & { token: string };
|
||||
export type ListedAccessToken = AccessTokenSnapshot;
|
||||
|
||||
export class AccessTokenStore extends Store {
|
||||
constructor(
|
||||
private readonly gqlService: GraphQLService,
|
||||
private readonly nbstoreService: NbstoreService
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
async listUserAccessTokens(
|
||||
signal?: AbortSignal
|
||||
): Promise<ListedAccessToken[]> {
|
||||
const { tokens } = await this.nbstoreService.realtime.request(
|
||||
'user.access-tokens.get',
|
||||
{},
|
||||
{ signal, timeoutMs: 10000 }
|
||||
);
|
||||
return tokens;
|
||||
}
|
||||
|
||||
subscribeUserAccessTokens() {
|
||||
return this.nbstoreService.realtime.subscribe(
|
||||
'user.access-tokens.changed',
|
||||
{}
|
||||
);
|
||||
}
|
||||
|
||||
async generateUserAccessToken(
|
||||
name: string,
|
||||
expiresAt?: string,
|
||||
signal?: AbortSignal
|
||||
) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: generateUserAccessTokenMutation,
|
||||
variables: { input: { name, expiresAt } },
|
||||
context: { signal },
|
||||
});
|
||||
|
||||
return data.generateUserAccessToken;
|
||||
}
|
||||
|
||||
async revokeUserAccessToken(id: string, signal?: AbortSignal) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: revokeUserAccessTokenMutation,
|
||||
variables: { id },
|
||||
context: { signal },
|
||||
});
|
||||
|
||||
return data.revokeUserAccessToken;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
import type { CreateMcpCredentialMutationVariables } from '@affine/graphql';
|
||||
import {
|
||||
createMcpCredentialMutation,
|
||||
mcpCredentialsQuery,
|
||||
revokeMcpCredentialMutation,
|
||||
rotateMcpCredentialMutation,
|
||||
} from '@affine/graphql';
|
||||
import { Store } from '@toeverything/infra';
|
||||
|
||||
import type { GraphQLService } from '../services/graphql';
|
||||
|
||||
export class McpCredentialStore extends Store {
|
||||
constructor(private readonly gqlService: GraphQLService) {
|
||||
super();
|
||||
}
|
||||
|
||||
async list(workspaceId: string, signal?: AbortSignal) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: mcpCredentialsQuery,
|
||||
variables: { workspaceId },
|
||||
context: { signal },
|
||||
});
|
||||
return data;
|
||||
}
|
||||
|
||||
async create(input: CreateMcpCredentialMutationVariables['input']) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: createMcpCredentialMutation,
|
||||
variables: {
|
||||
input: {
|
||||
workspaceId: input.workspaceId,
|
||||
name: input.name,
|
||||
accessMode: input.accessMode,
|
||||
expirationDays: input.expirationDays,
|
||||
},
|
||||
},
|
||||
});
|
||||
return data.createMcpCredential;
|
||||
}
|
||||
|
||||
async rotate(id: string, workspaceId: string, expirationDays: number) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: rotateMcpCredentialMutation,
|
||||
variables: { id, workspaceId, expirationDays },
|
||||
});
|
||||
return data.rotateMcpCredential;
|
||||
}
|
||||
|
||||
async revoke(id: string, workspaceId: string) {
|
||||
const data = await this.gqlService.gql({
|
||||
query: revokeMcpCredentialMutation,
|
||||
variables: { id, workspaceId },
|
||||
});
|
||||
return data.revokeMcpCredential;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user