format

.prettierrc

@@ -1,8 +1,14 @@
 {
 	"useTabs": true,
 	"singleQuote": true,
-	"trailingComma": "none",
+	"trailingComma": "es5",
 	"printWidth": 100,
+	"endOfLine": "lf",
+	"arrowParens": "always",
+	"jsxSingleQuote": false,
+	"semi": true,
+	"quoteProps": "as-needed",
+	"tabWidth": 4,
 	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
 	"overrides": [
 		{

.storybook/main.js

@@ -7,11 +7,11 @@ const config = {
 		'@storybook/addon-interactions',
 		'@storybook/addon-styling-webpack',
 		'@storybook/addon-svelte-csf',
-		'@storybook/addon-themes'
+		'@storybook/addon-themes',
 	],
 	framework: {
 		name: '@storybook/sveltekit',
-		options: {}
-	}
+		options: {},
+	},
 };
-export default config;
+export default config;

.storybook/preview.css

@@ -1,4 +1,4 @@
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
-@import '@flaticon/flaticon-uicons/css/all/all';
+@import '@flaticon/flaticon-uicons/css/all/all';

.storybook/preview.js

@@ -8,21 +8,21 @@ const preview = {
 		controls: {
 			matchers: {
 				color: /(background|color)$/i,
-				date: /Date$/i
-			}
-		}
+				date: /Date$/i,
+			},
+		},
 	},
 	decorators: [
 		withThemeByDataAttribute({
 			themes: {
 				light: 'light',
 				dark: 'dark',
-				night: 'night'
+				night: 'night',
 			},
 			defaultTheme: 'dark',
-			attributeName: 'data-theme'
-		})
-	]
+			attributeName: 'data-theme',
+		}),
+	],
 };
 
-export default preview;
+export default preview;

README.md

@@ -66,4 +66,4 @@ bun build
 
 You can preview the production build with `bun run preview`.
 
-> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
+> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.

docs/DAISY.md

@@ -1,3 +1,3 @@
 # Experienced Issues
 
-- https://github.com/saadeghi/daisyui/issues/811
+- https://github.com/saadeghi/daisyui/issues/811

eslint.config.js

@@ -18,17 +18,17 @@ export default ts.config(
 		languageOptions: {
 			globals: {
 				...globals.browser,
-				...globals.node
-			}
-		}
+				...globals.node,
+			},
+		},
 	},
 	{
 		files: ['**/*.svelte'],
 
 		languageOptions: {
 			parserOptions: {
-				parser: ts.parser
-			}
-		}
+				parser: ts.parser,
+			},
+		},
 	}
 );

playwright.config.ts

@@ -3,8 +3,8 @@ import { defineConfig } from '@playwright/test';
 export default defineConfig({
 	webServer: {
 		command: 'npm run build && npm run preview',
-		port: 4173
+		port: 4173,
 	},
 
-	testDir: 'e2e'
+	testDir: 'e2e',
 });

postcss.config.js

@@ -1,6 +1,6 @@
 export default {
 	plugins: {
 		tailwindcss: {},
-		autoprefixer: {}
-	}
+		autoprefixer: {},
+	},
 };

src/app.css

@@ -5,4 +5,4 @@
 
 :root {
 	@apply text-base-content;
-}
+}

src/app.d.ts

