aiden
/
memos
mirror of https://github.com/usememos/memos
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: simplify access token toast and remove unnecessary fragment wrapper

Browse Source 
- Removed redundant React fragment in Attachments.tsx for cleaner structure
- Removed fallback logic for access token description in toast; use created.description directly since description is always required by client-side validation.
- Removed unused i18n key access-token-created-default since description is always present
pull/5111/head
Nic Luckie 3 weeks ago
parent c7b53930cc
commit d3e6302526
3 changed files with 89 additions and 97 deletions
Show Stats Download Patch File Download Diff File

9
web/src/components/Settings/AccessTokenSection.tsx
Unescape Escape View File

@ -29,15 +29,10 @@ const AccessTokenSection = () => {
});
}, []);
const handleCreateAccessTokenDialogConfirm = async (created?: UserAccessToken) => {
// Refresh list to reflect server state and include stable fields like issuedAt/expiresAt
const handleCreateAccessTokenDialogConfirm = async (created: UserAccessToken) => {
const accessTokens = await listAccessTokens(currentUser.name);
setUserAccessTokens(accessTokens);
toast.success(
t("setting.access-token-section.create-dialog.access-token-created", {
description: created?.description ?? t("setting.access-token-section.create-dialog.access-token-created-default"),
}),
);
toast.success(t("setting.access-token-section.create-dialog.access-token-created", { description: created.description }));
};
const handleCreateToken = () => {

1
web/src/locales/en.json
Unescape Escape View File

@ -245,7 +245,6 @@
"access-token-deleted": "Access token `{{description}}` deleted",
"create-dialog": {
"access-token-created": "Access token `{{description}}` created",
"access-token-created-default": "Access token created",
"create-access-token": "Create Access Token",
"created-at": "Created At",
"description": "Description",

176
web/src/pages/Attachments.tsx
Unescape Escape View File

@ -55,104 +55,102 @@ const Attachments = observer(() => {
}, []);
return (
<>
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
{!md && <MobileHeader />}
<div className="w-full px-4 sm:px-6">
<div className="w-full border border-border flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-background text-foreground">
<div className="relative w-full flex flex-row justify-between items-center">
<p className="py-1 flex flex-row justify-start items-center select-none opacity-80">
<PaperclipIcon className="w-6 h-auto mr-1 opacity-80" />
<span className="text-lg">{t("common.attachments")}</span>
</p>
<div>
<div className="relative max-w-32">
<SearchIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-muted-foreground" />
<Input
className="pl-9"
placeholder={t("common.search")}
value={state.searchQuery}
onChange={(e) => setState({ ...state, searchQuery: e.target.value })}
/>
</div>
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
{!md && <MobileHeader />}
<div className="w-full px-4 sm:px-6">
<div className="w-full border border-border flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-background text-foreground">
<div className="relative w-full flex flex-row justify-between items-center">
<p className="py-1 flex flex-row justify-start items-center select-none opacity-80">
<PaperclipIcon className="w-6 h-auto mr-1 opacity-80" />
<span className="text-lg">{t("common.attachments")}</span>
</p>
<div>
<div className="relative max-w-32">
<SearchIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-muted-foreground" />
<Input
className="pl-9"
placeholder={t("common.search")}
value={state.searchQuery}
onChange={(e) => setState({ ...state, searchQuery: e.target.value })}
/>
</div>
</div>
<div className="w-full flex flex-col justify-start items-start mt-4 mb-6">
{loadingState.isLoading ? (
<div className="w-full h-32 flex flex-col justify-center items-center">
<p className="w-full text-center text-base my-6 mt-8">{t("resource.fetching-data")}</p>
</div>
) : (
<>
{filteredAttachments.length === 0 ? (
<div className="w-full mt-8 mb-8 flex flex-col justify-center items-center italic">
<Empty />
<p className="mt-4 text-muted-foreground">{t("message.no-data")}</p>
</div>
) : (
<div className={"w-full h-auto px-2 flex flex-col justify-start items-start gap-y-8"}>
{Array.from(groupedAttachments.entries()).map(([monthStr, attachments]) => {
return (
<div key={monthStr} className="w-full flex flex-row justify-start items-start">
<div className="w-16 sm:w-24 pt-4 sm:pl-4 flex flex-col justify-start items-start">
<span className="text-sm opacity-60">{dayjs(monthStr).year()}</span>
<span className="font-medium text-xl">
{dayjs(monthStr).toDate().toLocaleString(i18n.language, { month: "short" })}
</span>
</div>
<div className="w-full max-w-[calc(100%-4rem)] sm:max-w-[calc(100%-6rem)] flex flex-row justify-start items-start gap-4 flex-wrap">
{attachments.map((attachment) => {
return (
<div key={attachment.name} className="w-24 sm:w-32 h-auto flex flex-col justify-start items-start">
<div className="w-24 h-24 flex justify-center items-center sm:w-32 sm:h-32 border border-border overflow-clip rounded-xl cursor-pointer hover:shadow hover:opacity-80">
<AttachmentIcon attachment={attachment} strokeWidth={0.5} />
</div>
<div className="w-full max-w-full flex flex-row justify-between items-center mt-1 px-1">
<p className="text-xs shrink text-muted-foreground truncate">{attachment.filename}</p>
</div>
</div>
<div className="w-full flex flex-col justify-start items-start mt-4 mb-6">
{loadingState.isLoading ? (
<div className="w-full h-32 flex flex-col justify-center items-center">
<p className="w-full text-center text-base my-6 mt-8">{t("resource.fetching-data")}</p>
</div>
) : (
<>
{filteredAttachments.length === 0 ? (
<div className="w-full mt-8 mb-8 flex flex-col justify-center items-center italic">
<Empty />
<p className="mt-4 text-muted-foreground">{t("message.no-data")}</p>
</div>
) : (
<div className={"w-full h-auto px-2 flex flex-col justify-start items-start gap-y-8"}>
{Array.from(groupedAttachments.entries()).map(([monthStr, attachments]) => {
return (
<div key={monthStr} className="w-full flex flex-row justify-start items-start">
<div className="w-16 sm:w-24 pt-4 sm:pl-4 flex flex-col justify-start items-start">
<span className="text-sm opacity-60">{dayjs(monthStr).year()}</span>
<span className="font-medium text-xl">
{dayjs(monthStr).toDate().toLocaleString(i18n.language, { month: "short" })}
</span>
</div>
<div className="w-full max-w-[calc(100%-4rem)] sm:max-w-[calc(100%-6rem)] flex flex-row justify-start items-start gap-4 flex-wrap">
{attachments.map((attachment) => {
return (
<div key={attachment.name} className="w-24 sm:w-32 h-auto flex flex-col justify-start items-start">
<div className="w-24 h-24 flex justify-center items-center sm:w-32 sm:h-32 border border-border overflow-clip rounded-xl cursor-pointer hover:shadow hover:opacity-80">
<AttachmentIcon attachment={attachment} strokeWidth={0.5} />
</div>
);
})}
</div>
<div className="w-full max-w-full flex flex-row justify-between items-center mt-1 px-1">
<p className="text-xs shrink text-muted-foreground truncate">{attachment.filename}</p>
</div>
</div>
);
})}
</div>
);
})}
</div>
);
})}
{unusedAttachments.length > 0 && (
<>
<Separator />
<div className="w-full flex flex-row justify-start items-start">
<div className="w-16 sm:w-24 sm:pl-4 flex flex-col justify-start items-start"></div>
<div className="w-full max-w-[calc(100%-4rem)] sm:max-w-[calc(100%-6rem)] flex flex-row justify-start items-start gap-4 flex-wrap">
<div className="w-full flex flex-row justify-start items-center gap-2">
<span className="text-muted-foreground">{t("resource.unused-resources")}</span>
<span className="text-muted-foreground opacity-80">({unusedAttachments.length})</span>
</div>
{unusedAttachments.map((attachment) => {
return (
<div key={attachment.name} className="w-24 sm:w-32 h-auto flex flex-col justify-start items-start">
<div className="w-24 h-24 flex justify-center items-center sm:w-32 sm:h-32 border border-border overflow-clip rounded-xl cursor-pointer hover:shadow hover:opacity-80">
<AttachmentIcon attachment={attachment} strokeWidth={0.5} />
</div>
<div className="w-full max-w-full flex flex-row justify-between items-center mt-1 px-1">
<p className="text-xs shrink text-muted-foreground truncate">{attachment.filename}</p>
</div>
</div>
);
})}
{unusedAttachments.length > 0 && (
<>
<Separator />
<div className="w-full flex flex-row justify-start items-start">
<div className="w-16 sm:w-24 sm:pl-4 flex flex-col justify-start items-start"></div>
<div className="w-full max-w-[calc(100%-4rem)] sm:max-w-[calc(100%-6rem)] flex flex-row justify-start items-start gap-4 flex-wrap">
<div className="w-full flex flex-row justify-start items-center gap-2">
<span className="text-muted-foreground">{t("resource.unused-resources")}</span>
<span className="text-muted-foreground opacity-80">({unusedAttachments.length})</span>
</div>
{unusedAttachments.map((attachment) => {
return (
<div key={attachment.name} className="w-24 sm:w-32 h-auto flex flex-col justify-start items-start">
<div className="w-24 h-24 flex justify-center items-center sm:w-32 sm:h-32 border border-border overflow-clip rounded-xl cursor-pointer hover:shadow hover:opacity-80">
<AttachmentIcon attachment={attachment} strokeWidth={0.5} />
</div>
<div className="w-full max-w-full flex flex-row justify-between items-center mt-1 px-1">
<p className="text-xs shrink text-muted-foreground truncate">{attachment.filename}</p>
</div>
</div>
);
})}
</div>
</>
)}
</div>
)}
</>
)}
</div>
</div>
</>
)}
</div>
)}
</>
)}
</div>
</div>
</section>
</>
</div>
</section>
);
});

Write Preview
Loading…
Cancel
Save