yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Name API keys consistently as the model

Browse Source
This commit is contained in:
Tom Moor
2023-04-08 14:16:49 -04:00
parent aab3a49f2c
commit 3115bbd5ef
7 changed files with 35 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/hooks/useSettingsConfig.ts
View File

@@ -17,6 +17,7 @@ import {
import React from "react";
import { useTranslation } from "react-i18next";
import { integrationSettingsPath } from "@shared/utils/routeHelpers";
import ApiKeys from "~/scenes/Settings/ApiKeys";
import Details from "~/scenes/Settings/Details";
import Export from "~/scenes/Settings/Export";
import Features from "~/scenes/Settings/Features";
@@ -30,7 +31,6 @@ import Profile from "~/scenes/Settings/Profile";
import Security from "~/scenes/Settings/Security";
import SelfHosted from "~/scenes/Settings/SelfHosted";
import Shares from "~/scenes/Settings/Shares";
import Tokens from "~/scenes/Settings/Tokens";
import Zapier from "~/scenes/Settings/Zapier";
import GoogleIcon from "~/components/Icons/GoogleIcon";
import ZapierIcon from "~/components/Icons/ZapierIcon";
@@ -89,7 +89,7 @@ const useSettingsConfig = () => {
Api: {
name: t("API Tokens"),
path: "/settings/tokens",
component: Tokens,
component: ApiKeys,
enabled: can.createApiKey,
group: t("Account"),
icon: CodeIcon,

18
app/menus/ApiKeyMenu.tsx
View File

@@ -3,7 +3,7 @@ import * as React from "react";
import { useTranslation } from "react-i18next";
import { useMenuState } from "reakit/Menu";
import ApiKey from "~/models/ApiKey";
import TokenRevokeDialog from "~/scenes/Settings/components/TokenRevokeDialog";
import ApiKeyRevokeDialog from "~/scenes/Settings/components/ApiKeyRevokeDialog";
import ContextMenu from "~/components/ContextMenu";
import MenuItem from "~/components/ContextMenu/MenuItem";
import OverflowMenuButton from "~/components/ContextMenu/OverflowMenuButton";
@@ -11,12 +11,10 @@ import useStores from "~/hooks/useStores";
type Props = {
/** The apiKey to associate with the menu */
token: ApiKey;
/** CSS class name */
className?: string;
apiKey: ApiKey;
};
function ApiKeyMenu({ token, className }: Props) {
function ApiKeyMenu({ apiKey }: Props) {
const menu = useMenuState({
modal: true,
});
@@ -28,18 +26,14 @@ function ApiKeyMenu({ token, className }: Props) {
title: t("Revoke token"),
isCentered: true,
content: (
<TokenRevokeDialog onSubmit={dialogs.closeAllModals} token={token} />
<ApiKeyRevokeDialog onSubmit={dialogs.closeAllModals} apiKey={apiKey} />
),
});
}, [t, dialogs, token]);
}, [t, dialogs, apiKey]);
return (
<>
<OverflowMenuButton
aria-label={t("Show menu")}
className={className}
{...menu}
/>
<OverflowMenuButton aria-label={t("Show menu")} {...menu} />
<ContextMenu {...menu}>
<MenuItem {...menu} onClick={handleRevoke} dangerous>
{t("Revoke")}

11
app/scenes/Settings/Tokens.tsx → app/scenes/Settings/ApiKeys.tsx
View File

@@ -15,9 +15,9 @@ import useBoolean from "~/hooks/useBoolean";
import useCurrentTeam from "~/hooks/useCurrentTeam";
import usePolicy from "~/hooks/usePolicy";
import useStores from "~/hooks/useStores";
import TokenListItem from "./components/TokenListItem";
import ApiKeyListItem from "./components/ApiKeyListItem";
function Tokens() {
function ApiKeys() {
const team = useCurrentTeam();
const { t } = useTranslation();
const { apiKeys } = useStores();
@@ -59,14 +59,15 @@ function Tokens() {
fetch={apiKeys.fetchPage}
items={apiKeys.orderedData}
heading={<h2>{t("Active")}</h2>}
renderItem={(token: ApiKey) => (
<TokenListItem key={token.id} token={token} />
renderItem={(apiKey: ApiKey) => (
<ApiKeyListItem key={apiKey.id} apiKey={apiKey} />
)}
/>
<Modal
title={t("Create a token")}
onRequestClose={handleNewModalClose}
isOpen={newModalOpen}
isCentered
>
<APITokenNew onSubmit={handleNewModalClose} />
</Modal>
@@ -74,4 +75,4 @@ function Tokens() {
);
}
export default observer(Tokens);
export default observer(ApiKeys);

1
app/scenes/Settings/Notifications.tsx
View File

@@ -157,6 +157,7 @@ function Notifications() {
return (
<SettingRow
key={option.event}
visible={option.visible}
label={
<Flex align="center" gap={4}>

16
app/scenes/Settings/components/TokenListItem.tsx → app/scenes/Settings/components/ApiKeyListItem.tsx
View File

@@ -10,10 +10,10 @@ import useToasts from "~/hooks/useToasts";
import ApiKeyMenu from "~/menus/ApiKeyMenu";
type Props = {
token: ApiKey;
apiKey: ApiKey;
};
const TokenListItem = ({ token }: Props) => {
const ApiKeyListItem = ({ apiKey }: Props) => {
const { t } = useTranslation();
const { showToast } = useToasts();
const [linkCopied, setLinkCopied] = React.useState<boolean>(false);
@@ -35,21 +35,21 @@ const TokenListItem = ({ token }: Props) => {
return (
<ListItem
key={token.id}
title={token.name}
subtitle={<code>{token.secret.slice(0, 15)}…</code>}
key={apiKey.id}
title={apiKey.name}
subtitle={<code>{apiKey.secret.slice(0, 15)}…</code>}
actions={
<Flex align="center" gap={8}>
<CopyToClipboard text={token.secret} onCopy={handleCopy}>
<CopyToClipboard text={apiKey.secret} onCopy={handleCopy}>
<Button type="button" icon={<CopyIcon />} neutral borderOnHover>
{linkCopied ? t("Copied") : t("Copy")}
</Button>
</CopyToClipboard>
<ApiKeyMenu token={token} />
<ApiKeyMenu apiKey={apiKey} />
</Flex>
}
/>
);
};
export default TokenListItem;
export default ApiKeyListItem;

8
app/scenes/Settings/components/TokenRevokeDialog.tsx → app/scenes/Settings/components/ApiKeyRevokeDialog.tsx
View File

@@ -4,15 +4,15 @@ import ApiKey from "~/models/ApiKey";
import ConfirmationDialog from "~/components/ConfirmationDialog";
type Props = {
token: ApiKey;
apiKey: ApiKey;
onSubmit: () => void;
};
export default function TokenRevokeDialog({ token, onSubmit }: Props) {
export default function ApiKeyRevokeDialog({ apiKey, onSubmit }: Props) {
const { t } = useTranslation();
const handleSubmit = async () => {
await token.delete();
await apiKey.delete();
onSubmit();
};
@@ -24,7 +24,7 @@ export default function TokenRevokeDialog({ token, onSubmit }: Props) {
danger
>
{t("Are you sure you want to revoke the {{ tokenName }} token?", {
tokenName: token.name,
tokenName: apiKey.name,
})}
</ConfirmationDialog>
);

16
shared/i18n/locales/en_US/translation.json
View File

@@ -658,6 +658,14 @@
"Search titles only": "Search titles only",
"No documents found for your search filters.": "No documents found for your search filters.",
"Search Results": "Search Results",
"New token": "New token",
"You can create an unlimited amount of personal tokens to authenticate\n with the API. Tokens have the same permissions as your user account.\n For more details see the <em>developer documentation</em>.": "You can create an unlimited amount of personal tokens to authenticate\n with the API. Tokens have the same permissions as your user account.\n For more details see the <em>developer documentation</em>.",
"Active": "Active",
"Create a token": "Create a token",
"API token copied to clipboard": "API token copied to clipboard",
"Copied": "Copied",
"Revoking": "Revoking",
"Are you sure you want to revoke the {{ tokenName }} token?": "Are you sure you want to revoke the {{ tokenName }} token?",
"Allowed domains": "Allowed domains",
"The domains which should be allowed to create new accounts using SSO. Changing this setting does not affect existing user accounts.": "The domains which should be allowed to create new accounts using SSO. Changing this setting does not affect existing user accounts.",
"Remove domain": "Remove domain",
@@ -688,11 +696,6 @@
"Last accessed": "Last accessed",
"Date shared": "Date shared",
"Shared nested": "Shared nested",
"API token copied to clipboard": "API token copied to clipboard",
"Copied": "Copied",
"Revoking": "Revoking",
"Are you sure you want to revoke the {{ tokenName }} token?": "Are you sure you want to revoke the {{ tokenName }} token?",
"Active": "Active",
"Everyone": "Everyone",
"Admins": "Admins",
"Settings saved": "Settings saved",
@@ -808,9 +811,6 @@
"Sharing is currently disabled.": "Sharing is currently disabled.",
"You can globally enable and disable public document sharing in the <em>security settings</em>.": "You can globally enable and disable public document sharing in the <em>security settings</em>.",
"Documents that have been shared are listed below. Anyone that has the public link can access a read-only version of the document until the link has been revoked.": "Documents that have been shared are listed below. Anyone that has the public link can access a read-only version of the document until the link has been revoked.",
"New token": "New token",
"You can create an unlimited amount of personal tokens to authenticate\n with the API. Tokens have the same permissions as your user account.\n For more details see the <em>developer documentation</em>.": "You can create an unlimited amount of personal tokens to authenticate\n with the API. Tokens have the same permissions as your user account.\n For more details see the <em>developer documentation</em>.",
"Create a token": "Create a token",
"Zapier is a platform that allows {{appName}} to easily integrate with thousands of other business tools. Automate your workflows, sync data, and more.": "Zapier is a platform that allows {{appName}} to easily integrate with thousands of other business tools. Automate your workflows, sync data, and more.",
"Your are creating a new workspace using your current account — <em>{{email}}</em>": "Your are creating a new workspace using your current account — <em>{{email}}</em>",
"Workspace name": "Workspace name",