thohlt/archtika
1
0
Fork 0
mirror of https://github.com/thiloho/archtika.git synced 2025-11-22 10:51:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Thilo Hohlt
2024-07-31 07:23:32 +02:00
commit a7f2fdebf5
36 changed files with 4235 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
web-app/.gitignore vendored Normal file
View File

@@ -0,0 +1,22 @@
node_modules
user-uploads
# Output
.output
.vercel
/.svelte-kit
/build
# OS
.DS_Store
Thumbs.db
# Env
.env
.env.*
!.env.example
!.env.test
# Vite
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

1
web-app/.npmrc Normal file
View File

@@ -0,0 +1 @@
engine-strict=true

4
web-app/.prettierignore Normal file
View File

@@ -0,0 +1,4 @@
# Package Managers
package-lock.json
pnpm-lock.yaml
yarn.lock

12
web-app/.prettierrc Normal file
View File

@@ -0,0 +1,12 @@
{
"useTabs": false,
"tabWidth": 2,
"singleQuote": false,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }],
"svelteSortOrder": "options-scripts-markup-styles",
"svelteStrictMode": true,
"svelteIndentScriptAndStyle": true
}

38
web-app/README.md Normal file
View File

@@ -0,0 +1,38 @@
# create-svelte
Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).
## Creating a project
If you're seeing this, you've probably already done this step. Congrats!
```bash
# create a new project in the current directory
npm create svelte@latest
# create a new project in my-app
npm create svelte@latest my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of your app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

2680
web-app/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

28
web-app/package.json Normal file
View File

@@ -0,0 +1,28 @@
{
"name": "web-app",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"lint": "prettier --check .",
"format": "prettier --write ."
},
"devDependencies": {
"@sveltejs/adapter-auto": "^3.0.0",
"@sveltejs/adapter-node": "^5.2.0",
"@sveltejs/kit": "^2.0.0",
"@sveltejs/vite-plugin-svelte": "^3.0.0",
"@types/node": "^22.0.0",
"prettier": "^3.1.1",
"prettier-plugin-svelte": "^3.1.2",
"svelte": "^5.0.0-next.1",
"svelte-check": "^3.6.0",
"typescript": "^5.0.0",
"vite": "^5.0.3"
},
"type": "module"
}

20
web-app/src/app.d.ts vendored Normal file
View File

@@ -0,0 +1,20 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
interface User {
id: string;
username: string;
}
declare global {
namespace App {
// interface Error {}
interface Locals {
user: User;
}
// interface PageData {}
// interface PageState {}
// interface Platform {}
}
}
export type {};

12
web-app/src/app.html Normal file
View File

@@ -0,0 +1,12 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

28
web-app/src/hooks.server.ts Normal file
View File

@@ -0,0 +1,28 @@
import { redirect } from "@sveltejs/kit";
export const handle = async ({ event, resolve }) => {
const userData = await event.fetch("http://localhost:3000/user", {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${event.cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
});
if (!userData.ok && !["/login", "/register"].includes(event.url.pathname)) {
throw redirect(303, "/login");
}
if (userData.ok) {
if (["/login", "/register"].includes(event.url.pathname)) {
throw redirect(303, "/");
}
const user = await userData.json();
event.locals.user = user;
}
return await resolve(event);
};

16
web-app/src/lib/components/DateTime.svelte Normal file
View File

@@ -0,0 +1,16 @@
<script lang="ts">
const { date } = $props<{ date: string }>();
const options: Intl.DateTimeFormatOptions = {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit"
};
</script>
<time datetime={new Date(date).toLocaleString("sv").replace(" ", "T")}>
{new Date(date).toLocaleString("en-us", { ...options })}
</time>

8
web-app/src/lib/utils.ts Normal file
View File

@@ -0,0 +1,8 @@
export const sortOptions = [
{ value: "creation-time", text: "Creation time" },
{ value: "last-modified", text: "Last modified" },
{ value: "title-a-to-z", text: "Title - A to Z" },
{ value: "title-z-to-a", text: "Title - Z to A" }
];
export const ALLOWED_MIME_TYPES = ["image/jpeg", "image/png", "image/svg+xml", "image/webp"];

23
web-app/src/routes/(anonymous)/login/+page.server.ts Normal file
View File

@@ -0,0 +1,23 @@
export const actions = {
default: async ({ request, cookies, fetch }) => {
const data = await request.formData();
const res = await fetch("http://localhost:3000/rpc/login", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
username: data.get("username"),
password: data.get("password")
})
});
const response = await res.json();
if (!res.ok) {
return { success: false, message: response.message };
}
cookies.set("session_token", response.token, { path: "/" });
return { success: true };
}
};

1
web-app/src/routes/(anonymous)/login/+page.svelte Normal file
View File

@@ -0,0 +1 @@
<form action=""></form>

22
web-app/src/routes/(anonymous)/register/+page.server.ts Normal file
View File

@@ -0,0 +1,22 @@
export const actions = {
default: async ({ request, fetch }) => {
const data = await request.formData();
const res = await fetch("http://localhost:3000/rpc/register", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
username: data.get("username"),
password: data.get("password")
})
});
const response = await res.json();
if (!res.ok) {
return { success: false, message: response.message };
}
return { success: true };
}
};

1
web-app/src/routes/(anonymous)/register/+page.svelte Normal file
View File

@@ -0,0 +1 @@
<form action=""></form>

16
web-app/src/routes/(authenticated)/website/[websiteId]/+layout.server.ts Normal file
View File

@@ -0,0 +1,16 @@
export const load = async ({ params, fetch, cookies }) => {
const websiteData = await fetch(`http://localhost:3000/cms_content?id=eq.${params.websiteId}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
});
const website = await websiteData.json();
return {
website
};
};

