mirror of
https://github.com/vrtmrz/obsidian-livesync.git
synced 2026-06-10 08:20:13 +00:00
vorotamoroz
54 lines
2.6 KiB
Svelte
54 lines
2.6 KiB
Svelte
<script lang="ts">
|
|
import DialogHeader from "@lib/UI/components/DialogHeader.svelte";
|
|
import Guidance from "@lib/UI/components/Guidance.svelte";
|
|
import Decision from "@lib/UI/components/Decision.svelte";
|
|
import Question from "@lib/UI/components/Question.svelte";
|
|
import Option from "@lib/UI/components/Option.svelte";
|
|
import Options from "@lib/UI/components/Options.svelte";
|
|
import Instruction from "@lib/UI/components/Instruction.svelte";
|
|
import UserDecisions from "@lib/UI/components/UserDecisions.svelte";
|
|
import { TYPE_NEW_USER, TYPE_EXISTING_USER, TYPE_CANCELLED, type IntroResultType } from "./setupDialogTypes";
|
|
|
|
type Props = {
|
|
setResult: (result: IntroResultType) => void;
|
|
};
|
|
const { setResult }: Props = $props();
|
|
let userType = $state<IntroResultType>(TYPE_CANCELLED);
|
|
let proceedTitle = $derived.by(() => {
|
|
if (userType === TYPE_NEW_USER) {
|
|
return "Yes, I want to set up a new synchronisation";
|
|
} else if (userType === TYPE_EXISTING_USER) {
|
|
return "Yes, I want to add this device to my existing synchronisation";
|
|
} else {
|
|
return "Please select an option to proceed";
|
|
}
|
|
});
|
|
const canProceed = $derived.by(() => {
|
|
return userType === TYPE_NEW_USER || userType === TYPE_EXISTING_USER;
|
|
});
|
|
</script>
|
|
|
|
<DialogHeader title="Welcome to Self-hosted LiveSync" />
|
|
<Guidance>We will now guide you through a few questions to simplify the synchronisation setup.</Guidance>
|
|
<Instruction>
|
|
<Question>First, please select the option that best describes your current situation.</Question>
|
|
<Options>
|
|
<Option selectedValue={TYPE_NEW_USER} title="I am setting this up for the first time" bind:value={userType}>
|
|
(Select this if you are configuring this device as the first synchronisation device.) This option is
|
|
suitable if you are new to LiveSync and want to set it up from scratch.
|
|
</Option>
|
|
<Option
|
|
selectedValue={TYPE_EXISTING_USER}
|
|
title="I am adding a device to an existing synchronisation setup"
|
|
bind:value={userType}
|
|
>
|
|
(Select this if you are already using synchronisation on another computer or smartphone.) This option is
|
|
suitable if you are new to LiveSync and want to set it up from scratch.
|
|
</Option>
|
|
</Options>
|
|
</Instruction>
|
|
<UserDecisions>
|
|
<Decision title={proceedTitle} important={canProceed} disabled={!canProceed} commit={() => setResult(userType)} />
|
|
<Decision title="No, please take me back" commit={() => setResult(TYPE_CANCELLED)} />
|
|
</UserDecisions>
|