@@ -2,10 +2,9 @@
 // for information about these interfaces
 declare global {
 	namespace App {
-
 		// interface Error {}
 		interface Locals {
-			user: import("lucia").User | null;
+			user: import('lucia').User | null;
 			session: import('lucia').Session | null;
 		}
 		// interface PageData {}

src/lib/components/Navigation/Navbar/Navbar.stories.svelte

@@ -4,8 +4,8 @@
 
 	const { Story } = defineMeta({
 		title: 'Navigation/Navbar',
-		component: Navbar
+		component: Navbar,
 	});
 </script>
 
-<Story name="Default" args={{ title: 'Storybook' }} />
+<Story name="Default" args={{ title: 'Storybook' }} />

src/lib/components/Navigation/Navbar/Navbar.svelte

@@ -9,4 +9,4 @@
 </header>
 
 <style>
-</style>
+</style>

src/lib/components/Navigation/Navbar/index.ts

@@ -1,3 +1,3 @@
 import Navbar from './Navbar.svelte';
 
-export default Navbar;
+export default Navbar;

src/lib/components/Navigation/Tabs/Tab.svelte

@@ -2,4 +2,4 @@
 	let { active, label, onclick } = $props();
 </script>
 
-<input aria-label={label} type="radio" role="tab" class="tab" class:tab-active={active} {onclick} />
+<input aria-label={label} type="radio" role="tab" class="tab" class:tab-active={active} {onclick} />

src/lib/components/Navigation/Tabs/Tabs.stories.svelte

@@ -10,13 +10,13 @@
 		argTypes: {
 			size: {
 				control: 'select',
-				options: ['xs', 'sm', 'rg', 'lg']
+				options: ['xs', 'sm', 'rg', 'lg'],
 			},
 			variant: {
 				control: 'select',
-				options: ['none', 'bordered', 'lifted', 'boxed']
-			}
-		}
+				options: ['none', 'bordered', 'lifted', 'boxed'],
+			},
+		},
 	});
 </script>
 
@@ -24,4 +24,4 @@
 	<Tabs tabs={['Tab 1', 'Tab 2']} {...args} />
 {/snippet}
 
-<Story name="Default" args={{}} children={template} />
+<Story name="Default" args={{}} children={template} />

src/lib/components/Navigation/Tabs/Tabs.svelte

@@ -33,4 +33,4 @@
 			/>
 		{/key}
 	{/each}
-</div>
+</div>

src/lib/components/Navigation/Tabs/index.ts

@@ -1,4 +1,4 @@
 import Tabs from './Tabs.svelte';
 
 export default Tabs;
-export { default as Tabs } from './Tabs.svelte';
+export { default as Tabs } from './Tabs.svelte';

src/lib/components/Navigation/index.ts

@@ -1,4 +1,4 @@
 import Navbar from './Navbar';
 import Tabs from './Tabs';
 
-export { Navbar, Tabs };
+export { Navbar, Tabs };

src/lib/components/common/Button/Button.stories.svelte

@@ -7,7 +7,7 @@
 		title: 'Actions/Button',
 		component: Button,
 		args: {
-			onClick: fn()
+			onClick: fn(),
 		},
 		argTypes: {
 			color: {
@@ -22,23 +22,23 @@
 					'info',
 					'success',
 					'warning',
-					'error'
-				]
+					'error',
+				],
 			},
 			outline: {
-				control: 'boolean'
+				control: 'boolean',
 			},
 			size: {
 				control: 'select',
 				options: ['Default', 'xs', 'sm', 'lg'],
-				defaultValue: 'Default'
+				defaultValue: 'Default',
 			},
 			type: {
 				control: 'select',
-				options: ['button', 'reset', 'submit']
-			}
-		}
+				options: ['button', 'reset', 'submit'],
+			},
+		},
 	});
 </script>
 
-<Story name="Default" args={{ label: 'Button', color: 'primary' }} />
+<Story name="Default" args={{ label: 'Button', color: 'primary' }} />

src/lib/components/common/Button/Button.svelte

@@ -25,7 +25,7 @@
 		responsive = false,
 		size,
 		type = 'button',
-		wide = false
+		wide = false,
 	}: Props = $props();
 </script>
 
@@ -54,4 +54,4 @@
 	{label}
 </button>
 
-<style></style>
+<style></style>

src/lib/components/common/Button/index.ts

@@ -1,3 +1,3 @@
 import Button from './Button.svelte';
 
-export default Button;
+export default Button;

src/lib/components/common/Loader/Loader.stories.svelte

@@ -4,8 +4,8 @@
 
 	const { Story } = defineMeta({
 		title: 'Feedback/Loader',
-		component: Loader
+		component: Loader,
 	});
 </script>
 
-<Story name="Default" args={{}} />
+<Story name="Default" args={{}} />

src/lib/components/common/Loader/Loader.svelte

@@ -48,4 +48,4 @@
 			transform: rotate(-360deg);
 		}
 	}
-</style>
+</style>

src/lib/components/common/Loader/index.ts

@@ -1,3 +1,3 @@
 import Loader from './Loader.svelte';
 
