expanded website settings
This commit is contained in:
parent
7aec066ef7
commit
84d04df159
@ -27,7 +27,7 @@
|
|||||||
} else {
|
} else {
|
||||||
// console.log(e.result);
|
// console.log(e.result);
|
||||||
if (e.result.type === 'error') {
|
if (e.result.type === 'error') {
|
||||||
// console.log(e.result.error);
|
console.log(e.result.error);
|
||||||
toast.error(
|
toast.error(
|
||||||
'Error when updating website. Message from server: ' + e.result.error.message
|
'Error when updating website. Message from server: ' + e.result.error.message
|
||||||
);
|
);
|
||||||
@ -80,42 +80,43 @@
|
|||||||
$: disable_autopublish = !$formData.auto_publish;
|
$: disable_autopublish = !$formData.auto_publish;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="w-full max-w-7xl">
|
<div class="w-full">
|
||||||
<form method="post" use:enhance enctype="multipart/form-data">
|
<form method="post" use:enhance enctype="multipart/form-data">
|
||||||
<input type="text" value={data.blog_info.id} name="id" readonly class="hidden" />
|
<div class="max-w-7xl">
|
||||||
|
<input type="text" value={data.blog_info.id} name="id" readonly class="hidden" />
|
||||||
|
|
||||||
<div class="grid grid-cols-1 gap-16 md:grid-cols-2 md:grid-rows-1">
|
<div class="grid grid-cols-1 gap-16 md:grid-cols-2 md:grid-rows-1">
|
||||||
<div class="space-y-16">
|
<div class="space-y-16">
|
||||||
<div class="space-y-4">
|
<div class="space-y-4">
|
||||||
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
||||||
<h2 class="mb-4 text-2xl font-bold">Basics</h2>
|
<h2 class="mb-4 text-2xl font-bold">Basics</h2>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<Form.Field {form} name="name">
|
<Form.Field {form} name="name">
|
||||||
<Form.Control let:attrs>
|
<Form.Control let:attrs>
|
||||||
<Form.Label>Blog name</Form.Label>
|
<Form.Label>Blog name</Form.Label>
|
||||||
<Input {...attrs} bind:value={$formData.name} />
|
<Input {...attrs} bind:value={$formData.name} />
|
||||||
</Form.Control>
|
</Form.Control>
|
||||||
<Form.Description />
|
<Form.Description />
|
||||||
<Form.FieldErrors />
|
<Form.FieldErrors />
|
||||||
</Form.Field>
|
</Form.Field>
|
||||||
<Form.Field {form} name="title">
|
<Form.Field {form} name="title">
|
||||||
<Form.Control let:attrs>
|
<Form.Control let:attrs>
|
||||||
<Form.Label>Blog title</Form.Label>
|
<Form.Label>Blog title</Form.Label>
|
||||||
<Input {...attrs} bind:value={$formData.title} />
|
<Input {...attrs} bind:value={$formData.title} />
|
||||||
</Form.Control>
|
</Form.Control>
|
||||||
<Form.Description />
|
<Form.Description />
|
||||||
<Form.FieldErrors />
|
<Form.FieldErrors />
|
||||||
</Form.Field>
|
</Form.Field>
|
||||||
<Form.Field {form} name="subtitle">
|
<Form.Field {form} name="subtitle">
|
||||||
<Form.Control let:attrs>
|
<Form.Control let:attrs>
|
||||||
<Form.Label>Blog subtitle</Form.Label>
|
<Form.Label>Blog subtitle</Form.Label>
|
||||||
<Input {...attrs} bind:value={$formData.subtitle} />
|
<Input {...attrs} bind:value={$formData.subtitle} />
|
||||||
</Form.Control>
|
</Form.Control>
|
||||||
<Form.Description />
|
<Form.Description />
|
||||||
<Form.FieldErrors />
|
<Form.FieldErrors />
|
||||||
</Form.Field>
|
</Form.Field>
|
||||||
<!-- <Form.Field {form} name="primary_color_hex">
|
<!-- <Form.Field {form} name="primary_color_hex">
|
||||||
<Form.Control let:attrs>
|
<Form.Control let:attrs>
|
||||||
<Form.Label>Primary color</Form.Label>
|
<Form.Label>Primary color</Form.Label>
|
||||||
<ColorPicker
|
<ColorPicker
|
||||||
@ -157,133 +158,186 @@
|
|||||||
<Form.Description />
|
<Form.Description />
|
||||||
<Form.FieldErrors />
|
<Form.FieldErrors />
|
||||||
</Form.Field> -->
|
</Form.Field> -->
|
||||||
<Form.Field {form} name="domain">
|
<Form.Field {form} name="domain">
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label>Custom domain</Form.Label>
|
|
||||||
<Input {...attrs} bind:value={$formData.domain} />
|
|
||||||
</Form.Control>
|
|
||||||
{#if data.blog_info.subdomain_slug}
|
|
||||||
<Form.Description
|
|
||||||
>You can also access your website at <a
|
|
||||||
href="http://{data.blog_info.subdomain_slug}.{config.sites_url}"
|
|
||||||
class="font-semibold underline"
|
|
||||||
>{data.blog_info.subdomain_slug}.{config.sites_url}</a
|
|
||||||
></Form.Description
|
|
||||||
>
|
|
||||||
{/if}
|
|
||||||
<Form.FieldErrors />
|
|
||||||
</Form.Field>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-4">
|
|
||||||
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
|
||||||
<h2 class="mb-4 text-2xl font-bold">Auto publish</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<Form.Field {form} name="auto_publish">
|
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label>Auto Publish</Form.Label>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<Switch {...attrs} bind:checked={$formData.auto_publish} />
|
|
||||||
</div>
|
|
||||||
</Form.Control>
|
|
||||||
<Form.FieldErrors />
|
|
||||||
<Form.Description
|
|
||||||
>Automatically creates a blog post for you when you upload a video</Form.Description
|
|
||||||
>
|
|
||||||
</Form.Field>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-16">
|
|
||||||
<div class="space-y-4">
|
|
||||||
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
|
||||||
<h2 class="mb-4 text-2xl font-bold">Freebies</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<Form.Field {form} name="freebie_title">
|
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label class="text-right">Freebie title</Form.Label>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<Input {...attrs} bind:value={$formData.freebie_title} />
|
|
||||||
</div>
|
|
||||||
</Form.Control>
|
|
||||||
<Form.FieldErrors />
|
|
||||||
</Form.Field>
|
|
||||||
<Form.Field {form} name="use_freebie">
|
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label class="text-right">Send freebie</Form.Label>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<!-- <Switch disabled={['free', 'basic'].includes(tier)} {...attrs} /> -->
|
|
||||||
<Switch {...attrs} bind:checked={$formData.use_freebie} />
|
|
||||||
<!-- <ProBadge class="ml-[10px]" /> -->
|
|
||||||
</div>
|
|
||||||
<Form.Description
|
|
||||||
>Whether to send a freebie when a new person enters their email on your website.</Form.Description
|
|
||||||
>
|
|
||||||
</Form.Control>
|
|
||||||
</Form.Field>
|
|
||||||
<Form.Field {form} name="freebie_url">
|
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label class="text-right">Freebie file</Form.Label>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<Input
|
|
||||||
type="file"
|
|
||||||
on:input={(e) =>
|
|
||||||
handleFileChange(e, $formData.freebie_url).then((x) => {
|
|
||||||
$formData.freebie_url = x;
|
|
||||||
})}
|
|
||||||
bind:disabled={disable_freebies}
|
|
||||||
/>
|
|
||||||
<Input {...attrs} class="hidden" bind:value={$formData.freebie_url} readonly />
|
|
||||||
</div>
|
|
||||||
</Form.Control>
|
|
||||||
<Form.Description>Maximum size of 5MB (TEMPORARY)</Form.Description>
|
|
||||||
<Form.FieldErrors />
|
|
||||||
</Form.Field>
|
|
||||||
<div class="hidden">
|
|
||||||
<Form.Field {form} name="freebie_image_url">
|
|
||||||
<Form.Control let:attrs>
|
<Form.Control let:attrs>
|
||||||
<Form.Label class="text-right">Freebie image</Form.Label>
|
<Form.Label>Custom domain</Form.Label>
|
||||||
|
<Input {...attrs} bind:value={$formData.domain} />
|
||||||
|
</Form.Control>
|
||||||
|
{#if data.blog_info.subdomain_slug}
|
||||||
|
<Form.Description
|
||||||
|
>You can also access your website at <a
|
||||||
|
href="http://{data.blog_info.subdomain_slug}.{config.sites_url}"
|
||||||
|
class="font-semibold underline"
|
||||||
|
>{data.blog_info.subdomain_slug}.{config.sites_url}</a
|
||||||
|
></Form.Description
|
||||||
|
>
|
||||||
|
{/if}
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
||||||
|
<h2 class="mb-4 text-2xl font-bold">Auto publish</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Form.Field {form} name="auto_publish">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label>Auto Publish</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Switch {...attrs} bind:checked={$formData.auto_publish} />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
<Form.Description
|
||||||
|
>Automatically creates a blog post for you when you upload a video</Form.Description
|
||||||
|
>
|
||||||
|
</Form.Field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-16">
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
||||||
|
<h2 class="mb-4 text-2xl font-bold">Freebies</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Form.Field {form} name="freebie_title">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Freebie title</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Input {...attrs} bind:value={$formData.freebie_title} />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
<Form.Field {form} name="use_freebie">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Send freebie</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<!-- <Switch disabled={['free', 'basic'].includes(tier)} {...attrs} /> -->
|
||||||
|
<Switch {...attrs} bind:checked={$formData.use_freebie} />
|
||||||
|
<!-- <ProBadge class="ml-[10px]" /> -->
|
||||||
|
</div>
|
||||||
|
<Form.Description
|
||||||
|
>Whether to send a freebie when a new person enters their email on your website.</Form.Description
|
||||||
|
>
|
||||||
|
</Form.Control>
|
||||||
|
</Form.Field>
|
||||||
|
<Form.Field {form} name="freebie_url">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Freebie file</Form.Label>
|
||||||
<div class="flex items-center justify-start">
|
<div class="flex items-center justify-start">
|
||||||
<Input
|
<Input
|
||||||
type="file"
|
type="file"
|
||||||
accept="png,jpg,webp,jpeg"
|
|
||||||
on:input={(e) =>
|
on:input={(e) =>
|
||||||
handleFileChange(e, $formData.freebie_image_url).then(
|
handleFileChange(e, $formData.freebie_url).then((x) => {
|
||||||
(x) => ($formData.freebie_image_url = x)
|
$formData.freebie_url = x;
|
||||||
)}
|
})}
|
||||||
bind:disabled={disable_freebies}
|
bind:disabled={disable_freebies}
|
||||||
/>
|
/>
|
||||||
|
<Input {...attrs} class="hidden" bind:value={$formData.freebie_url} readonly />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.Description>Maximum size of 5MB (TEMPORARY)</Form.Description>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
<div class="hidden">
|
||||||
|
<Form.Field {form} name="freebie_image_url">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Freebie image</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Input
|
||||||
|
type="file"
|
||||||
|
accept="png,jpg,webp,jpeg"
|
||||||
|
on:input={(e) =>
|
||||||
|
handleFileChange(e, $formData.freebie_image_url).then(
|
||||||
|
(x) => ($formData.freebie_image_url = x)
|
||||||
|
)}
|
||||||
|
bind:disabled={disable_freebies}
|
||||||
|
/>
|
||||||
|
<Input
|
||||||
|
{...attrs}
|
||||||
|
class="hidden"
|
||||||
|
bind:value={$formData.freebie_image_url}
|
||||||
|
readonly
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Form.Field {form} name="freebie_text">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Freebie text</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Textarea {...attrs} bind:value={$formData.freebie_text} />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
<Form.Description
|
||||||
|
>The text displayed next to the signup form on your blog.</Form.Description
|
||||||
|
>
|
||||||
|
</Form.Field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="flex items-center justify-between space-x-4 border-b px-4">
|
||||||
|
<h2 class="mb-4 text-2xl font-bold">Pages</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Form.Field {form} name="use_contact_page">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Use contact page</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Switch {...attrs} bind:checked={$formData.use_contact_page} />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
<Form.Field {form} name="contact_email">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Contact email</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
<Input
|
<Input
|
||||||
{...attrs}
|
{...attrs}
|
||||||
class="hidden"
|
bind:value={$formData.contact_email}
|
||||||
bind:value={$formData.freebie_image_url}
|
readonly={!$formData.use_contact_page}
|
||||||
readonly
|
/>
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
<Form.Field {form} name="use_about_page">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">Use about page</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Switch {...attrs} bind:checked={$formData.use_about_page} />
|
||||||
|
</div>
|
||||||
|
</Form.Control>
|
||||||
|
<Form.FieldErrors />
|
||||||
|
</Form.Field>
|
||||||
|
<Form.Field {form} name="about_text">
|
||||||
|
<Form.Control let:attrs>
|
||||||
|
<Form.Label class="text-right">About text</Form.Label>
|
||||||
|
<div class="flex items-center justify-start">
|
||||||
|
<Textarea
|
||||||
|
{...attrs}
|
||||||
|
bind:value={$formData.about_text}
|
||||||
|
readonly={!$formData.use_about_page}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</Form.Control>
|
</Form.Control>
|
||||||
<Form.FieldErrors />
|
<Form.FieldErrors />
|
||||||
</Form.Field>
|
</Form.Field>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Form.Field {form} name="freebie_text">
|
|
||||||
<Form.Control let:attrs>
|
|
||||||
<Form.Label class="text-right">Freebie text</Form.Label>
|
|
||||||
<div class="flex items-center justify-start">
|
|
||||||
<Textarea {...attrs} bind:value={$formData.freebie_text} />
|
|
||||||
</div>
|
|
||||||
</Form.Control>
|
|
||||||
<Form.FieldErrors />
|
|
||||||
<Form.Description
|
|
||||||
>The text displayed next to the signup form on your blog.</Form.Description
|
|
||||||
>
|
|
||||||
</Form.Field>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-4">
|
|
||||||
|
<div class="mt-4 w-full border-t-[1px] border-t-gray-800 py-6 sticky bottom-0 bg-background">
|
||||||
<Form.Button disabled={!isTainted($tainted)}>Submit</Form.Button>
|
<Form.Button disabled={!isTainted($tainted)}>Submit</Form.Button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|||||||
@ -17,8 +17,11 @@ export const schema = z.object({
|
|||||||
title: z.string(),
|
title: z.string(),
|
||||||
subtitle: z.string(),
|
subtitle: z.string(),
|
||||||
auto_publish: z.boolean(),
|
auto_publish: z.boolean(),
|
||||||
|
use_contact_page: z.boolean(),
|
||||||
|
contact_email: z.string().email().nullable(),
|
||||||
|
use_about_page: z.boolean(),
|
||||||
|
about_text: z.string().nullable()
|
||||||
}).superRefine((data, ctx) => {
|
}).superRefine((data, ctx) => {
|
||||||
console.log(data);
|
|
||||||
if (data.use_freebie) {
|
if (data.use_freebie) {
|
||||||
if (!data.freebie_url) {
|
if (!data.freebie_url) {
|
||||||
ctx.addIssue({
|
ctx.addIssue({
|
||||||
@ -35,4 +38,11 @@ export const schema = z.object({
|
|||||||
// });
|
// });
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
if(data.use_contact_page && !data.contact_email) {
|
||||||
|
ctx.addIssue({
|
||||||
|
path: ['contact_email'],
|
||||||
|
message: "A contact email is required when the contact page is enabled",
|
||||||
|
code: "custom"
|
||||||
|
});
|
||||||
|
}
|
||||||
});
|
});
|
||||||
Loading…
Reference in New Issue
Block a user