mirror of
https://github.com/Portabase/portabase.git
synced 2026-07-14 11:16:13 +02:00
refactor(onboarding): skip db settings entirely if no database is selected in project create
This commit is contained in:
@@ -62,7 +62,8 @@ export const OnboardingShell = () => {
|
||||
} else if (currentStepId === "finish") {
|
||||
const agents = (state.context.flowData.agents as any[]) || [];
|
||||
const isAgentConnected = agents.some((a) => a.connected);
|
||||
if (!isAgentConnected) {
|
||||
const databaseIds = (state.context.flowData.project as any)?.databaseIds || [];
|
||||
if (!isAgentConnected || databaseIds.length === 0) {
|
||||
prevId = "project-create";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -121,12 +121,14 @@ export const onboardingSteps: OnboardingStep[] = [
|
||||
skipToStep: (ctx: any) => {
|
||||
const agents = (ctx.flowData?.agents as any[]) || [];
|
||||
const isAgentConnected = agents.some((a) => a.connected);
|
||||
return !isAgentConnected ? "finish" : "db-settings";
|
||||
const databaseIds = (ctx.flowData?.project?.databaseIds as string[]) || [];
|
||||
return !isAgentConnected || databaseIds.length === 0 ? "finish" : "db-settings";
|
||||
},
|
||||
nextStep: (ctx: any) => {
|
||||
const agents = (ctx.flowData?.agents as any[]) || [];
|
||||
const isAgentConnected = agents.some((a) => a.connected);
|
||||
return !isAgentConnected ? "finish" : "db-settings";
|
||||
const databaseIds = (ctx.flowData?.project?.databaseIds as string[]) || [];
|
||||
return !isAgentConnected || databaseIds.length === 0 ? "finish" : "db-settings";
|
||||
},
|
||||
},
|
||||
{
|
||||
|
||||
@@ -6,83 +6,86 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Switch } from "@/components/ui/switch";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { OnboardingDbSettings, OnboardingProjectData } from "@/features/onboarding/types";
|
||||
import {
|
||||
OnboardingDbSettings,
|
||||
OnboardingProjectData,
|
||||
} from "@/features/onboarding/types";
|
||||
|
||||
export const StepDbSettings = () => {
|
||||
const { next, updateContext, state } = useOnboarding();
|
||||
const project = (state?.context.flowData.project ?? { databaseIds: [] }) as OnboardingProjectData;
|
||||
const databaseIds = project.databaseIds;
|
||||
const [index, setIndex] = useState(0);
|
||||
const [applyToAll, setApplyToAll] = useState(false);
|
||||
const [retentionDays, setRetentionDays] = useState(30);
|
||||
const [settings, setSettings] = useState<Record<string, OnboardingDbSettings>>({});
|
||||
const { next, updateContext, state } = useOnboarding();
|
||||
const project = (state?.context.flowData.project ?? {
|
||||
databaseIds: [],
|
||||
}) as OnboardingProjectData;
|
||||
const databaseIds = project.databaseIds;
|
||||
const [index, setIndex] = useState(0);
|
||||
const [applyToAll, setApplyToAll] = useState(false);
|
||||
const [retentionDays, setRetentionDays] = useState(30);
|
||||
const [settings, setSettings] = useState<
|
||||
Record<string, OnboardingDbSettings>
|
||||
>({});
|
||||
|
||||
if (databaseIds.length === 0) {
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<h1 className="text-2xl font-semibold">No database to configure</h1>
|
||||
<Button type="button" onClick={() => next()}>
|
||||
Continue
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
if (!databaseIds || databaseIds.length === 0) return null;
|
||||
|
||||
const currentDbId = databaseIds[index];
|
||||
const saveCurrent = (): Record<string, OnboardingDbSettings> => {
|
||||
if (applyToAll) {
|
||||
const allSettings: Record<string, OnboardingDbSettings> = {};
|
||||
databaseIds.forEach((id) => {
|
||||
allSettings[id] = { retentionDays };
|
||||
});
|
||||
return allSettings;
|
||||
}
|
||||
return { ...settings, [currentDbId]: { retentionDays } };
|
||||
};
|
||||
|
||||
const onContinue = async () => {
|
||||
const updated = saveCurrent();
|
||||
setSettings(updated);
|
||||
|
||||
if (applyToAll || index === databaseIds.length - 1) {
|
||||
await updateContext({
|
||||
flowData: { ...state?.context.flowData, dbSettings: updated },
|
||||
});
|
||||
await next();
|
||||
return;
|
||||
}
|
||||
|
||||
const currentDbId = databaseIds[index];
|
||||
// Database info is available from state flowData if needed
|
||||
// For now, just use the ID
|
||||
setIndex((prev) => prev + 1);
|
||||
setRetentionDays(30);
|
||||
};
|
||||
|
||||
const saveCurrent = (): Record<string, OnboardingDbSettings> => {
|
||||
if (applyToAll) {
|
||||
const allSettings: Record<string, OnboardingDbSettings> = {};
|
||||
databaseIds.forEach((id) => {
|
||||
allSettings[id] = { retentionDays };
|
||||
});
|
||||
return allSettings;
|
||||
}
|
||||
return { ...settings, [currentDbId]: { retentionDays } };
|
||||
};
|
||||
|
||||
const onContinue = async () => {
|
||||
const updated = saveCurrent();
|
||||
setSettings(updated);
|
||||
|
||||
if (applyToAll || index === databaseIds.length - 1) {
|
||||
await updateContext({ flowData: { ...state?.context.flowData, dbSettings: updated } });
|
||||
await next();
|
||||
return;
|
||||
}
|
||||
|
||||
setIndex((prev) => prev + 1);
|
||||
setRetentionDays(30);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold">Configure database</h1>
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
Database {index + 1} of {databaseIds.length}
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label htmlFor="retention">Retention (days)</Label>
|
||||
<Input
|
||||
id="retention"
|
||||
type="number"
|
||||
value={retentionDays}
|
||||
onChange={(e) => setRetentionDays(Number(e.target.value))}
|
||||
/>
|
||||
</div>
|
||||
{databaseIds.length > 1 && (
|
||||
<div className="flex items-center gap-2">
|
||||
<Switch checked={applyToAll} onCheckedChange={setApplyToAll} id="apply-all" />
|
||||
<Label htmlFor="apply-all">Apply to all databases</Label>
|
||||
</div>
|
||||
)}
|
||||
<Button type="button" onClick={onContinue}>
|
||||
{applyToAll || index === databaseIds.length - 1 ? "Continue" : "Next database"}
|
||||
</Button>
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold">Configure database</h1>
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
Database {index + 1} of {databaseIds.length}
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label htmlFor="retention">Retention (days)</Label>
|
||||
<Input
|
||||
id="retention"
|
||||
type="number"
|
||||
value={retentionDays}
|
||||
onChange={(e) => setRetentionDays(Number(e.target.value))}
|
||||
/>
|
||||
</div>
|
||||
{databaseIds.length > 1 && (
|
||||
<div className="flex items-center gap-2">
|
||||
<Switch
|
||||
checked={applyToAll}
|
||||
onCheckedChange={setApplyToAll}
|
||||
id="apply-all"
|
||||
/>
|
||||
<Label htmlFor="apply-all">Apply to all databases</Label>
|
||||
</div>
|
||||
);
|
||||
)}
|
||||
<Button type="button" onClick={onContinue}>
|
||||
{applyToAll || index === databaseIds.length - 1
|
||||
? "Continue"
|
||||
: "Next database"}
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user