-export default Loader;
+export default Loader;

src/lib/components/common/TextInput/TextInput.stories.svelte

@@ -17,22 +17,22 @@
 					'info',
 					'success',
 					'warning',
-					'error'
-				]
+					'error',
+				],
 			},
 			bordered: {
-				control: 'boolean'
+				control: 'boolean',
 			},
 			size: {
 				control: 'select',
 				options: ['Default', 'xs', 'sm', 'lg'],
-				defaultValue: 'Default'
+				defaultValue: 'Default',
 			},
 			type: {
 				control: 'select',
-				options: ['email', 'password', 'search', 'tel', 'text', 'url']
-			}
-		}
+				options: ['email', 'password', 'search', 'tel', 'text', 'url'],
+			},
+		},
 	});
 </script>
 
@@ -42,4 +42,4 @@
 
 <Story name="Text Label" args={{ color: 'primary', name: 'text', start: 'Text' }} />
 <Story name="Icon Start" args={{ color: 'secondary', name: 'text', start: icon }} />
-<Story name="Icon End" args={{ color: 'secondary', name: 'text', end: icon }} />
+<Story name="Icon End" args={{ color: 'secondary', name: 'text', end: icon }} />

src/lib/components/common/TextInput/TextInput.svelte

@@ -30,7 +30,7 @@
 		name,
 		placeholder,
 		size,
-		type = 'text'
+		type = 'text',
 	}: Props = $props();
 </script>
 
@@ -65,4 +65,4 @@
 </label>
 
 <style>
-</style>
+</style>

src/lib/components/common/TextInput/index.ts

@@ -1,3 +1,3 @@
 import TextInput from './TextInput.svelte';
 
-export default TextInput;
+export default TextInput;

src/lib/index.ts

@@ -1,2 +1,2 @@
 // place files you want to import through the `$lib` alias in this folder.
-export * from './components';
+export * from './components';

src/lib/server/config/index.ts

@@ -8,7 +8,7 @@ export interface Configuration {
 export const LoadConfig = (): Configuration => {
 	const { success, data, error } = z
 		.object({
-			VITE_APP_VERSION: z.string().default('development')
+			VITE_APP_VERSION: z.string().default('development'),
 		})
 		.safeParse(import.meta.env);
 
@@ -17,8 +17,8 @@ export const LoadConfig = (): Configuration => {
 	}
 
 	return {
-		app_version: data!.VITE_APP_VERSION
+		app_version: data!.VITE_APP_VERSION,
 	};
 };
 
-export const Config = LoadConfig();
+export const Config = LoadConfig();

src/lib/server/logger/index.ts

@@ -19,5 +19,5 @@ export const yogaLogger: YogaLogger = {
 	error(...args) {
 		// @ts-expect-error types dont match
 		logger.error(...args);
-	}
-};
+	},
+};

src/lib/server/lucia.ts

@@ -7,14 +7,14 @@ const adapter = new PrismaAdapter(prisma.session, prisma.user);
 export const auth = new Lucia(adapter, {
 	sessionCookie: {
 		attributes: {
-			secure: process.env.NODE_ENV === 'production'
-		}
+			secure: process.env.NODE_ENV === 'production',
+		},
 	},
 	getUserAttributes: (attributes) => {
 		return {
-			email: attributes.email
+			email: attributes.email,
 		};
-	}
+	},
 });
 
 declare module 'lucia' {

src/lib/server/pothos/builder.ts

@@ -23,6 +23,6 @@ export const builder = new SchemaBuilder<PothosType>({
 		// use where clause from prismaRelatedConnection for totalCount (defaults to true)
 		filterConnectionTotalCount: true,
 		// warn when not using a query parameter correctly
-		onUnusedQuery: process.env.NODE_ENV === 'production' ? null : 'warn'
-	}
-});
+		onUnusedQuery: process.env.NODE_ENV === 'production' ? null : 'warn',
+	},
+});

src/lib/server/pothos/index.ts

@@ -1 +1 @@
-export * from './schema';
+export * from './schema';

src/lib/server/pothos/schema/Scalars/Date.ts