374
web-app/src/routes/(authenticated)/website/[websiteId]/+page.server.ts Normal file
View File

@@ -0,0 +1,374 @@
import { randomUUID } from "node:crypto";
import { mkdir, writeFile } from "node:fs/promises";
import { extname, join, relative } from "node:path";
import { ALLOWED_MIME_TYPES } from "$lib/utils.js";
export const load = async ({ params, fetch, cookies, url }) => {
const globalSettingsData = await fetch(
`http://localhost:3000/cms_settings?content_id=eq.${params.websiteId}&select=*,cms_media(*)`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
}
);
const headerData = await fetch(
`http://localhost:3000/cms_header?content_id=eq.${params.websiteId}&select=*,cms_media(*)`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
}
);
const homeData = await fetch(`http://localhost:3000/cms_home?content_id=eq.${params.websiteId}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
});
const footerData = await fetch(
`http://localhost:3000/cms_footer?content_id=eq.${params.websiteId}`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`,
Accept: "application/vnd.pgrst.object+json"
}
}
);
const searchQuery = url.searchParams.get("article_search_query");
const sortBy = url.searchParams.get("article_sort");
const parameters = new URLSearchParams();
const baseFetchUrl = `http://localhost:3000/cms_article?content_id=eq.${params.websiteId}&select=*,cms_media(*)`;
if (searchQuery) {
parameters.append("title", `ilike.*${searchQuery}*`);
}
switch (sortBy) {
case "creation-time":
parameters.append("order", "created_at.desc");
break;
case "last-modified":
parameters.append("order", "last_modified_at.desc");
break;
case "title-a-to-z":
parameters.append("order", "title.asc");
break;
case "title-z-to-a":
parameters.append("order", "title.desc");
break;
}
const constructedFetchUrl = `${baseFetchUrl}&${parameters.toString()}`;
const articlesData = await fetch(constructedFetchUrl, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
}
});
const globalSettings = await globalSettingsData.json();
const header = await headerData.json();
const home = await homeData.json();
const footer = await footerData.json();
const articles = await articlesData.json();
return {
globalSettings,
header,
home,
footer,
articles
};
};
export const actions = {
updateGlobal: async ({ request, fetch, cookies, params, locals }) => {
const data = await request.formData();
const faviconFile = data.get("favicon") as File;
const favicon = await handleFileUpload(
faviconFile,
params.websiteId,
locals.user.id,
cookies.get("session_token"),
fetch
);
if (favicon?.success === false) {
return favicon;
}
const res = await fetch(
`http://localhost:3000/cms_settings?content_id=eq.${params.websiteId}`,
{
method: "PATCH",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
accent_color_light_theme: data.get("accent-color-light"),
accent_color_dark_theme: data.get("accent-color-dark"),
favicon_image: favicon?.content
})
}
);
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return {
success: true,
operation: "updated",
ressource: "global settings"
};
},
updateHeader: async ({ request, fetch, cookies, locals, params }) => {
const data = await request.formData();
const logoFile = data.get("logo-image") as File;
const logo = await handleFileUpload(
logoFile,
params.websiteId,
locals.user.id,
cookies.get("session_token"),
fetch
);
if (logo?.success === false) {
return logo;
}
const res = await fetch(`http://localhost:3000/cms_header?content_id=eq.${params.websiteId}`, {
method: "PATCH",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
logo_type: data.get("logo-type"),
logo_text: data.get("logo-text"),
logo_image: logo?.content
})
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return {
success: true,
operation: "updated",
ressource: "header settings"
};
},
updateHome: async ({ request, fetch, cookies, params }) => {
const data = await request.formData();
const res = await fetch(`http://localhost:3000/cms_home?content_id=eq.${params.websiteId}`, {
method: "PATCH",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
main_content: data.get("main-content")
})
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return { success: true, operation: "updated", ressource: "home settings" };
},
updateFooter: async ({ request, fetch, cookies, params }) => {
const data = await request.formData();
const res = await fetch(`http://localhost:3000/cms_footer?content_id=eq.${params.websiteId}`, {
method: "PATCH",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
additional_text: data.get("additional-text")
})
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return {
success: true,
operation: "updated",
ressource: "footer settings"
};
},
createArticle: async ({ request, fetch, cookies, params }) => {
const data = await request.formData();
const res = await fetch("http://localhost:3000/cms_article", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
content_id: params.websiteId,
title: data.get("title")
})
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return { success: true, operation: "created", ressource: "article" };
},
editArticle: async ({ request, fetch, cookies, locals, params }) => {
const data = await request.formData();
const coverFile = data.get("cover-image") as File;
const cover = await handleFileUpload(
coverFile,
params.websiteId,
locals.user.id,
cookies.get("session_token"),
fetch
);
if (cover?.success === false) {
return cover;
}
const res = await fetch(`http://localhost:3000/cms_article?id=eq.${data.get("article-id")}`, {
method: "PATCH",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
},
body: JSON.stringify({
title: data.get("title"),
meta_description: data.get("description"),
meta_author: data.get("author"),
cover_image: cover?.content,
publication_date: data.get("publication-date"),
main_content: data.get("main-content")
})
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return { success: true, operation: "updated", ressource: "article" };
},
deleteArticle: async ({ request, fetch, cookies }) => {
const data = await request.formData();
const res = await fetch(`http://localhost:3000/cms_article?id=eq.${data.get("article-id")}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("session_token")}`
}
});
if (!res.ok) {
const response = await res.json();
return { success: false, message: response.message };
}
return { success: true, operation: "deleted", ressource: "article" };
}
};
const handleFileUpload = async (
file: File,
contentId: string,
userId: string,
session_token: string | undefined,
customFetch: typeof fetch
) => {
if (file.size === 0) return undefined;
const MAX_FILE_SIZE = 1024 * 1024;
if (file.size > MAX_FILE_SIZE) {
return {
success: false,
message: `File size exceeds the maximum limit of ${MAX_FILE_SIZE / 1024 / 1024} MB.`
};
}
if (!ALLOWED_MIME_TYPES.includes(file.type)) {
return {
success: false,
message: "Invalid file type. JPEG, PNG, SVG and WEBP are allowed."
};
}
const buffer = Buffer.from(await file.arrayBuffer());
const uploadDir = join(process.cwd(), "static", "user-uploads", userId);
await mkdir(uploadDir, { recursive: true });
const fileId = randomUUID();
const fileExtension = extname(file.name);
const filepath = join(uploadDir, `${fileId}${fileExtension}`);
await writeFile(filepath, buffer);
const relativePath = relative(join(process.cwd(), "static"), filepath);
const res = await customFetch("http://localhost:3000/cms_media", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${session_token}`,
Prefer: "return=representation",
Accept: "application/vnd.pgrst.object+json"
},
body: JSON.stringify({
content_id: contentId,
user_id: userId,
original_name: file.name,
file_system_path: relativePath
})
});
const response = await res.json();
if (!res.ok) {
return { success: false, message: response.message };
}
return { success: true, content: response.id };
};

15
web-app/src/routes/(authenticated)/website/[websiteId]/+page.svelte Normal file
View File

@@ -0,0 +1,15 @@
<section>
<h2>Settings</h2>
</section>
<section>
<h2>Articles</h2>
</section>
<section>
<h2>Collaborators</h2>
</section>
<section>
<h2>Logs</h2>
</section>

5
web-app/src/routes/+layout.server.ts Normal file
View File

@@ -0,0 +1,5 @@
export const load = async ({ locals }) => {
return {
user: locals.user
};
};

11
web-app/src/routes/+page.svelte Normal file
View File

@@ -0,0 +1,11 @@
<section>
<h2>Create website</h2>
</section>
<section>
<h2>Your websites</h2>
</section>
<section>
<h2>Shared with you</h2>
</section>

BIN
web-app/static/favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

18
web-app/svelte.config.ts Normal file
View File

@@ -0,0 +1,18 @@
import adapter from "@sveltejs/adapter-auto";
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
// for more information about preprocessors
preprocess: vitePreprocess(),
kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
adapter: adapter()
}
};
export default config;

19
web-app/tsconfig.json Normal file
View File

@@ -0,0 +1,19 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
// except $lib which is handled by https://kit.svelte.dev/docs/configuration#files
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}

6
web-app/vite.config.ts Normal file
View File

@@ -0,0 +1,6 @@
import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [sveltekit()]
});