hello
This commit is contained in:
parent
fd544459e4
commit
d51cc84a51
@ -1,3 +1,3 @@
|
||||
export const config = {
|
||||
api_url: "http://localhost:3000"
|
||||
api_url: "http://api.omersabic.com:3001"
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
import { config } from "$lib"
|
||||
import { superValidate } from "sveltekit-superforms";
|
||||
import { formSchema } from "./schema";
|
||||
import { message, superValidate } from "sveltekit-superforms";
|
||||
import { createFormSchema, editFormSchema } from "./schema";
|
||||
import { zod } from "sveltekit-superforms/adapters";
|
||||
import { fail } from "@sveltejs/kit";
|
||||
|
||||
@ -20,17 +20,16 @@ export const load = async ({ fetch }) => {
|
||||
articles: dataBlog.articles,
|
||||
site: dataBlog.site,
|
||||
videos: dataVideos.videos,
|
||||
form: await superValidate(zod(formSchema)),
|
||||
createForm: await superValidate(zod(createFormSchema)),
|
||||
editForm: await superValidate(zod(editFormSchema))
|
||||
}
|
||||
}
|
||||
|
||||
/** @type {import("@sveltejs/kit").Actions} */
|
||||
export const actions = {
|
||||
default: async (event) => {
|
||||
create: async (event) => {
|
||||
console.log("creating article...")
|
||||
const form = await superValidate(event, zod(formSchema));
|
||||
console.log(form.data)
|
||||
console.log(form.valid)
|
||||
const form = await superValidate(event, zod(createFormSchema));
|
||||
if (!form.valid) {
|
||||
return fail(400, {
|
||||
form,
|
||||
@ -44,11 +43,36 @@ export const actions = {
|
||||
}
|
||||
});
|
||||
|
||||
console.log(res.status)
|
||||
console.log(await res.json())
|
||||
|
||||
return {
|
||||
form,
|
||||
};
|
||||
},
|
||||
edit: async (event) => {
|
||||
const form = await superValidate(event, zod(editFormSchema));
|
||||
if (!form.valid) {
|
||||
return fail(400, {
|
||||
form,
|
||||
});
|
||||
}
|
||||
|
||||
const res = await event.fetch(config.api_url + "/blog/article", {
|
||||
method: "PUT",
|
||||
body: JSON.stringify(form.data),
|
||||
headers: {
|
||||
"content-type": "application/json"
|
||||
}
|
||||
});
|
||||
const resData = await res.json();
|
||||
|
||||
if(!resData.success) {
|
||||
return fail(400, {
|
||||
form,
|
||||
message: resData.message || ""
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
form
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -4,7 +4,7 @@
|
||||
|
||||
import TooltipButton from '$lib/components/molecules/tooltipbutton.svelte';
|
||||
|
||||
import { formSchema } from './schema';
|
||||
import { createFormSchema } from './schema';
|
||||
import { superForm } from 'sveltekit-superforms';
|
||||
import { zodClient } from 'sveltekit-superforms/adapters';
|
||||
import { toast } from 'svelte-sonner';
|
||||
@ -15,8 +15,8 @@
|
||||
export let data;
|
||||
let isDialogOpen = false;
|
||||
|
||||
const form = superForm(data.form, {
|
||||
validators: zodClient(formSchema)
|
||||
const form = superForm(data.createForm, {
|
||||
validators: zodClient(createFormSchema)
|
||||
});
|
||||
|
||||
function submitArticle() {
|
||||
@ -24,7 +24,7 @@
|
||||
toast('Article is queued for generation.');
|
||||
}
|
||||
|
||||
/** @type {object | null} */
|
||||
/** @type {import("./schema.js").ArticleData | null} */
|
||||
let editingContent = null;
|
||||
|
||||
/**
|
||||
@ -74,6 +74,6 @@
|
||||
</Table.Root>
|
||||
</div>
|
||||
|
||||
<EditArticleDialog bind:article_data={editingContent} />
|
||||
<EditArticleDialog bind:article_data={editingContent} form={data.editForm} />
|
||||
|
||||
<!-- <p>{JSON.stringify(data)}</p> -->
|
||||
|
||||
@ -29,6 +29,7 @@
|
||||
name="blog-converter"
|
||||
id="blog-converter"
|
||||
on:submit
|
||||
action="?/create"
|
||||
>
|
||||
<Form.Field {form} name="video_id">
|
||||
<Form.Control let:attrs>
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<script>
|
||||
import { page } from '$app/stores';
|
||||
import { Button } from '$lib/components/ui/button';
|
||||
import * as Dialog from '$lib/components/ui/dialog';
|
||||
import * as Form from '$lib/components/ui/form';
|
||||
@ -6,19 +7,30 @@
|
||||
import { Label } from '$lib/components/ui/label';
|
||||
import { Switch } from '$lib/components/ui/switch';
|
||||
import { Textarea } from '$lib/components/ui/textarea';
|
||||
import { toast } from 'svelte-sonner';
|
||||
import SuperDebug, { superForm } from 'sveltekit-superforms';
|
||||
import { zodClient } from 'sveltekit-superforms/adapters';
|
||||
import { editFormSchema } from './schema';
|
||||
|
||||
/** @type {object | null} */
|
||||
/** @type {import("sveltekit-superforms").SuperValidated<import("sveltekit-superforms").Infer<import('./schema').EditFormSchema>>} */
|
||||
let data = $page.data.switch;
|
||||
export { data as form };
|
||||
|
||||
/** @type {import("./schema").ArticleData | null} */
|
||||
export let article_data;
|
||||
|
||||
/**
|
||||
* @param {any} e
|
||||
*/
|
||||
function updateArticle(e) {
|
||||
console.log(e.target.value);
|
||||
}
|
||||
const form = superForm(data, {
|
||||
validators: zodClient(editFormSchema),
|
||||
onSubmit: ({}) => {
|
||||
toast.success('Article edited successfully.');
|
||||
article_data = null;
|
||||
}
|
||||
});
|
||||
|
||||
const { form: formData, enhance } = form;
|
||||
|
||||
$: {
|
||||
console.log(article_data);
|
||||
if(article_data !== null) formData.set(article_data || {});
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -29,23 +41,28 @@
|
||||
<Dialog.Description></Dialog.Description>
|
||||
</Dialog.Header>
|
||||
|
||||
<form id="blog_editor" on:submit|preventDefault={updateArticle}>
|
||||
<div>
|
||||
<Label for="is_public_switch">Public</Label>
|
||||
<Switch name="is_public" id="is_public_switch" checked={article_data?.is_public} />
|
||||
</div>
|
||||
<div>
|
||||
<Input value={article_data?.title} name="" />
|
||||
</div>
|
||||
<div>
|
||||
<Textarea name="blog-editor" id="" value={article_data?.content} class="h-80" />
|
||||
<p class="text-sm text-muted-foreground">
|
||||
Manually edit your article using <a
|
||||
href="https://www.markdownguide.org/basic-syntax"
|
||||
class="font-bold underline">Markdown</a
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
<form id="blog_editor" action="?/edit" method="post" use:enhance>
|
||||
<Form.Field {form} name="blog_editor">
|
||||
<Form.Control let:attrs>
|
||||
<Input name="id" id="id" value={article_data?.id} class="hidden" />
|
||||
<div>
|
||||
<Label for="is_public_switch">Public</Label>
|
||||
<Switch name="is_public" bind:checked={$formData.is_public} />
|
||||
</div>
|
||||
<div>
|
||||
<Input value={article_data?.title} name="title" />
|
||||
</div>
|
||||
<div>
|
||||
<Textarea name="content" value={article_data?.content} class="h-80" />
|
||||
<p class="text-sm text-muted-foreground">
|
||||
Manually edit your article with <a
|
||||
href="https://www.markdownguide.org/basic-syntax"
|
||||
class="font-bold underline">Markdown</a
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
</Form.Control>
|
||||
</Form.Field>
|
||||
</form>
|
||||
|
||||
<Dialog.Footer>
|
||||
|
||||
@ -9,9 +9,11 @@ export const createFormSchema = z.object({
|
||||
/** @typedef {typeof createFormSchema} CreateFormSchema */
|
||||
|
||||
export const editFormSchema = z.object({
|
||||
video_id: z.string(),
|
||||
// length: z.number().optional(),
|
||||
// format: z.enum(["summary", "listicle", "product review", "news report", "tutorial"]).optional(),
|
||||
id: z.string(),
|
||||
title: z.string(),
|
||||
content: z.string(),
|
||||
is_public: z.boolean()
|
||||
});
|
||||
|
||||
/** @typedef {typeof editFormSchema} EditFormSchema */
|
||||
/** @typedef {{title: string, content: string, id: string, site_id: string, is_public: boolean, source_video_id: string}} ArticleData */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user