@@ -10,5 +10,5 @@ export const DateScalar = builder.scalarType('Date', {
 			throw new Error('Cyka blyat');
 		}
 		return new Date(date);
-	}
-});
+	},
+});

src/lib/server/pothos/schema/Scalars/index.ts

@@ -5,4 +5,4 @@ export type Scalars = {
 		Input: Date;
 		Output: Date;
 	};
-};
+};

src/lib/server/pothos/schema/index.ts

@@ -5,7 +5,7 @@ builder.queryType({});
 builder.queryField('version', (t) =>
 	t.string({
 		description: 'Application version',
-		resolve: (parent, args, context) => context.config.app_version
+		resolve: (parent, args, context) => context.config.app_version,
 	})
 );
 
@@ -15,4 +15,4 @@ import './Scalars';
 import './posts';
 import './users';
 
-export const Schema = builder.toSchema();
+export const Schema = builder.toSchema();

src/lib/server/pothos/schema/posts.ts

@@ -9,39 +9,39 @@ export const Post = builder.prismaObject('Post', {
 		published: t.exposeBoolean('published'),
 		author: t.relation('author'),
 		createdAt: t.expose('createdAt', {
-			type: 'Date'
+			type: 'Date',
 		}),
 		updatedAt: t.expose('updatedAt', {
-			type: 'Date'
-		})
-	})
+			type: 'Date',
+		}),
+	}),
 });
 
 const CreatePost = builder.inputType('CreatePost', {
 	fields: (t) => ({
 		title: t.string({
-			required: true
+			required: true,
 		}),
 		content: t.string({
-			required: true
+			required: true,
 		}),
 		published: t.boolean(),
 		authorId: t.id({
-			required: true
-		})
-	})
+			required: true,
+		}),
+	}),
 });
 
 const UpdatePost = builder.inputType('UpdatePost', {
 	fields: (t) => ({
 		id: t.id({
-			required: true
+			required: true,
 		}),
 		title: t.string(),
 		content: t.string(),
 		published: t.boolean(),
-		authorId: t.id()
-	})
+		authorId: t.id(),
+	}),
 });
 
 builder.queryFields((t) => ({
@@ -49,19 +49,19 @@ builder.queryFields((t) => ({
 		type: [Post],
 		resolve: async () => {
 			return await prisma.post.findMany();
-		}
-	})
+		},
+	}),
 }));
 
 builder.mutationFields((t) => ({
 	createPost: t.field({
 		type: Post,
 		args: {
-			input: t.arg({ required: true, type: CreatePost })
+			input: t.arg({ required: true, type: CreatePost }),
 		},
 		resolve: async (parent, args) => {
 			const author = await prisma.user.findUnique({
-				where: { id: Number(args.input.authorId) }
+				where: { id: Number(args.input.authorId) },
 			});
 			if (!author) {
 				throw new Error('Author does not exist!');
@@ -73,23 +73,23 @@ builder.mutationFields((t) => ({
 					published: args.input.published,
 					author: {
 						connect: {
-							id: author.id
-						}
-					}
-				}
+							id: author.id,
+						},
+					},
+				},
 			});
 			return post;
-		}
+		},
 	}),
 	updatePost: t.field({
 		type: Post,
 		args: {
-			input: t.arg({ required: true, type: UpdatePost })
+			input: t.arg({ required: true, type: UpdatePost }),
 		},
 		resolve: async (parent, args) => {
 			const post = await prisma.post.update({
 				where: {
-					id: Number(args.input.id)
+					id: Number(args.input.id),
 				},
 				data: {
 					title: args.input.title ?? undefined,
@@ -98,13 +98,13 @@ builder.mutationFields((t) => ({
 					...(args.input.authorId && {
 						author: {
 							connect: {
-								id: Number(args.input.authorId)
-							}
-						}
-					})
-				}
+								id: Number(args.input.authorId),
+							},
+						},
+					}),
+				},
 			});
 			return post;
-		}
-	})
-}));
+		},
+	}),
+}));

src/lib/server/pothos/schema/users.ts

