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

Show simplified configuration view on installation

Browse Source
This commit is contained in:
Sam Becker 2024-04-27 13:40:41 -05:00
parent 5a3f169ef9
commit a6b099a83a
3 changed files with 166 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/photo/PhotosEmptyState.tsx
View File

@ -27,7 +27,7 @@ export default function PhotosEmptyState() {
{!IS_SITE_READY ? 'Finish Setup' : 'Setup Complete!'} {!IS_SITE_READY ? 'Finish Setup' : 'Setup Complete!'}
</div> </div>
{!IS_SITE_READY {!IS_SITE_READY
? <SiteChecklist /> ? <SiteChecklist simplifiedView />
: <div className="max-w-md text-center space-y-6"> : <div className="max-w-md text-center space-y-6">
<div className="space-y-2"> <div className="space-y-2">
<div> <div>

7
src/site/SiteChecklist.tsx
View File

@ -2,11 +2,16 @@ import { generateAuthSecret } from '@/auth';
import SiteChecklistClient from './SiteChecklistClient'; import SiteChecklistClient from './SiteChecklistClient';
import { CONFIG_CHECKLIST_STATUS } from '@/site/config'; import { CONFIG_CHECKLIST_STATUS } from '@/site/config';
export default async function SiteChecklist() { export default async function SiteChecklist({
simplifiedView,
}: {
simplifiedView?: boolean
}) {
const secret = await generateAuthSecret(); const secret = await generateAuthSecret();
return ( return (
<SiteChecklistClient {...{ <SiteChecklistClient {...{
...CONFIG_CHECKLIST_STATUS, ...CONFIG_CHECKLIST_STATUS,
simplifiedView,
secret, secret,
}} /> }} />
); );

314
src/site/SiteChecklistClient.tsx
View File

@ -50,9 +50,11 @@ export default function SiteChecklistClient({
isOgTextBottomAligned, isOgTextBottomAligned,
gridAspectRatio, gridAspectRatio,
hasGridAspectRatio, hasGridAspectRatio,
simplifiedView,
showRefreshButton, showRefreshButton,
secret, secret,
}: ConfigChecklistStatus & { }: ConfigChecklistStatus & {
simplifiedView?: boolean
showRefreshButton?: boolean showRefreshButton?: boolean
secret: string secret: string
}) { }) {
@ -272,166 +274,168 @@ export default function SiteChecklistClient({
{renderEnvVars(['NEXT_PUBLIC_SITE_DOMAIN'])} {renderEnvVars(['NEXT_PUBLIC_SITE_DOMAIN'])}
</ChecklistRow> </ChecklistRow>
</Checklist> </Checklist>
<Checklist {!simplifiedView && <>
title="AI Text Generation" <Checklist
icon={<HiSparkles />} title="AI Text Generation"
experimental icon={<HiSparkles />}
optional
>
<ChecklistRow
title="Add OpenAI Secret Key"
status={isAiTextGenerationEnabled}
isPending={isPendingPage}
optional
>
Store your OpenAI secret key in order to add experimental support
for AI-generated text descriptions and enable an invisible field
called {'"Semantic Description"'} used to support CMD-K search
{renderEnvVars(['OPENAI_SECRET_KEY'])}
</ChecklistRow>
<ChecklistRow
title="Enable Rate Limiting"
status={hasVercelKV}
isPending={isPendingPage}
optional
>
{renderLink(
// eslint-disable-next-line max-len
'https://vercel.com/docs/storage/vercel-kv/quickstart#create-a-kv-database',
'Create Vercel KV store',
)}
{' '}
and connect to project in order to enable rate limiting
</ChecklistRow>
<ChecklistRow
// eslint-disable-next-line max-len
title={`Auto-generated fields: ${aiTextAutoGeneratedFields.join(', ')}`}
status={hasAiTextAutoGeneratedFields}
isPending={isPendingPage}
optional
>
Comma-separated fields to auto-generate when
uploading photos. Accepted values: title, caption,
tags, description, all, or none (default is {'"all"'}).
{renderEnvVars(['AI_TEXT_AUTO_GENERATED_FIELDS'])}
</ChecklistRow>
</Checklist>
<Checklist
title="Settings"
icon={<BiCog size={16} />}
optional
>
<ChecklistRow
title="Pro mode"
status={isProModeEnabled}
isPending={isPendingPage}
optional
>
Set environment variable to {'"1"'} to enable
higher quality image storage:
{renderEnvVars(['NEXT_PUBLIC_PRO_MODE'])}
</ChecklistRow>
<ChecklistRow
title="Static Optimization"
status={isStaticallyOptimized}
isPending={isPendingPage}
optional
experimental experimental
>
Set environment variable to {'"1"'} to enable
static optimization, i.e., build pages ahead of time:
{renderEnvVars(['NEXT_PUBLIC_STATICALLY_OPTIMIZE'])}
</ChecklistRow>
<ChecklistRow
title="Image Blur"
status={isBlurEnabled}
isPending={isPendingPage}
optional optional
> >
Set environment variable to {'"1"'} to prevent <ChecklistRow
image blur data being stored and displayed title="Add OpenAI Secret Key"
{renderEnvVars(['NEXT_PUBLIC_BLUR_DISABLED'])} status={isAiTextGenerationEnabled}
</ChecklistRow> isPending={isPendingPage}
<ChecklistRow optional
title="Geo privacy" >
status={isGeoPrivacyEnabled} Store your OpenAI secret key in order to add experimental support
isPending={isPendingPage} for AI-generated text descriptions and enable an invisible field
called {'"Semantic Description"'} used to support CMD-K search
{renderEnvVars(['OPENAI_SECRET_KEY'])}
</ChecklistRow>
<ChecklistRow
title="Enable Rate Limiting"
status={hasVercelKV}
isPending={isPendingPage}
optional
>
{renderLink(
// eslint-disable-next-line max-len
'https://vercel.com/docs/storage/vercel-kv/quickstart#create-a-kv-database',
'Create Vercel KV store',
)}
{' '}
and connect to project in order to enable rate limiting
</ChecklistRow>
<ChecklistRow
// eslint-disable-next-line max-len
title={`Auto-generated fields: ${aiTextAutoGeneratedFields.join(', ')}`}
status={hasAiTextAutoGeneratedFields}
isPending={isPendingPage}
optional
>
Comma-separated fields to auto-generate when
uploading photos. Accepted values: title, caption,
tags, description, all, or none (default is {'"all"'}).
{renderEnvVars(['AI_TEXT_AUTO_GENERATED_FIELDS'])}
</ChecklistRow>
</Checklist>
<Checklist
title="Settings"
icon={<BiCog size={16} />}
optional optional
> >
Set environment variable to {'"1"'} to disable <ChecklistRow
collection/display of location-based data title="Pro mode"
{renderEnvVars(['NEXT_PUBLIC_GEO_PRIVACY'])} status={isProModeEnabled}
</ChecklistRow> isPending={isPendingPage}
<ChecklistRow optional
title="Priority order" >
status={isPriorityOrderEnabled} Set environment variable to {'"1"'} to enable
isPending={isPendingPage} higher quality image storage:
optional {renderEnvVars(['NEXT_PUBLIC_PRO_MODE'])}
> </ChecklistRow>
Set environment variable to {'"1"'} to prevent <ChecklistRow
priority order photo field affecting photo order title="Static Optimization"
{renderEnvVars(['NEXT_PUBLIC_IGNORE_PRIORITY_ORDER'])} status={isStaticallyOptimized}
</ChecklistRow> isPending={isPendingPage}
<ChecklistRow optional
title="Public API" experimental
status={isPublicApiEnabled} >
isPending={isPendingPage} Set environment variable to {'"1"'} to enable
optional static optimization, i.e., build pages ahead of time:
> {renderEnvVars(['NEXT_PUBLIC_STATICALLY_OPTIMIZE'])}
Set environment variable to {'"1"'} to enable </ChecklistRow>
a public API available at <code>/api</code>: <ChecklistRow
{renderEnvVars(['NEXT_PUBLIC_PUBLIC_API'])} title="Image Blur"
</ChecklistRow> status={isBlurEnabled}
<ChecklistRow isPending={isPendingPage}
title="Show repo link" optional
status={showRepoLink} >
isPending={isPendingPage} Set environment variable to {'"1"'} to prevent
optional image blur data being stored and displayed
> {renderEnvVars(['NEXT_PUBLIC_BLUR_DISABLED'])}
Set environment variable to {'"1"'} to hide footer link: </ChecklistRow>
{renderEnvVars(['NEXT_PUBLIC_HIDE_REPO_LINK'])} <ChecklistRow
</ChecklistRow> title="Geo privacy"
<ChecklistRow status={isGeoPrivacyEnabled}
title="Show Fujifilm simulations" isPending={isPendingPage}
status={showFilmSimulations} optional
isPending={isPendingPage} >
optional Set environment variable to {'"1"'} to disable
> collection/display of location-based data
Set environment variable to {'"1"'} to prevent {renderEnvVars(['NEXT_PUBLIC_GEO_PRIVACY'])}
simulations showing up in <code>/grid</code> sidebar: </ChecklistRow>
{renderEnvVars(['NEXT_PUBLIC_HIDE_FILM_SIMULATIONS'])} <ChecklistRow
</ChecklistRow> title="Priority order"
<ChecklistRow status={isPriorityOrderEnabled}
title="Show EXIF data" isPending={isPendingPage}
status={showExifInfo} optional
isPending={isPendingPage} >
optional Set environment variable to {'"1"'} to prevent
> priority order photo field affecting photo order
Set environment variable to {'"1"'} to hide EXIF data: {renderEnvVars(['NEXT_PUBLIC_IGNORE_PRIORITY_ORDER'])}
{renderEnvVars(['NEXT_PUBLIC_HIDE_EXIF_DATA'])} </ChecklistRow>
</ChecklistRow> <ChecklistRow
<ChecklistRow title="Public API"
title={`Grid aspect ratio: ${gridAspectRatio}`} status={isPublicApiEnabled}
status={hasGridAspectRatio} isPending={isPendingPage}
isPending={isPendingPage} optional
optional >
> Set environment variable to {'"1"'} to enable
Set environment variable to any number to enforce aspect ratio a public API available at <code>/api</code>:
{' '} {renderEnvVars(['NEXT_PUBLIC_PUBLIC_API'])}
(default is {'"1"'}, i.e., square)—set to {'"0"'} to disable: </ChecklistRow>
{renderEnvVars(['NEXT_PUBLIC_GRID_ASPECT_RATIO'])} <ChecklistRow
</ChecklistRow> title="Show repo link"
<ChecklistRow status={showRepoLink}
title="Legacy OG text alignment" isPending={isPendingPage}
status={isOgTextBottomAligned} optional
isPending={isPendingPage} >
optional Set environment variable to {'"1"'} to hide footer link:
> {renderEnvVars(['NEXT_PUBLIC_HIDE_REPO_LINK'])}
Set environment variable to {'"BOTTOM"'} to </ChecklistRow>
keep OG image text bottom aligned (default is {'"top"'}): <ChecklistRow
{renderEnvVars(['NEXT_PUBLIC_OG_TEXT_ALIGNMENT'])} title="Show Fujifilm simulations"
</ChecklistRow> status={showFilmSimulations}
</Checklist> isPending={isPendingPage}
optional
>
Set environment variable to {'"1"'} to prevent
simulations showing up in <code>/grid</code> sidebar:
{renderEnvVars(['NEXT_PUBLIC_HIDE_FILM_SIMULATIONS'])}
</ChecklistRow>
<ChecklistRow
title="Show EXIF data"
status={showExifInfo}
isPending={isPendingPage}
optional
>
Set environment variable to {'"1"'} to hide EXIF data:
{renderEnvVars(['NEXT_PUBLIC_HIDE_EXIF_DATA'])}
</ChecklistRow>
<ChecklistRow
title={`Grid aspect ratio: ${gridAspectRatio}`}
status={hasGridAspectRatio}
isPending={isPendingPage}
optional
>
Set environment variable to any number to enforce aspect ratio
{' '}
(default is {'"1"'}, i.e., square)—set to {'"0"'} to disable:
{renderEnvVars(['NEXT_PUBLIC_GRID_ASPECT_RATIO'])}
</ChecklistRow>
<ChecklistRow
title="Legacy OG text alignment"
status={isOgTextBottomAligned}
isPending={isPendingPage}
optional
>
Set environment variable to {'"BOTTOM"'} to
keep OG image text bottom aligned (default is {'"top"'}):
{renderEnvVars(['NEXT_PUBLIC_OG_TEXT_ALIGNMENT'])}
</ChecklistRow>
</Checklist>
</>}
{showRefreshButton && {showRefreshButton &&
<div className="py-4 space-y-4"> <div className="py-4 space-y-4">
<button onClick={refreshPage}> <button onClick={refreshPage}>