mirror of
https://github.com/spacedriveapp/spacedrive.git
synced 2026-04-22 07:28:43 -04:00
a7fed83556
* fda wip * clippy * add tauri invoke fns for FDA * fda wip * clippy * add tauri invoke fns for FDA * wip * fda wip * clippy * add tauri invoke fns for FDA * wip * wip * wip fda * remove imports * hopefully improve FDA * execute only on macos * ts * ts * Update Platform.tsx * Update AddLocationButton.tsx * remove console log * fix: fda and add unit tests * temp commit for Jake * add fda state and keybind handling (so the frontend is kept up to date) * update FDA * update imports * testing purposes * Jakes work * fix fda checks * work in progress (but not working) * remove dead files * attempt #2 * !!!temporarily enable devtools in prod * remove alert * show FDA screen but don't require it * add an FDA button to general client settings * Update AddLocationButton.tsx * remove dead code * unused dep * old errors * remove import * dead code * dead code + typesafety * eslint * remove fda dialog references * remove mp4 vid * hopefully fix onboarding for non-macos OSes * shorter nav --------- Co-authored-by: jake <77554505+brxken128@users.noreply.github.com>
46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
import clsx from 'clsx';
|
|
import { useEffect } from 'react';
|
|
import { useMatch, useNavigate } from 'react-router';
|
|
import { getOnboardingStore, unlockOnboardingScreen, useOnboardingStore } from '@sd/client';
|
|
import { useOperatingSystem } from '~/hooks';
|
|
|
|
import routes from '.';
|
|
|
|
export default function OnboardingProgress() {
|
|
const obStore = useOnboardingStore();
|
|
const navigate = useNavigate();
|
|
const os = useOperatingSystem();
|
|
|
|
const match = useMatch('/onboarding/:screen');
|
|
|
|
const currentScreen = match?.params?.screen;
|
|
|
|
useEffect(() => {
|
|
if (!currentScreen) return;
|
|
|
|
unlockOnboardingScreen(currentScreen, getOnboardingStore().unlockedScreens);
|
|
}, [currentScreen]);
|
|
|
|
return (
|
|
<div className="flex w-full items-center justify-center">
|
|
<div className="flex items-center justify-center space-x-1">
|
|
{routes(os).map(({ path }) => {
|
|
if (!path) return null;
|
|
|
|
return (
|
|
<button
|
|
key={path}
|
|
disabled={!obStore.unlockedScreens.includes(path)}
|
|
onClick={() => navigate(`./${path}`, { replace: true })}
|
|
className={clsx(
|
|
'h-2 w-2 rounded-full transition hover:bg-ink disabled:opacity-10',
|
|
currentScreen === path ? 'bg-ink' : 'bg-ink-faint'
|
|
)}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|