@@ -8,33 +8,33 @@ export const User = builder.prismaObject('User', {
 		name: t.exposeString('name'),
 		posts: t.relation('posts'),
 		createdAt: t.expose('createdAt', {
-			type: 'Date'
+			type: 'Date',
 		}),
 		updatedAt: t.expose('updatedAt', {
-			type: 'Date'
-		})
-	})
+			type: 'Date',
+		}),
+	}),
 });
 
 const CreateUser = builder.inputType('CreateUser', {
 	fields: (t) => ({
 		email: t.string({
-			required: true
+			required: true,
 		}),
 		name: t.string({
-			required: true
-		})
-	})
+			required: true,
+		}),
+	}),
 });
 
 const UpdateUser = builder.inputType('UpdateUser', {
 	fields: (t) => ({
 		id: t.id({
-			required: true
+			required: true,
 		}),
 		email: t.string(),
-		name: t.string()
-	})
+		name: t.string(),
+	}),
 });
 
 builder.queryFields((t) => ({
@@ -42,42 +42,42 @@ builder.queryFields((t) => ({
 		type: [User],
 		resolve: async () => {
 			return await prisma.user.findMany();
-		}
-	})
+		},
+	}),
 }));
 
 builder.mutationFields((t) => ({
 	createUser: t.field({
 		type: User,
 		args: {
-			input: t.arg({ required: true, type: CreateUser })
+			input: t.arg({ required: true, type: CreateUser }),
 		},
 		resolve: async (parent, args) => {
 			const post = await prisma.user.create({
 				data: {
 					email: args.input.email,
-					name: args.input.name
-				}
+					name: args.input.name,
+				},
 			});
 			return post;
-		}
+		},
 	}),
 	updateUser: t.field({
 		type: User,
 		args: {
-			input: t.arg({ required: true, type: UpdateUser })
+			input: t.arg({ required: true, type: UpdateUser }),
 		},
 		resolve: async (parent, args) => {
 			const post = await prisma.user.update({
 				where: {
-					id: Number(args.input.id)
+					id: Number(args.input.id),
 				},
 				data: {
 					email: args.input.email,
-					name: args.input.name ?? undefined
-				}
+					name: args.input.name ?? undefined,
+				},
 			});
 			return post;
-		}
-	})
-}));
+		},
+	}),
+}));

src/lib/server/prisma/index.ts

@@ -1,3 +1,3 @@
 import { PrismaClient } from '@prisma/client';
 
-export const prisma = new PrismaClient();
+export const prisma = new PrismaClient();

src/lib/server/yoga/context.ts

@@ -3,5 +3,5 @@ import type { YogaInitialContext } from 'graphql-yoga';
 
 export const Context = (initialContext: YogaInitialContext) => ({
 	...initialContext,
-	config: Config
-});
+	config: Config,
+});

src/lib/server/yoga/index.ts

@@ -1,2 +1,2 @@
 export * from './context';
-export * from './server';
+export * from './server';

src/lib/server/yoga/server.ts

@@ -10,5 +10,5 @@ export const Yoga = createYoga<RequestEvent>({
 	graphqlEndpoint: '/api/graphql',
 	// Let Yoga use sveltekit's Response object
 	fetchAPI: { Response },
-	logging: yogaLogger
-});
+	logging: yogaLogger,
+});

src/lib/types/daisy-colors.ts

@@ -9,4 +9,4 @@ export type DaisyColor =
 	| 'info'
 	| 'success'
 	| 'warning'
-	| 'error';
+	| 'error';

src/lib/types/daisy-sizes.ts

@@ -1 +1 @@
-export type DaisySize = 'xs' | 'sm' | 'lg';
+export type DaisySize = 'xs' | 'sm' | 'lg';

src/lib/types/index.ts

@@ -1,2 +1,2 @@
 export * from './daisy-colors';
-export * from './daisy-sizes';
+export * from './daisy-sizes';

src/routes/+layout.svelte

@@ -11,4 +11,4 @@
 	.layout {
 		@apply h-screen w-screen bg-base-100;
 	}
-</style>
+</style>

src/routes/+page.server.ts

@@ -3,15 +3,15 @@ export async function load(event) {
 	const userId = event.cookies.get('user');
 	if (!userId) {
 		return {
-			authenticated: false
+			authenticated: false,
 		};
 	}
 	const user = await prisma.user.findUnique({
 		where: {
-			id: userId
-		}
+			id: userId,
+		},
 	});
 	return {
-		authenticated: !!user
+		authenticated: !!user,
 	};
 }

