strtus/Vercel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify admin checklist

Browse Source
This commit is contained in:
Sam Becker 2024-02-10 16:36:36 -06:00
parent 9aaed392dc
commit 689f58c442
4 changed files with 29 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Checklist.tsx
View File

@ -4,10 +4,12 @@ import { clsx } from 'clsx/lite';
export default function Checklist({ export default function Checklist({
title, title,
icon, icon,
optional,
children, children,
}: { }: {
title: string title: string
icon?: ReactNode icon?: ReactNode
optional?: boolean
children: ReactNode children: ReactNode
}) { }) {
return ( return (
@ -15,11 +17,13 @@ export default function Checklist({
<div className={clsx( <div className={clsx(
'flex items-center gap-3', 'flex items-center gap-3',
'text-gray-600 dark:text-gray-300', 'text-gray-600 dark:text-gray-300',
'pl-[18px] mb-3', 'pl-[18px] mb-3 text-lg',
)}> )}>
{icon} {icon}
<div className="text-lg"> <div className="flex gap-1.5">
{title} <div>{title}</div>
{optional &&
<div className="text-dim">(Optional)</div>}
</div> </div>
</div> </div>
<div className={clsx( <div className={clsx(

1
src/components/ChecklistRow.tsx
View File

@ -27,7 +27,6 @@ export default function ChecklistRow({
<div className="flex flex-col min-w-0"> <div className="flex flex-col min-w-0">
<div className="font-bold dark:text-gray-300"> <div className="font-bold dark:text-gray-300">
{title} {title}
{optional && ' (optional)'}
</div> </div>
<div> <div>
{children} {children}

37
src/site/SiteChecklistClient.tsx
View File

@ -29,7 +29,7 @@ export default function SiteChecklistClient({
hasAwsS3Storage, hasAwsS3Storage,
hasMultipleStorageProviders, hasMultipleStorageProviders,
currentStorage, currentStorage,
hasAuth, hasAuthSecret,
hasAdminUser, hasAdminUser,
hasTitle, hasTitle,
hasDomain, hasDomain,
@ -198,26 +198,27 @@ export default function SiteChecklistClient({
> >
<ChecklistRow <ChecklistRow
title="Setup auth" title="Setup auth"
status={hasAuth} status={hasAuthSecret}
isPending={isPendingPage} isPending={isPendingPage}
> >
Store auth secret in environment variable: Store auth secret in environment variable:
<div className="overflow-x-auto"> {!hasAuthSecret &&
<InfoBlock className="my-1.5 inline-flex" padding="tight"> <div className="overflow-x-auto">
<div className="flex flex-nowrap items-center gap-4"> <InfoBlock className="my-1.5 inline-flex" padding="tight">
<span>{secret}</span> <div className="flex flex-nowrap items-center gap-4">
<div className="flex items-center gap-0.5"> <span>{secret}</span>
{renderCopyButton('Secret', secret)} <div className="flex items-center gap-0.5">
<IconButton {renderCopyButton('Secret', secret)}
icon={<BiRefresh size={18} />} <IconButton
onClick={refreshSecret} icon={<BiRefresh size={18} />}
isLoading={isPendingSecret} onClick={refreshSecret}
spinnerColor="text" isLoading={isPendingSecret}
/> spinnerColor="text"
/>
</div>
</div> </div>
</div> </InfoBlock>
</InfoBlock> </div>}
</div>
{renderEnvVars(['AUTH_SECRET'])} {renderEnvVars(['AUTH_SECRET'])}
</ChecklistRow> </ChecklistRow>
<ChecklistRow <ChecklistRow
@ -237,6 +238,7 @@ export default function SiteChecklistClient({
<Checklist <Checklist
title="Content" title="Content"
icon={<BiPencil size={16} />} icon={<BiPencil size={16} />}
optional
> >
<ChecklistRow <ChecklistRow
title="Add title" title="Add title"
@ -260,6 +262,7 @@ export default function SiteChecklistClient({
<Checklist <Checklist
title="Settings" title="Settings"
icon={<BiCog size={16} />} icon={<BiCog size={16} />}
optional
> >
<ChecklistRow <ChecklistRow
title="Pro Mode" title="Pro Mode"

4
src/site/config.ts
View File

@ -110,7 +110,7 @@ export const CONFIG_CHECKLIST_STATUS = {
HAS_AWS_S3_STORAGE, HAS_AWS_S3_STORAGE,
hasMultipleStorageProviders: HAS_MULTIPLE_STORAGE_PROVIDERS, hasMultipleStorageProviders: HAS_MULTIPLE_STORAGE_PROVIDERS,
currentStorage: CURRENT_STORAGE, currentStorage: CURRENT_STORAGE,
hasAuth: (process.env.AUTH_SECRET ?? '').length > 0, hasAuthSecret: (process.env.AUTH_SECRET ?? '').length > 0,
hasAdminUser: ( hasAdminUser: (
(process.env.ADMIN_EMAIL ?? '').length > 0 && (process.env.ADMIN_EMAIL ?? '').length > 0 &&
(process.env.ADMIN_PASSWORD ?? '').length > 0 (process.env.ADMIN_PASSWORD ?? '').length > 0
@ -134,5 +134,5 @@ export type ConfigChecklistStatus = typeof CONFIG_CHECKLIST_STATUS;
export const IS_SITE_READY = export const IS_SITE_READY =
CONFIG_CHECKLIST_STATUS.hasPostgres && CONFIG_CHECKLIST_STATUS.hasPostgres &&
CONFIG_CHECKLIST_STATUS.hasStorage && CONFIG_CHECKLIST_STATUS.hasStorage &&
CONFIG_CHECKLIST_STATUS.hasAuth && CONFIG_CHECKLIST_STATUS.hasAuthSecret &&
CONFIG_CHECKLIST_STATUS.hasAdminUser; CONFIG_CHECKLIST_STATUS.hasAdminUser;