src/routes/+page.svelte

@@ -21,4 +21,4 @@
 	.site-loader {
 		@apply flex h-screen w-screen flex-col items-center justify-center gap-6;
 	}
-</style>
+</style>

src/routes/api/graphql/+server.ts

@@ -1,3 +1,3 @@
 import { Yoga } from '$lib/server/yoga';
 
-export { Yoga as GET, Yoga as POST };
+export { Yoga as GET, Yoga as POST };

src/routes/app/+layout.svelte

@@ -5,4 +5,4 @@
 </script>
 
 <Navbar title="Svelte" />
-{@render children()}
+{@render children()}

src/routes/login/+page.server.ts

@@ -12,8 +12,8 @@ export const actions = {
 		}
 		const user = await prisma.user.findUnique({
 			where: {
-				email: form.get('email') as string
-			}
+				email: form.get('email') as string,
+			},
 		});
 		if (!user) {
 			logger.error('User not found! ${user}');
@@ -31,7 +31,7 @@ export const actions = {
 		const sessionCookie = auth.createSessionCookie(session.id);
 		event.cookies.set(sessionCookie.name, sessionCookie.value, {
 			path: '/',
-			maxAge: 120
+			maxAge: 120,
 		});
 		redirect(302, '/');
 	},
@@ -47,8 +47,8 @@ export const actions = {
 			data: {
 				email: form.get('email') as string,
 				name: form.get('name') as string,
-				password: hashedPassword
-			}
+				password: hashedPassword,
+			},
 		});
 		const session = await auth.createSession(user.id.toString(), {});
 		const sessionCookie = auth.createSessionCookie(session.id);
@@ -57,8 +57,8 @@ export const actions = {
 		}
 		event.cookies.set(sessionCookie.name, sessionCookie.value, {
 			path: '/',
-			maxAge: 120
+			maxAge: 120,
 		});
 		redirect(302, '/');
-	}
+	},
 } satisfies Actions;

src/routes/login/+page.svelte

@@ -23,7 +23,12 @@
 	<form method="POST" action={`?/${variant}`}>
 		<div class="card-body gap-4">
 			<TextInput start={userIcon} placeholder="Email" name="email" type="email" />
-			<TextInput start={passwordIcon} placeholder="Password" name="password" type="password" />
+			<TextInput
+				start={passwordIcon}
+				placeholder="Password"
+				name="password"
+				type="password"
+			/>
 			{#if variant === 'register'}
 				<TextInput start={nameIcon} placeholder="Name" name="name" fade />
 			{/if}
@@ -47,4 +52,4 @@
 	.page {
 		@apply flex flex-col items-center justify-around gap-24 py-[10%];
 	}
-</style>
+</style>

svelte.config.js

@@ -11,8 +11,8 @@ const config = {
 		// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
 		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
 		// See https://svelte.dev/docs/kit/adapters for more information about adapters.
-		adapter: adapter()
-	}
+		adapter: adapter(),
+	},
 };
 
 export default config;

tailwind.config.ts

@@ -8,22 +8,22 @@ export default {
 	theme: {
 		extend: {
 			fontFamily: {
-				display: ['Baskervville SC']
+				display: ['Baskervville SC'],
 			},
 			animation: {
-				fade: 'fadeIn .5s ease-in-out'
+				fade: 'fadeIn .5s ease-in-out',
 			},
 			keyframes: {
 				fadeIn: {
 					from: { opacity: '0' },
-					to: { opacity: '1' }
-				}
-			}
-		}
+					to: { opacity: '1' },
+				},
+			},
+		},
 	},
 
 	plugins: [typography, daisyui],
 	daisyui: {
-		logs: false
-	}
-} satisfies Config;
+		logs: false,
+	},
+} satisfies Config;

vite.config.ts

@@ -5,6 +5,6 @@ export default defineConfig({
 	plugins: [sveltekit()],
 
 	test: {
-		include: ['src/**/*.{test,spec}.{js,ts}']
-	}
+		include: ['src/**/*.{test,spec}.{js,ts}'],
+	},
 });