diff --git a/.storybook/main.ts b/.storybook/main.ts index 97f259f..c0aa788 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -1,46 +1,39 @@ -import type { StorybookConfig } from '@storybook/sveltekit'; -import { mergeConfig } from 'vite'; -import path from 'path'; +import type { StorybookConfig } from '@storybook/sveltekit' +import { mergeConfig } from 'vite' +import path from 'path' const config: StorybookConfig = { - stories: [ - "../src/**/*.mdx", - "../src/**/*.stories.@(js|ts|svelte)" - ], - addons: [ - "@storybook/addon-svelte-csf", - "@storybook/addon-docs", - "@storybook/addon-a11y" - ], - framework: { - name: "@storybook/sveltekit", - options: {} - }, - viteFinal: async (config) => { - return mergeConfig(config, { - resolve: { - alias: { - '$lib': path.resolve('./src/lib'), - '$components': path.resolve('./src/lib/components'), - '$icons': path.resolve('./src/assets/icons'), - '$illos': path.resolve('./src/assets/illos'), - '$styles': path.resolve('./src/assets/styles') - } - }, - css: { - preprocessorOptions: { - scss: { - additionalData: ` + stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|ts|svelte)'], + addons: ['@storybook/addon-svelte-csf', '@storybook/addon-docs', '@storybook/addon-a11y'], + framework: { + name: '@storybook/sveltekit', + options: {} + }, + viteFinal: async (config) => { + return mergeConfig(config, { + resolve: { + alias: { + $lib: path.resolve('./src/lib'), + $components: path.resolve('./src/lib/components'), + $icons: path.resolve('./src/assets/icons'), + $illos: path.resolve('./src/assets/illos'), + $styles: path.resolve('./src/assets/styles') + } + }, + css: { + preprocessorOptions: { + scss: { + additionalData: ` @import './src/assets/styles/variables.scss'; @import './src/assets/styles/fonts.scss'; @import './src/assets/styles/themes.scss'; `, - api: 'modern-compiler' - } - } - } - }); - } -}; + api: 'modern-compiler' + } + } + } + }) + } +} -export default config; \ No newline at end of file +export default config diff --git a/.storybook/preview.ts b/.storybook/preview.ts index d5ce9cd..f442071 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -1,42 +1,42 @@ -import type { Preview } from '@storybook/sveltekit'; -import '../src/assets/styles/reset.css'; -import '../src/assets/styles/globals.scss'; +import type { Preview } from '@storybook/sveltekit' +import '../src/assets/styles/reset.css' +import '../src/assets/styles/globals.scss' const preview: Preview = { - parameters: { - actions: { argTypesRegex: '^on[A-Z].*' }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, - }, - backgrounds: { - default: 'light', - values: [ - { name: 'light', value: '#ffffff' }, - { name: 'dark', value: '#333333' }, - { name: 'admin', value: '#f5f5f5' }, - { name: 'grey-95', value: '#f8f9fa' }, - ], - }, - viewport: { - viewports: { - mobile: { - name: 'Mobile', - styles: { width: '375px', height: '667px' } - }, - tablet: { - name: 'Tablet', - styles: { width: '768px', height: '1024px' } - }, - desktop: { - name: 'Desktop', - styles: { width: '1440px', height: '900px' } - }, - }, - }, - }, -}; + parameters: { + actions: { argTypesRegex: '^on[A-Z].*' }, + controls: { + matchers: { + color: /(background|color)$/i, + date: /Date$/ + } + }, + backgrounds: { + default: 'light', + values: [ + { name: 'light', value: '#ffffff' }, + { name: 'dark', value: '#333333' }, + { name: 'admin', value: '#f5f5f5' }, + { name: 'grey-95', value: '#f8f9fa' } + ] + }, + viewport: { + viewports: { + mobile: { + name: 'Mobile', + styles: { width: '375px', height: '667px' } + }, + tablet: { + name: 'Tablet', + styles: { width: '768px', height: '1024px' } + }, + desktop: { + name: 'Desktop', + styles: { width: '1440px', height: '900px' } + } + } + } + } +} -export default preview; \ No newline at end of file +export default preview diff --git a/CLAUDE.md b/CLAUDE.md index 6d946cb..1fcaf98 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -38,7 +38,6 @@ We are using Svelte 5 in Runes mode, so make sure to only write solutions that w Make sure to use the CSS variables that are defined across the various files in `src/assets/styles`. When making new colors or defining new variables, check that it doesn't exist first, then define it. - ### Key Architecture Components **API Integration Layer** (`src/routes/api/`) diff --git a/eslint.config.js b/eslint.config.js index b092b0d..8621138 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -1,5 +1,5 @@ // For more info, see https://github.com/storybookjs/eslint-plugin-storybook#configuration-flat-config-format -import storybook from "eslint-plugin-storybook"; +import storybook from 'eslint-plugin-storybook' import js from '@eslint/js' import ts from 'typescript-eslint' @@ -9,12 +9,12 @@ import globals from 'globals' /** @type {import('eslint').Linter.FlatConfig[]} */ export default [ - js.configs.recommended, - ...ts.configs.recommended, - ...svelte.configs['flat/recommended'], - prettier, - ...svelte.configs['flat/prettier'], - { + js.configs.recommended, + ...ts.configs.recommended, + ...svelte.configs['flat/recommended'], + prettier, + ...svelte.configs['flat/prettier'], + { languageOptions: { globals: { ...globals.browser, @@ -22,7 +22,7 @@ export default [ } } }, - { + { files: ['**/*.svelte'], languageOptions: { parserOptions: { @@ -30,8 +30,8 @@ export default [ } } }, - { + { ignores: ['build/', '.svelte-kit/', 'dist/'] }, - ...storybook.configs["flat/recommended"] -]; + ...storybook.configs['flat/recommended'] +] diff --git a/package.json b/package.json index a8bb48a..42a0a38 100644 --- a/package.json +++ b/package.json @@ -1,117 +1,117 @@ { - "name": "jedmund-svelte", - "version": "0.0.1", - "private": true, - "scripts": { - "dev": "vite dev", - "build": "vite build", - "start": "node 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 . && eslint .", - "format": "prettier --write .", - "db:migrate": "prisma migrate dev", - "db:seed": "prisma db seed", - "db:studio": "prisma studio", - "setup:local": "./scripts/setup-local.sh", - "storybook": "storybook dev -p 6006", - "build-storybook": "storybook build" - }, - "devDependencies": { - "@musicorum/lastfm": "github:jedmund/lastfm", - "@poppanator/sveltekit-svg": "^5.0.0-svelte5.4", - "@storybook/addon-a11y": "^9.0.1", - "@storybook/addon-docs": "^9.0.1", - "@storybook/addon-svelte-csf": "^5.0.3", - "@storybook/sveltekit": "^9.0.1", - "@sveltejs/adapter-auto": "^3.0.0", - "@sveltejs/kit": "^2.0.0", - "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6", - "@types/eslint": "^8.56.7", - "@types/node": "^22.0.2", - "autoprefixer": "^10.4.19", - "eslint": "^9.0.0", - "eslint-config-prettier": "^9.1.0", - "eslint-plugin-storybook": "^9.0.1", - "eslint-plugin-svelte": "^2.36.0", - "globals": "^15.0.0", - "postcss": "^8.4.39", - "prettier": "^3.1.1", - "prettier-plugin-svelte": "^3.1.2", - "sass": "^1.77.8", - "storybook": "^9.0.1", - "svelte": "^5.0.0-next.1", - "svelte-check": "^3.6.0", - "tslib": "^2.4.1", - "tsx": "^4.19.4", - "typescript": "^5.5.3", - "typescript-eslint": "^8.0.0-alpha.20", - "vite": "^5.0.3" - }, - "type": "module", - "dependencies": { - "@aarkue/tiptap-math-extension": "^1.3.6", - "@prisma/client": "^6.8.2", - "@sveltejs/adapter-node": "^5.2.0", - "@tiptap/core": "^2.12.0", - "@tiptap/extension-bubble-menu": "^2.12.0", - "@tiptap/extension-character-count": "^2.12.0", - "@tiptap/extension-code-block-lowlight": "^2.12.0", - "@tiptap/extension-color": "^2.12.0", - "@tiptap/extension-floating-menu": "^2.12.0", - "@tiptap/extension-highlight": "^2.12.0", - "@tiptap/extension-image": "^2.12.0", - "@tiptap/extension-link": "^2.12.0", - "@tiptap/extension-placeholder": "^2.12.0", - "@tiptap/extension-subscript": "^2.12.0", - "@tiptap/extension-superscript": "^2.12.0", - "@tiptap/extension-table": "^2.12.0", - "@tiptap/extension-table-header": "^2.12.0", - "@tiptap/extension-table-row": "^2.12.0", - "@tiptap/extension-task-item": "^2.12.0", - "@tiptap/extension-task-list": "^2.12.0", - "@tiptap/extension-text": "^2.12.0", - "@tiptap/extension-text-align": "^2.12.0", - "@tiptap/extension-text-style": "^2.12.0", - "@tiptap/extension-typography": "^2.12.0", - "@tiptap/extension-underline": "^2.12.0", - "@tiptap/pm": "^2.12.0", - "@tiptap/starter-kit": "^2.12.0", - "@tiptap/suggestion": "^2.12.0", - "@types/multer": "^1.4.12", - "@types/redis": "^4.0.10", - "@types/steamapi": "^2.2.5", - "cloudinary": "^2.6.1", - "dotenv": "^16.5.0", - "exifr": "^7.1.3", - "giantbombing-api": "^1.0.4", - "gray-matter": "^4.0.3", - "ioredis": "^5.4.1", - "katex": "^0.16.22", - "lowlight": "^3.3.0", - "lucide-svelte": "^0.511.0", - "marked": "^15.0.12", - "multer": "^2.0.0", - "node-itunes-search": "^1.2.3", - "prisma": "^6.8.2", - "psn-api": "github:jedmund/psn-api", - "redis": "^4.7.0", - "sharp": "^0.34.2", - "steamapi": "^3.0.11", - "svelte-tiptap": "^2.1.0", - "svgo": "^3.3.2", - "tinyduration": "^3.3.1", - "tippy.js": "^6.3.7", - "tiptap-extension-auto-joiner": "^0.1.3", - "tiptap-extension-global-drag-handle": "^0.1.18", - "tiptap-markdown": "^0.8.10", - "zod": "^3.25.30" - }, - "prisma": { - "seed": "tsx prisma/seed.ts" - }, - "overrides": { - "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6" - } + "name": "jedmund-svelte", + "version": "0.0.1", + "private": true, + "scripts": { + "dev": "vite dev", + "build": "vite build", + "start": "node 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 . && eslint .", + "format": "prettier --write .", + "db:migrate": "prisma migrate dev", + "db:seed": "prisma db seed", + "db:studio": "prisma studio", + "setup:local": "./scripts/setup-local.sh", + "storybook": "storybook dev -p 6006", + "build-storybook": "storybook build" + }, + "devDependencies": { + "@musicorum/lastfm": "github:jedmund/lastfm", + "@poppanator/sveltekit-svg": "^5.0.0-svelte5.4", + "@storybook/addon-a11y": "^9.0.1", + "@storybook/addon-docs": "^9.0.1", + "@storybook/addon-svelte-csf": "^5.0.3", + "@storybook/sveltekit": "^9.0.1", + "@sveltejs/adapter-auto": "^3.0.0", + "@sveltejs/kit": "^2.0.0", + "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6", + "@types/eslint": "^8.56.7", + "@types/node": "^22.0.2", + "autoprefixer": "^10.4.19", + "eslint": "^9.0.0", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-storybook": "^9.0.1", + "eslint-plugin-svelte": "^2.36.0", + "globals": "^15.0.0", + "postcss": "^8.4.39", + "prettier": "^3.1.1", + "prettier-plugin-svelte": "^3.1.2", + "sass": "^1.77.8", + "storybook": "^9.0.1", + "svelte": "^5.0.0-next.1", + "svelte-check": "^3.6.0", + "tslib": "^2.4.1", + "tsx": "^4.19.4", + "typescript": "^5.5.3", + "typescript-eslint": "^8.0.0-alpha.20", + "vite": "^5.0.3" + }, + "type": "module", + "dependencies": { + "@aarkue/tiptap-math-extension": "^1.3.6", + "@prisma/client": "^6.8.2", + "@sveltejs/adapter-node": "^5.2.0", + "@tiptap/core": "^2.12.0", + "@tiptap/extension-bubble-menu": "^2.12.0", + "@tiptap/extension-character-count": "^2.12.0", + "@tiptap/extension-code-block-lowlight": "^2.12.0", + "@tiptap/extension-color": "^2.12.0", + "@tiptap/extension-floating-menu": "^2.12.0", + "@tiptap/extension-highlight": "^2.12.0", + "@tiptap/extension-image": "^2.12.0", + "@tiptap/extension-link": "^2.12.0", + "@tiptap/extension-placeholder": "^2.12.0", + "@tiptap/extension-subscript": "^2.12.0", + "@tiptap/extension-superscript": "^2.12.0", + "@tiptap/extension-table": "^2.12.0", + "@tiptap/extension-table-header": "^2.12.0", + "@tiptap/extension-table-row": "^2.12.0", + "@tiptap/extension-task-item": "^2.12.0", + "@tiptap/extension-task-list": "^2.12.0", + "@tiptap/extension-text": "^2.12.0", + "@tiptap/extension-text-align": "^2.12.0", + "@tiptap/extension-text-style": "^2.12.0", + "@tiptap/extension-typography": "^2.12.0", + "@tiptap/extension-underline": "^2.12.0", + "@tiptap/pm": "^2.12.0", + "@tiptap/starter-kit": "^2.12.0", + "@tiptap/suggestion": "^2.12.0", + "@types/multer": "^1.4.12", + "@types/redis": "^4.0.10", + "@types/steamapi": "^2.2.5", + "cloudinary": "^2.6.1", + "dotenv": "^16.5.0", + "exifr": "^7.1.3", + "giantbombing-api": "^1.0.4", + "gray-matter": "^4.0.3", + "ioredis": "^5.4.1", + "katex": "^0.16.22", + "lowlight": "^3.3.0", + "lucide-svelte": "^0.511.0", + "marked": "^15.0.12", + "multer": "^2.0.0", + "node-itunes-search": "^1.2.3", + "prisma": "^6.8.2", + "psn-api": "github:jedmund/psn-api", + "redis": "^4.7.0", + "sharp": "^0.34.2", + "steamapi": "^3.0.11", + "svelte-tiptap": "^2.1.0", + "svgo": "^3.3.2", + "tinyduration": "^3.3.1", + "tippy.js": "^6.3.7", + "tiptap-extension-auto-joiner": "^0.1.3", + "tiptap-extension-global-drag-handle": "^0.1.18", + "tiptap-markdown": "^0.8.10", + "zod": "^3.25.30" + }, + "prisma": { + "seed": "tsx prisma/seed.ts" + }, + "overrides": { + "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6" + } } diff --git a/prisma/seed.ts b/prisma/seed.ts index 58cba1c3..02aaa61 100644 --- a/prisma/seed.ts +++ b/prisma/seed.ts @@ -101,7 +101,8 @@ async function main() { slug: 'granblue-team', title: 'granblue.team', subtitle: 'Comprehensive web app for Granblue Fantasy players', - description: 'A comprehensive web application for Granblue Fantasy players to track raids, manage crews, and optimize team compositions. Features real-time raid tracking, character databases, and community tools.', + description: + 'A comprehensive web application for Granblue Fantasy players to track raids, manage crews, and optimize team compositions. Features real-time raid tracking, character databases, and community tools.', year: 2022, client: 'Personal Project', role: 'Full-Stack Developer', @@ -119,7 +120,8 @@ async function main() { slug: 'subway-board', title: 'Subway Board', subtitle: 'Beautiful, minimalist NYC subway dashboard', - description: 'A beautiful, minimalist dashboard displaying real-time NYC subway arrival times. Clean interface inspired by the classic subway map design with live MTA data integration.', + description: + 'A beautiful, minimalist dashboard displaying real-time NYC subway arrival times. Clean interface inspired by the classic subway map design with live MTA data integration.', year: 2023, client: 'Personal Project', role: 'Developer & Designer', @@ -136,7 +138,8 @@ async function main() { slug: 'siero-discord', title: 'Siero for Discord', subtitle: 'Discord bot for Granblue Fantasy communities', - description: 'A Discord bot for Granblue Fantasy communities providing character lookups, raid notifications, and server management tools. Serves thousands of users across multiple servers.', + description: + 'A Discord bot for Granblue Fantasy communities providing character lookups, raid notifications, and server management tools. Serves thousands of users across multiple servers.', year: 2021, client: 'Personal Project', role: 'Bot Developer', @@ -153,7 +156,8 @@ async function main() { slug: 'homelab', title: 'Homelab', subtitle: 'Self-hosted infrastructure on Kubernetes', - description: 'Self-hosted infrastructure running on Kubernetes with monitoring, media servers, and development environments. Includes automated deployments and backup strategies.', + description: + 'Self-hosted infrastructure running on Kubernetes with monitoring, media servers, and development environments. Includes automated deployments and backup strategies.', year: 2023, client: 'Personal Project', role: 'DevOps Engineer', @@ -181,11 +185,13 @@ async function main() { { type: 'paragraph', content: 'This is my first essay on the new CMS!' }, { type: 'paragraph', - content: 'The system now uses a simplified post type system with just essays and posts.' + content: + 'The system now uses a simplified post type system with just essays and posts.' }, { type: 'paragraph', - content: 'Essays are perfect for longer-form content with titles and excerpts, while posts are great for quick thoughts and updates.' + content: + 'Essays are perfect for longer-form content with titles and excerpts, while posts are great for quick thoughts and updates.' } ] }, @@ -203,7 +209,8 @@ async function main() { blocks: [ { type: 'paragraph', - content: 'Just pushed a major update to the site. The new simplified post types are working great! 🎉' + content: + 'Just pushed a major update to the site. The new simplified post types are working great! 🎉' } ] }, @@ -221,7 +228,8 @@ async function main() { blocks: [ { type: 'paragraph', - content: 'Design systems have become essential for maintaining consistency across large products.' + content: + 'Design systems have become essential for maintaining consistency across large products.' }, { type: 'paragraph', @@ -229,7 +237,8 @@ async function main() { }, { type: 'paragraph', - content: 'Too rigid, and designers feel boxed in. Too flexible, and you lose consistency.' + content: + 'Too rigid, and designers feel boxed in. Too flexible, and you lose consistency.' } ] }, @@ -264,7 +273,8 @@ async function main() { blocks: [ { type: 'paragraph', - content: 'Built a small CLI tool over the weekend. Sometimes the best projects come from scratching your own itch.' + content: + 'Built a small CLI tool over the weekend. Sometimes the best projects come from scratching your own itch.' } ] }, diff --git a/src/lib/admin-auth.ts b/src/lib/admin-auth.ts index 91cd843..a89ff9b 100644 --- a/src/lib/admin-auth.ts +++ b/src/lib/admin-auth.ts @@ -15,9 +15,9 @@ export function getAuthHeaders(): HeadersInit { // In production, this should redirect to login adminCredentials = btoa('admin:localdev') } - + return { - 'Authorization': `Basic ${adminCredentials}` + Authorization: `Basic ${adminCredentials}` } } @@ -32,14 +32,17 @@ export function clearAuth() { } // Make authenticated API request -export async function authenticatedFetch(url: string, options: RequestInit = {}): Promise { +export async function authenticatedFetch( + url: string, + options: RequestInit = {} +): Promise { const headers = { ...getAuthHeaders(), ...options.headers } - + return fetch(url, { ...options, headers }) -} \ No newline at end of file +} diff --git a/src/lib/components/AvatarSimple.svelte b/src/lib/components/AvatarSimple.svelte index ed75bbb..0ec51d3 100644 --- a/src/lib/components/AvatarSimple.svelte +++ b/src/lib/components/AvatarSimple.svelte @@ -11,11 +11,11 @@ display: inline-block; width: 100%; height: 100%; - + :global(svg) { width: 100%; height: 100%; border-radius: $avatar-radius; } } - \ No newline at end of file + diff --git a/src/lib/components/DynamicPostContent.svelte b/src/lib/components/DynamicPostContent.svelte index 9c1d90f..dcefdfa 100644 --- a/src/lib/components/DynamicPostContent.svelte +++ b/src/lib/components/DynamicPostContent.svelte @@ -14,9 +14,12 @@ const getPostTypeLabel = (postType: string) => { switch (postType) { - case 'post': return 'Post' - case 'essay': return 'Essay' - default: return 'Post' + case 'post': + return 'Post' + case 'essay': + return 'Essay' + default: + return 'Post' } } @@ -42,18 +45,22 @@ case 'bulletList': case 'ul': - const listItems = (block.content || []).map((item: any) => { - const itemText = item.content || item.text || '' - return `
  • ${itemText}
    • ` - }).join('') + const listItems = (block.content || []) + .map((item: any) => { + const itemText = item.content || item.text || '' + return `
  • ${itemText}
    • ` + }) + .join('') return `` case 'orderedList': case 'ol': - const orderedItems = (block.content || []).map((item: any) => { - const itemText = item.content || item.text || '' - return `
  • ${itemText}
    • ` - }).join('') + const orderedItems = (block.content || []) + .map((item: any) => { + const itemText = item.content || item.text || '' + return `
  • ${itemText}
    • ` + }) + .join('') return `
      ${orderedItems}
    ` case 'blockquote': @@ -110,11 +117,13 @@ {#if post.linkUrl}
    - +
    {/if} @@ -316,7 +325,8 @@ background: $grey-95; padding: 2px 6px; border-radius: 4px; - font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace; + font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', + monospace; font-size: 0.9em; color: $grey-10; } @@ -392,4 +402,4 @@ text-underline-offset: 0.15em; } } - \ No newline at end of file + diff --git a/src/lib/components/LabCard.svelte b/src/lib/components/LabCard.svelte index d787959..46a165a 100644 --- a/src/lib/components/LabCard.svelte +++ b/src/lib/components/LabCard.svelte @@ -38,9 +38,18 @@ {#if project.status === 'password-protected'}
    - - - + + + Password Protected
    @@ -81,8 +90,20 @@ {#if project.status === 'list-only'}
    - - + + View Only
    @@ -232,4 +253,4 @@ font-weight: 500; } } - \ No newline at end of file + diff --git a/src/lib/components/PhotoGrid.svelte b/src/lib/components/PhotoGrid.svelte index ade94e8..156f50e 100644 --- a/src/lib/components/PhotoGrid.svelte +++ b/src/lib/components/PhotoGrid.svelte @@ -2,12 +2,12 @@ import PhotoItem from '$components/PhotoItem.svelte' import type { PhotoItem as PhotoItemType } from '$lib/types/photos' - const { + const { photoItems, - albumSlug - }: { + albumSlug + }: { photoItems: PhotoItemType[] - albumSlug?: string + albumSlug?: string } = $props() diff --git a/src/lib/components/ProjectContent.svelte b/src/lib/components/ProjectContent.svelte index 0cc45a0..20adb6c 100644 --- a/src/lib/components/ProjectContent.svelte +++ b/src/lib/components/ProjectContent.svelte @@ -278,4 +278,4 @@ color: $grey-20; } } - \ No newline at end of file + diff --git a/src/lib/components/ProjectPasswordProtection.svelte b/src/lib/components/ProjectPasswordProtection.svelte index f8d154d..f48cd68 100644 --- a/src/lib/components/ProjectPasswordProtection.svelte +++ b/src/lib/components/ProjectPasswordProtection.svelte @@ -32,7 +32,7 @@ error = '' // Simulate a small delay for better UX - await new Promise(resolve => setTimeout(resolve, 500)) + await new Promise((resolve) => setTimeout(resolve, 500)) if (password === correctPassword) { // Store in session storage @@ -63,7 +63,13 @@ {#snippet passwordHeader()}
    - + -
    -
    - Album -
    +
    Album
    @@ -27,8 +25,8 @@ {#if album.coverPhoto}
    - {album.coverPhoto.caption @@ -60,9 +58,7 @@
    - - View album → - + View album →
    @@ -217,4 +213,4 @@ height: 16px; fill: $grey-40; } - \ No newline at end of file + diff --git a/src/lib/components/UniverseFeed.svelte b/src/lib/components/UniverseFeed.svelte index 572b62d..4f6ac16 100644 --- a/src/lib/components/UniverseFeed.svelte +++ b/src/lib/components/UniverseFeed.svelte @@ -39,4 +39,4 @@ font-size: 1.125rem; } } - \ No newline at end of file + diff --git a/src/lib/components/UniversePostCard.svelte b/src/lib/components/UniversePostCard.svelte index 9b47ccf..2069c15 100644 --- a/src/lib/components/UniversePostCard.svelte +++ b/src/lib/components/UniversePostCard.svelte @@ -15,9 +15,12 @@ const getPostTypeLabel = (postType: string) => { switch (postType) { - case 'post': return 'Post' - case 'essay': return 'Essay' - default: return 'Post' + case 'post': + return 'Post' + case 'essay': + return 'Essay' + default: + return 'Post' } } @@ -85,9 +88,7 @@ {/if}
    - - Read more → - + Read more →
    @@ -241,4 +242,4 @@ height: 16px; fill: $grey-40; } - \ No newline at end of file + diff --git a/src/lib/components/admin/AdminByline.svelte b/src/lib/components/admin/AdminByline.svelte index 7e46c13..5cbed27 100644 --- a/src/lib/components/admin/AdminByline.svelte +++ b/src/lib/components/admin/AdminByline.svelte @@ -40,4 +40,4 @@ gap: $unit-half; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/AdminHeader.svelte b/src/lib/components/admin/AdminHeader.svelte index dd45b72..64ddb0a 100644 --- a/src/lib/components/admin/AdminHeader.svelte +++ b/src/lib/components/admin/AdminHeader.svelte @@ -36,4 +36,4 @@ align-items: center; gap: $unit-2x; } - \ No newline at end of file + diff --git a/src/lib/components/admin/AlbumForm.svelte b/src/lib/components/admin/AlbumForm.svelte index a47ecc4..e038f84 100644 --- a/src/lib/components/admin/AlbumForm.svelte +++ b/src/lib/components/admin/AlbumForm.svelte @@ -40,7 +40,11 @@ $effect(() => { if (initialData && mode === 'edit') { // Parse album content structure - if (initialData.content && typeof initialData.content === 'object' && 'type' in initialData.content) { + if ( + initialData.content && + typeof initialData.content === 'object' && + 'type' in initialData.content + ) { const albumContent = initialData.content as any if (albumContent.type === 'album') { // Album content structure: { type: 'album', gallery: [mediaIds], description: JSONContent } @@ -56,7 +60,7 @@ // Fallback to regular content content = initialData.content || { type: 'doc', content: [] } } - + // Load gallery from initialData if provided directly if (initialData.gallery) { gallery = initialData.gallery @@ -80,7 +84,7 @@ }) const mediaResults = await Promise.all(mediaPromises) - gallery = mediaResults.filter(media => media !== null) + gallery = mediaResults.filter((media) => media !== null) } catch (error) { console.error('Failed to load gallery media:', error) } @@ -114,9 +118,9 @@ postType: 'album', status: newStatus, content, - gallery: gallery.map(media => media.id), + gallery: gallery.map((media) => media.id), featuredImage: gallery.length > 0 ? gallery[0].id : undefined, - tags: tags.trim() ? tags.split(',').map(tag => tag.trim()) : [] + tags: tags.trim() ? tags.split(',').map((tag) => tag.trim()) : [] } const url = mode === 'edit' ? `/api/posts/${postId}` : '/api/posts' @@ -169,7 +173,7 @@ if (mode === 'create') { return title.trim().length > 0 || gallery.length > 0 || tags.trim().length > 0 } - + // For edit mode, compare with initial data return ( title !== (initialData?.title || '') || @@ -197,19 +201,23 @@
    {#if mode === 'create'} - - + - {:else} - + @@ -364,4 +372,4 @@ gap: $unit; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/AlbumListItem.svelte b/src/lib/components/admin/AlbumListItem.svelte index 312f06f..23afafd 100644 --- a/src/lib/components/admin/AlbumListItem.svelte +++ b/src/lib/components/admin/AlbumListItem.svelte @@ -50,19 +50,19 @@ const diffInSeconds = Math.floor((now.getTime() - date.getTime()) / 1000) if (diffInSeconds < 60) return 'just now' - + const minutes = Math.floor(diffInSeconds / 60) if (diffInSeconds < 3600) return `${minutes} ${minutes === 1 ? 'minute' : 'minutes'} ago` - + const hours = Math.floor(diffInSeconds / 3600) if (diffInSeconds < 86400) return `${hours} ${hours === 1 ? 'hour' : 'hours'} ago` - + const days = Math.floor(diffInSeconds / 86400) if (diffInSeconds < 2592000) return `${days} ${days === 1 ? 'day' : 'days'} ago` - + const months = Math.floor(diffInSeconds / 2592000) if (diffInSeconds < 31536000) return `${months} ${months === 1 ? 'month' : 'months'} ago` - + const years = Math.floor(diffInSeconds / 31536000) return `${years} ${years === 1 ? 'year' : 'years'} ago` } @@ -90,17 +90,17 @@ // Get thumbnail - try cover photo first, then first photo function getThumbnailUrl(): string | null { if (album.coverPhotoId && album.photos.length > 0) { - const coverPhoto = album.photos.find(p => p.id === album.coverPhotoId) + const coverPhoto = album.photos.find((p) => p.id === album.coverPhotoId) if (coverPhoto) { return coverPhoto.thumbnailUrl || coverPhoto.url } } - + // Fallback to first photo if (album.photos.length > 0) { return album.photos[0].thumbnailUrl || album.photos[0].url } - + return null } @@ -133,15 +133,15 @@

    {album.title}

    -
    @@ -300,4 +300,4 @@ background-color: $grey-90; margin: $unit-half 0; } - \ No newline at end of file + diff --git a/src/lib/components/admin/AlbumMetadataPopover.svelte b/src/lib/components/admin/AlbumMetadataPopover.svelte index 5cb8921..b5c4ca3 100644 --- a/src/lib/components/admin/AlbumMetadataPopover.svelte +++ b/src/lib/components/admin/AlbumMetadataPopover.svelte @@ -95,10 +95,10 @@ }) - \ No newline at end of file +/> diff --git a/src/lib/components/admin/DeleteConfirmationModal.svelte b/src/lib/components/admin/DeleteConfirmationModal.svelte index aa3dc38..5e7d0d4 100644 --- a/src/lib/components/admin/DeleteConfirmationModal.svelte +++ b/src/lib/components/admin/DeleteConfirmationModal.svelte @@ -80,13 +80,13 @@ font-size: 1.25rem; font-weight: 700; color: $grey-10; - } + } p { margin: 0 0 $unit-4x; color: $grey-20; line-height: 1.5; - } + } } .modal-actions { diff --git a/src/lib/components/admin/DropdownItem.svelte b/src/lib/components/admin/DropdownItem.svelte index 315d8a6..a768e25 100644 --- a/src/lib/components/admin/DropdownItem.svelte +++ b/src/lib/components/admin/DropdownItem.svelte @@ -5,12 +5,7 @@ disabled?: boolean } - let { - onclick, - variant = 'default', - disabled = false, - children - }: Props = $props() + let { onclick, variant = 'default', disabled = false, children }: Props = $props() function handleClick(event: MouseEvent) { if (disabled) return @@ -56,4 +51,4 @@ cursor: not-allowed; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/DropdownMenu.svelte b/src/lib/components/admin/DropdownMenu.svelte index 70308b8..55c6a51 100644 --- a/src/lib/components/admin/DropdownMenu.svelte +++ b/src/lib/components/admin/DropdownMenu.svelte @@ -17,12 +17,7 @@ divider?: boolean } - let { - isOpen = $bindable(), - triggerElement, - items, - onClose - }: Props = $props() + let { isOpen = $bindable(), triggerElement, items, onClose }: Props = $props() let dropdownElement: HTMLDivElement const dispatch = createEventDispatcher() @@ -35,7 +30,7 @@ const rect = triggerElement.getBoundingClientRect() const dropdownWidth = 180 - + return { top: rect.bottom + 4, left: rect.right - dropdownWidth @@ -51,7 +46,7 @@ function handleOutsideClick(event: MouseEvent) { if (!dropdownElement || !isOpen) return - + const target = event.target as HTMLElement if (!dropdownElement.contains(target) && !triggerElement?.contains(target)) { isOpen = false @@ -131,4 +126,4 @@ background-color: $grey-90; margin: $unit-half 0; } - \ No newline at end of file + diff --git a/src/lib/components/admin/DropdownMenuContainer.svelte b/src/lib/components/admin/DropdownMenuContainer.svelte index 55d2551..91559cc 100644 --- a/src/lib/components/admin/DropdownMenuContainer.svelte +++ b/src/lib/components/admin/DropdownMenuContainer.svelte @@ -25,4 +25,4 @@ min-width: 180px; z-index: 10; } - \ No newline at end of file + diff --git a/src/lib/components/admin/Editor.svelte b/src/lib/components/admin/Editor.svelte index 21223c3..c2e4f39 100644 --- a/src/lib/components/admin/Editor.svelte +++ b/src/lib/components/admin/Editor.svelte @@ -71,7 +71,7 @@ const timer = setTimeout(() => { editor.commands.focus() }, 100) - + return () => clearTimeout(timer) } }) diff --git a/src/lib/components/admin/EditorWithUpload.svelte b/src/lib/components/admin/EditorWithUpload.svelte index 68b161d..65d7964 100644 --- a/src/lib/components/admin/EditorWithUpload.svelte +++ b/src/lib/components/admin/EditorWithUpload.svelte @@ -212,7 +212,9 @@ if (!clipboardData) return false // Check for images first - const imageItem = Array.from(clipboardData.items).find(item => item.type.indexOf('image') === 0) + const imageItem = Array.from(clipboardData.items).find( + (item) => item.type.indexOf('image') === 0 + ) if (imageItem) { const file = imageItem.getAsFile() if (!file) return false @@ -232,11 +234,11 @@ // Handle text paste - strip HTML formatting const htmlData = clipboardData.getData('text/html') const plainText = clipboardData.getData('text/plain') - + if (htmlData && plainText) { // If we have both HTML and plain text, use plain text to strip formatting event.preventDefault() - + // Use editor commands to insert text so all callbacks are triggered const editorInstance = (view as any).editor if (editorInstance) { @@ -248,7 +250,7 @@ const transaction = state.tr.insertText(plainText, selection.from, selection.to) dispatch(transaction) } - + return true // Prevent default paste behavior } diff --git a/src/lib/components/admin/EssayForm.svelte b/src/lib/components/admin/EssayForm.svelte index ba17ea8..cbafcb4 100644 --- a/src/lib/components/admin/EssayForm.svelte +++ b/src/lib/components/admin/EssayForm.svelte @@ -264,18 +264,9 @@ }} >
    - + - + item.id)) - const newImages = media.filter(item => !existingIds.has(item.id)) - + const existingIds = new Set(value.map((item) => item.id)) + const newImages = media.filter((item) => !existingIds.has(item.id)) + if (maxItems) { const availableSlots = maxItems - value.length value = [...value, ...newImages.slice(0, availableSlots)] } else { value = [...value, ...newImages] } - + showModal = false } @@ -51,11 +51,11 @@ // Drag and Drop functionality function handleDragStart(event: DragEvent, index: number) { if (!event.dataTransfer) return - + draggedIndex = index event.dataTransfer.effectAllowed = 'move' event.dataTransfer.setData('text/html', '') - + // Add dragging class to the dragged element const target = event.target as HTMLElement target.style.opacity = '0.5' @@ -64,7 +64,7 @@ function handleDragEnd(event: DragEvent) { const target = event.target as HTMLElement target.style.opacity = '1' - + draggedIndex = null dragOverIndex = null } @@ -72,7 +72,7 @@ function handleDragOver(event: DragEvent, index: number) { event.preventDefault() if (!event.dataTransfer) return - + event.dataTransfer.dropEffect = 'move' dragOverIndex = index } @@ -83,7 +83,7 @@ function handleDrop(event: DragEvent, dropIndex: number) { event.preventDefault() - + if (draggedIndex === null || draggedIndex === dropIndex) { return } @@ -91,16 +91,16 @@ // Reorder the array const newValue = [...value] const draggedItem = newValue[draggedIndex] - + // Remove the dragged item newValue.splice(draggedIndex, 1) - + // Insert at the new position (adjust index if necessary) const insertIndex = draggedIndex < dropIndex ? dropIndex - 1 : dropIndex newValue.splice(insertIndex, 0, draggedItem) - + value = newValue - + // Reset drag state draggedIndex = null dragOverIndex = null @@ -117,10 +117,8 @@ // Computed properties const hasImages = $derived(value.length > 0) const canAddMore = $derived(!maxItems || value.length < maxItems) - const selectedIds = $derived(value.map(item => item.id)) - const itemsText = $derived( - value.length === 1 ? '1 image' : `${value.length} images` - ) + const selectedIds = $derived(value.map((item) => item.id)) + const itemsText = $derived(value.length === 1 ? '1 image' : `${value.length} images`)
    @@ -131,7 +129,7 @@ * {/if} - + {#if hasImages} {itemsText} @@ -146,7 +144,7 @@ {#if hasImages}
    {#each value as item, index (item.id)} -
    - - - - - - - + + + + + + +
    @@ -174,10 +178,29 @@ {item.filename} {:else}
    - - - - + + + +
    {/if} @@ -192,13 +215,19 @@ {/if} - - + {#if data[field.key] && data[field.key].length > 0}
    {#each data[field.key] as tag} @@ -459,11 +456,10 @@ } } - @include breakpoint('phone') { .metadata-popover { min-width: 280px; max-width: calc(100vw - 2rem); } } - \ No newline at end of file + diff --git a/src/lib/components/admin/ImagePicker.svelte b/src/lib/components/admin/ImagePicker.svelte index 74ae431..fc8affa 100644 --- a/src/lib/components/admin/ImagePicker.svelte +++ b/src/lib/components/admin/ImagePicker.svelte @@ -53,14 +53,12 @@ // Calculate aspect ratio styles const aspectRatioStyle = $derived( - !aspectRatio + !aspectRatio ? 'aspect-ratio: 16/9;' : (() => { - const [width, height] = aspectRatio.split(':').map(Number) - return width && height - ? `aspect-ratio: ${width}/${height};` - : 'aspect-ratio: 16/9;' - })() + const [width, height] = aspectRatio.split(':').map(Number) + return width && height ? `aspect-ratio: ${width}/${height};` : 'aspect-ratio: 16/9;' + })() ) @@ -73,7 +71,7 @@ -
    e.key === 'Enter' && openModal()} - onmouseenter={() => isHovering = true} - onmouseleave={() => isHovering = false} + onmouseenter={() => (isHovering = true)} + onmouseleave={() => (isHovering = false)} > {#if hasImage && value} - {value.filename} - + {value.filename} + {#if isHovering}
    @@ -149,10 +143,24 @@
    - - - - + + + +

    {placeholder}

    @@ -390,4 +398,4 @@ text-align: left; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/ImageUploadPlaceholder.svelte b/src/lib/components/admin/ImageUploadPlaceholder.svelte index 6b1211b..ddc6c31 100644 --- a/src/lib/components/admin/ImageUploadPlaceholder.svelte +++ b/src/lib/components/admin/ImageUploadPlaceholder.svelte @@ -31,7 +31,8 @@ const selectedMedia = Array.isArray(media) ? media[0] : media if (selectedMedia) { // Set a reasonable default width (max 600px) - const displayWidth = selectedMedia.width && selectedMedia.width > 600 ? 600 : selectedMedia.width + const displayWidth = + selectedMedia.width && selectedMedia.width > 600 ? 600 : selectedMedia.width editor .chain() @@ -186,7 +187,7 @@ Upload Image - + - +
    - +
    {#if allowAltText} @@ -309,7 +327,7 @@ buttonSize="small" onblur={handleAltTextChange} /> - +
    - - +
    @@ -342,11 +360,30 @@ Replace - + @@ -365,10 +402,9 @@

    {/if} - {:else} -
    - - - - - - + + + + + +

    {placeholder}

    @@ -432,14 +509,10 @@ {#if !hasValue && !isUploading}

    - - + + {#if showBrowseLibrary} - + {/if}
    {/if} @@ -455,7 +528,7 @@ helpText="Help make your content accessible. Describe what's in the image." onblur={handleAltTextChange} /> - + \ No newline at end of file + diff --git a/src/lib/components/admin/MediaDetailsModal.svelte b/src/lib/components/admin/MediaDetailsModal.svelte index 4b094f9..c9eb3d0 100644 --- a/src/lib/components/admin/MediaDetailsModal.svelte +++ b/src/lib/components/admin/MediaDetailsModal.svelte @@ -13,12 +13,7 @@ onUpdate: (updatedMedia: Media) => void } - let { - isOpen = $bindable(), - media, - onClose, - onUpdate - }: Props = $props() + let { isOpen = $bindable(), media, onClose, onUpdate }: Props = $props() // Form state let altText = $state('') @@ -29,14 +24,16 @@ let successMessage = $state('') // Usage tracking state - let usage = $state>([]) + let usage = $state< + Array<{ + contentType: string + contentId: number + contentTitle: string + fieldDisplayName: string + contentUrl?: string + createdAt: string + }> + >([]) let loadingUsage = $state(false) // Initialize form when media changes @@ -54,11 +51,11 @@ // Load usage information async function loadUsage() { if (!media) return - + try { loadingUsage = true const response = await authenticatedFetch(`/api/media/${media.id}/usage`) - + if (response.ok) { const data = await response.json() usage = data.usage || [] @@ -110,12 +107,11 @@ const updatedMedia = await response.json() onUpdate(updatedMedia) successMessage = 'Media updated successfully!' - + // Auto-close after success setTimeout(() => { handleClose() }, 1500) - } catch (err) { error = 'Failed to update media. Please try again.' console.error('Failed to update media:', err) @@ -125,7 +121,10 @@ } async function handleDelete() { - if (!media || !confirm('Are you sure you want to delete this media file? This action cannot be undone.')) { + if ( + !media || + !confirm('Are you sure you want to delete this media file? This action cannot be undone.') + ) { return } @@ -144,7 +143,6 @@ // Close modal and let parent handle the deletion handleClose() // Note: Parent component should refresh the media list - } catch (err) { error = 'Failed to delete media. Please try again.' console.error('Failed to delete media:', err) @@ -155,17 +153,20 @@ function copyUrl() { if (media?.url) { - navigator.clipboard.writeText(media.url).then(() => { - successMessage = 'URL copied to clipboard!' - setTimeout(() => { - successMessage = '' - }, 2000) - }).catch(() => { - error = 'Failed to copy URL' - setTimeout(() => { - error = '' - }, 2000) - }) + navigator.clipboard + .writeText(media.url) + .then(() => { + successMessage = 'URL copied to clipboard!' + setTimeout(() => { + successMessage = '' + }, 2000) + }) + .catch(() => { + error = 'Failed to copy URL' + setTimeout(() => { + error = '' + }, 2000) + }) } } @@ -187,7 +188,13 @@ {#if media} - +
    @@ -197,8 +204,20 @@
    {#if !isSaving} {/if} @@ -213,9 +232,27 @@ {:else}
    - - - + + + {getFileType(media.mimeType)}
    @@ -246,9 +283,7 @@ URL:
    {media.url} - +
    @@ -257,7 +292,7 @@

    Accessibility & SEO

    - + - +
    Photography - Show this media in the photography experience + Show this media in the photography experience
    @@ -311,7 +347,12 @@
    {#if usageItem.contentUrl} - + {usageItem.contentTitle} {:else} @@ -321,7 +362,9 @@
    {usageItem.fieldDisplayName} - Added {new Date(usageItem.createdAt).toLocaleDateString()} + Added {new Date(usageItem.createdAt).toLocaleDateString()}
    @@ -337,16 +380,11 @@
    -
    - +
    {#if error} {error} @@ -354,10 +392,8 @@ {#if successMessage} {successMessage} {/if} - - + + @@ -711,8 +747,12 @@ } @keyframes spin { - 0% { transform: rotate(0deg); } - 100% { transform: rotate(360deg); } + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } } // Responsive adjustments @@ -736,4 +776,4 @@ } } } - \ No newline at end of file + diff --git a/src/lib/components/admin/MediaInput.svelte b/src/lib/components/admin/MediaInput.svelte index 889fca8..fc03865 100644 --- a/src/lib/components/admin/MediaInput.svelte +++ b/src/lib/components/admin/MediaInput.svelte @@ -52,40 +52,40 @@ // Computed properties const hasValue = $derived( - mode === 'single' + mode === 'single' ? value !== null && value !== undefined : Array.isArray(value) && value.length > 0 ) const displayText = $derived( - !hasValue - ? placeholder + !hasValue + ? placeholder : mode === 'single' && value && !Array.isArray(value) ? value.filename : mode === 'multiple' && Array.isArray(value) - ? value.length === 1 + ? value.length === 1 ? `${value.length} file selected` : `${value.length} files selected` : placeholder ) const selectedIds = $derived( - !hasValue + !hasValue ? [] : mode === 'single' && value && !Array.isArray(value) ? [value.id] : mode === 'multiple' && Array.isArray(value) - ? value.map(item => item.id) + ? value.map((item) => item.id) : [] ) const modalTitle = $derived( - mode === 'single' ? `Select ${fileType === 'image' ? 'Image' : 'Media'}` : `Select ${fileType === 'image' ? 'Images' : 'Media'}` + mode === 'single' + ? `Select ${fileType === 'image' ? 'Image' : 'Media'}` + : `Select ${fileType === 'image' ? 'Images' : 'Media'}` ) - const confirmText = $derived( - mode === 'single' ? 'Select' : 'Select Files' - ) + const confirmText = $derived(mode === 'single' ? 'Select' : 'Select Files')
    @@ -106,10 +106,29 @@ {value.filename} {:else}
    - - - - + + + +
    {/if} @@ -133,10 +152,29 @@ {item.filename} {:else}
    - - - - + + + +
    {/if} @@ -168,9 +206,7 @@ class:placeholder={!hasValue} />
    - + {#if hasValue}
    @@ -349,7 +385,7 @@ background: transparent; font-size: 0.875rem; color: $grey-10; - + &:focus { outline: none; } @@ -391,4 +427,4 @@ flex-wrap: wrap; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/MediaLibraryModal.svelte b/src/lib/components/admin/MediaLibraryModal.svelte index d066037..2f2ee11 100644 --- a/src/lib/components/admin/MediaLibraryModal.svelte +++ b/src/lib/components/admin/MediaLibraryModal.svelte @@ -41,7 +41,7 @@ } else { onSelect(selectedMedia) } - + handleClose() } @@ -59,8 +59,10 @@ const canConfirm = $derived(selectedMedia.length > 0) const selectionCount = $derived(selectedMedia.length) const footerText = $derived( - mode === 'single' - ? canConfirm ? '1 item selected' : 'No item selected' + mode === 'single' + ? canConfirm + ? '1 item selected' + : 'No item selected' : `${selectionCount} item${selectionCount !== 1 ? 's' : ''} selected` ) @@ -117,14 +119,8 @@ {footerText}
    - - +
    @@ -226,4 +222,4 @@ font-size: 1.25rem; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/MediaSelector.svelte b/src/lib/components/admin/MediaSelector.svelte index 2849ec5..a0400e0 100644 --- a/src/lib/components/admin/MediaSelector.svelte +++ b/src/lib/components/admin/MediaSelector.svelte @@ -12,12 +12,7 @@ loading?: boolean } - let { - mode, - fileType = 'all', - selectedIds = [], - loading = $bindable(false) - }: Props = $props() + let { mode, fileType = 'all', selectedIds = [], loading = $bindable(false) }: Props = $props() const dispatch = createEventDispatcher<{ select: Media[] @@ -37,7 +32,7 @@ // Initialize selected media from IDs $effect(() => { if (selectedIds.length > 0 && media.length > 0) { - selectedMedia = media.filter(item => selectedIds.includes(item.id)) + selectedMedia = media.filter((item) => selectedIds.includes(item.id)) dispatch('select', selectedMedia) } }) @@ -80,15 +75,15 @@ if (!auth) return let url = `/api/media?page=${page}&limit=24` - + if (filterType !== 'all') { url += `&mimeType=${filterType}` } - + if (photographyFilter !== 'all') { url += `&isPhotography=${photographyFilter}` } - + if (searchQuery) { url += `&search=${encodeURIComponent(searchQuery)}` } @@ -102,17 +97,16 @@ } const data = await response.json() - + if (page === 1) { media = data.media } else { media = [...media, ...data.media] } - + currentPage = page totalPages = data.pagination.totalPages total = data.pagination.total - } catch (error) { console.error('Error loading media:', error) } finally { @@ -125,14 +119,14 @@ selectedMedia = [item] dispatch('select', selectedMedia) } else { - const isSelected = selectedMedia.some(m => m.id === item.id) - + const isSelected = selectedMedia.some((m) => m.id === item.id) + if (isSelected) { - selectedMedia = selectedMedia.filter(m => m.id !== item.id) + selectedMedia = selectedMedia.filter((m) => m.id !== item.id) } else { selectedMedia = [...selectedMedia, item] } - + dispatch('select', selectedMedia) } } @@ -161,7 +155,7 @@ } function isSelected(item: Media): boolean { - return selectedMedia.some(m => m.id === item.id) + return selectedMedia.some((m) => m.id === item.id) } // Computed properties @@ -174,18 +168,14 @@
    - - + + - + +
    {/if} {#if isSelected(item)}
    - - + +
    {/if} @@ -280,8 +303,17 @@
    {#if item.isPhotography} - - + + Photo @@ -291,9 +323,7 @@ Alt {:else} - - No Alt - + No Alt {/if}
    @@ -310,12 +340,7 @@ {#if hasMore}
    - - + {#if tags.length > 0}
    {#each tags as tag} diff --git a/src/lib/components/admin/PhotoPostForm.svelte b/src/lib/components/admin/PhotoPostForm.svelte index 12367bb..f543a33 100644 --- a/src/lib/components/admin/PhotoPostForm.svelte +++ b/src/lib/components/admin/PhotoPostForm.svelte @@ -61,7 +61,7 @@ function handleFeaturedImageUpload(media: Media) { featuredImage = media - + // If no title is set, use the media filename as a starting point if (!title.trim() && media.originalName) { title = media.originalName.replace(/\.[^/.]+$/, '') // Remove file extension @@ -119,7 +119,12 @@ status, content: editorContent, featuredImage: featuredImage.url, - tags: tags ? tags.split(',').map(tag => tag.trim()).filter(Boolean) : [], + tags: tags + ? tags + .split(',') + .map((tag) => tag.trim()) + .filter(Boolean) + : [], excerpt: generateExcerpt(editorContent) } @@ -147,7 +152,6 @@ } else { goto('/admin/posts') } - } catch (err) { error = `Failed to ${mode === 'edit' ? 'update' : 'create'} photo post` console.error(err) @@ -159,7 +163,7 @@ function generateExcerpt(content: JSONContent): string { // Extract plain text from editor content for excerpt if (!content?.content) return '' - + let text = '' const extractText = (node: any) => { if (node.type === 'text') { @@ -168,7 +172,7 @@ node.content.forEach(extractText) } } - + content.content.forEach(extractText) return text.substring(0, 200) + (text.length > 200 ? '...' : '') } @@ -190,16 +194,22 @@

    {mode === 'edit' ? 'Edit Photo Post' : 'New Photo Post'}

    Share a photo with a caption and description

    - +
    {#if !isSaving} - - + - {/if} @@ -352,4 +362,4 @@ min-height: 200px; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/PostListItem.svelte b/src/lib/components/admin/PostListItem.svelte index c7405b4..cf7cba5 100644 --- a/src/lib/components/admin/PostListItem.svelte +++ b/src/lib/components/admin/PostListItem.svelte @@ -114,14 +114,14 @@

    {getPostSnippet(post)}

    - @@ -180,4 +180,4 @@ padding: $unit-2x; } } - \ No newline at end of file + diff --git a/src/lib/components/admin/PostMetadataPopover.svelte b/src/lib/components/admin/PostMetadataPopover.svelte index b06822a..bec23d2 100644 --- a/src/lib/components/admin/PostMetadataPopover.svelte +++ b/src/lib/components/admin/PostMetadataPopover.svelte @@ -48,13 +48,17 @@ label: 'Slug', placeholder: 'post-slug' }, - ...(postType === 'essay' ? [{ - type: 'textarea' as const, - key: 'excerpt', - label: 'Excerpt', - rows: 3, - placeholder: 'Brief description...' - }] : []), + ...(postType === 'essay' + ? [ + { + type: 'textarea' as const, + key: 'excerpt', + label: 'Excerpt', + rows: 3, + placeholder: 'Brief description...' + } + ] + : []), { type: 'tags', key: 'tags', @@ -97,7 +101,7 @@ }) - \ No newline at end of file +/> diff --git a/src/lib/components/admin/ProjectBrandingForm.svelte b/src/lib/components/admin/ProjectBrandingForm.svelte index f19212e..dbab34b 100644 --- a/src/lib/components/admin/ProjectBrandingForm.svelte +++ b/src/lib/components/admin/ProjectBrandingForm.svelte @@ -9,10 +9,10 @@ } let { formData = $bindable() }: Props = $props() - + // Convert logoUrl string to Media object for ImageUploader let logoMedia = $state(null) - + // Update logoMedia when logoUrl changes $effect(() => { if (formData.logoUrl && !logoMedia) { @@ -37,12 +37,12 @@ logoMedia = null } }) - + function handleLogoUpload(media: Media) { formData.logoUrl = media.url logoMedia = media } - + function handleLogoRemove() { formData.logoUrl = '' logoMedia = null diff --git a/src/lib/components/admin/ProjectForm.svelte b/src/lib/components/admin/ProjectForm.svelte index c10f04f..4fa1bd5 100644 --- a/src/lib/components/admin/ProjectForm.svelte +++ b/src/lib/components/admin/ProjectForm.svelte @@ -108,7 +108,6 @@ formData.caseStudyContent = content } - async function handleSave() { // Check if we're on the case study tab and should save editor content if (activeTab === 'case-study' && editorRef) { @@ -134,7 +133,6 @@ return } - const payload = { title: formData.title, subtitle: formData.subtitle, @@ -236,7 +234,11 @@ dropdownActions={[ { label: 'Save as Draft', status: 'draft' }, { label: 'List Only', status: 'list-only', show: formData.status !== 'list-only' }, - { label: 'Password Protected', status: 'password-protected', show: formData.status !== 'password-protected' } + { + label: 'Password Protected', + status: 'password-protected', + show: formData.status !== 'password-protected' + } ]} /> {/if} @@ -351,8 +353,6 @@ } } - - .tab-panels { position: relative; diff --git a/src/lib/components/admin/ProjectGalleryForm.svelte b/src/lib/components/admin/ProjectGalleryForm.svelte index deac12e..6fa40c6 100644 --- a/src/lib/components/admin/ProjectGalleryForm.svelte +++ b/src/lib/components/admin/ProjectGalleryForm.svelte @@ -8,10 +8,10 @@ } let { formData = $bindable() }: Props = $props() - + // Convert gallery array to Media objects for GalleryUploader let galleryMedia = $state([]) - + // Update galleryMedia when gallery changes $effect(() => { if (formData.gallery && Array.isArray(formData.gallery)) { @@ -44,13 +44,13 @@ galleryMedia = [] } }) - + function handleGalleryUpload(media: Media[]) { // Store as Media objects in the gallery field formData.gallery = media galleryMedia = media } - + function handleGalleryReorder(media: Media[]) { formData.gallery = media galleryMedia = media @@ -59,7 +59,7 @@

    Project Gallery

    - + \ No newline at end of file + diff --git a/src/lib/components/admin/ProjectListItem.svelte b/src/lib/components/admin/ProjectListItem.svelte index 0dae8a2..86495c5 100644 --- a/src/lib/components/admin/ProjectListItem.svelte +++ b/src/lib/components/admin/ProjectListItem.svelte @@ -39,19 +39,19 @@ const diffInSeconds = Math.floor((now.getTime() - date.getTime()) / 1000) if (diffInSeconds < 60) return 'just now' - + const minutes = Math.floor(diffInSeconds / 60) if (diffInSeconds < 3600) return `${minutes} ${minutes === 1 ? 'minute' : 'minutes'} ago` - + const hours = Math.floor(diffInSeconds / 3600) if (diffInSeconds < 86400) return `${hours} ${hours === 1 ? 'hour' : 'hours'} ago` - + const days = Math.floor(diffInSeconds / 86400) if (diffInSeconds < 2592000) return `${days} ${days === 1 ? 'day' : 'days'} ago` - + const months = Math.floor(diffInSeconds / 2592000) if (diffInSeconds < 31536000) return `${months} ${months === 1 ? 'month' : 'months'} ago` - + const years = Math.floor(diffInSeconds / 31536000) return `${years} ${years === 1 ? 'year' : 'years'} ago` } @@ -81,11 +81,10 @@ function handleCloseDropdowns() { isDropdownOpen = false } - + document.addEventListener('closeDropdowns', handleCloseDropdowns) return () => document.removeEventListener('closeDropdowns', handleCloseDropdowns) }) -

    {project.title}

    -
    - - + {#if isDropdownOpen} {#each availableActions as action} @@ -115,4 +113,4 @@ display: flex; gap: $unit-half; } - \ No newline at end of file + diff --git a/src/lib/components/edra/extensions/FindAndReplace.ts b/src/lib/components/edra/extensions/FindAndReplace.ts index 61db64e..b4a1e62 100644 --- a/src/lib/components/edra/extensions/FindAndReplace.ts +++ b/src/lib/components/edra/extensions/FindAndReplace.ts @@ -22,8 +22,7 @@ import { Extension, type Range, type Dispatch } from '@tiptap/core' import { Decoration, DecorationSet } from '@tiptap/pm/view' -import { Plugin, PluginKey, type EditorState, type Transaction } from '@tiptap/pm/state' -import { Node as PMNode } from '@tiptap/pm/model' +import { Plugin, PluginKey } from '@tiptap/pm/state' declare module '@tiptap/core' { interface Commands { diff --git a/src/lib/components/edra/extensions/gallery/GalleryExtended.ts b/src/lib/components/edra/extensions/gallery/GalleryExtended.ts index 75f8903..ec10883 100644 --- a/src/lib/components/edra/extensions/gallery/GalleryExtended.ts +++ b/src/lib/components/edra/extensions/gallery/GalleryExtended.ts @@ -13,15 +13,19 @@ declare module '@tiptap/core' { /** * Insert a gallery */ - setGallery: (options: { images: Array<{ id: number; url: string; alt?: string; title?: string }> }) => ReturnType + setGallery: (options: { + images: Array<{ id: number; url: string; alt?: string; title?: string }> + }) => ReturnType } } } -export const GalleryExtended = (component: Component): Node => { +export const GalleryExtended = ( + component: Component +): Node => { return Node.create({ name: 'gallery', - + addOptions() { return { HTMLAttributes: {} @@ -46,15 +50,16 @@ export const GalleryExtended = (component: Component): Node): Node ({ commands }) => { - return commands.insertContent({ - type: this.name, - attrs: { - images: options.images - } - }) - } + setGallery: + (options) => + ({ commands }) => { + return commands.insertContent({ + type: this.name, + attrs: { + images: options.images + } + }) + } } } }) -} \ No newline at end of file +} diff --git a/src/lib/components/edra/extensions/gallery/GalleryPlaceholder.ts b/src/lib/components/edra/extensions/gallery/GalleryPlaceholder.ts index 4ebc86f..262f064 100644 --- a/src/lib/components/edra/extensions/gallery/GalleryPlaceholder.ts +++ b/src/lib/components/edra/extensions/gallery/GalleryPlaceholder.ts @@ -54,4 +54,4 @@ export const GalleryPlaceholder = ( } } } - }) \ No newline at end of file + }) diff --git a/src/lib/components/edra/extensions/table/utils.ts b/src/lib/components/edra/extensions/table/utils.ts index 9ae4811..892cc79 100644 --- a/src/lib/components/edra/extensions/table/utils.ts +++ b/src/lib/components/edra/extensions/table/utils.ts @@ -1,7 +1,5 @@ import { Editor, findParentNode } from '@tiptap/core' -import { EditorState, Selection, Transaction } from '@tiptap/pm/state' import { CellSelection, type Rect, TableMap } from '@tiptap/pm/tables' -import { Node, ResolvedPos } from '@tiptap/pm/model' import type { EditorView } from '@tiptap/pm/view' import Table from './table.js' diff --git a/src/lib/components/edra/headless/components/GalleryExtended.svelte b/src/lib/components/edra/headless/components/GalleryExtended.svelte index 7b71a31..ad63ad8 100644 --- a/src/lib/components/edra/headless/components/GalleryExtended.svelte +++ b/src/lib/components/edra/headless/components/GalleryExtended.svelte @@ -26,7 +26,7 @@ function handleMediaSelect(media: Media | Media[]) { const mediaArray = Array.isArray(media) ? media : [media] - const newImages = mediaArray.map(m => ({ + const newImages = mediaArray.map((m) => ({ id: m.id, url: m.url, alt: m.altText || '', @@ -40,7 +40,7 @@ // Add to existing images const existingImages = node.attrs.images || [] const currentIds = existingImages.map((img: any) => img.id) - const uniqueNewImages = newImages.filter(img => !currentIds.includes(img.id)) + const uniqueNewImages = newImages.filter((img) => !currentIds.includes(img.id)) updateAttributes({ images: [...existingImages, ...uniqueNewImages] }) } @@ -87,12 +87,7 @@
    {#each images as image}
    - {image.alt} + {image.alt} {#if editor?.isEditable}
    - +
    - + - + - - + + - + - - + +
    @@ -102,23 +98,11 @@

    Input Sizes

    - - - - - + + + + +
    @@ -129,46 +113,49 @@ label="Input with Error" placeholder="Try typing something" bind:value={withErrorValue} - error={withErrorValue.length > 0 && withErrorValue.length < 3 ? "Too short! Minimum 3 characters" : ""} - /> - - - - 0 && withErrorValue.length < 3 + ? 'Too short! Minimum 3 characters' + : ''} /> + + + +

    Input with Icons

    - + - - + + - - + + - - + +
    @@ -184,7 +171,7 @@ showCharCount helpText="Keep it brief" /> - +

    Form Example

    - - + + - + - +
    @@ -271,4 +254,4 @@ justify-content: flex-end; margin-top: $unit-2x; } - \ No newline at end of file + diff --git a/src/routes/admin/media-library-test/+page.svelte b/src/routes/admin/media-library-test/+page.svelte index f4d8aca..a38ccb1 100644 --- a/src/routes/admin/media-library-test/+page.svelte +++ b/src/routes/admin/media-library-test/+page.svelte @@ -41,10 +41,8 @@

    Single Selection Mode

    Test selecting a single media item.

    - - + + {#if selectedSingleMedia}
    @@ -58,7 +56,10 @@

    Size: {formatFileSize(selectedSingleMedia.size)}

    Type: {selectedSingleMedia.mimeType}

    {#if selectedSingleMedia.width && selectedSingleMedia.height} -

    Dimensions: {selectedSingleMedia.width}×{selectedSingleMedia.height}

    +

    + Dimensions: + {selectedSingleMedia.width}×{selectedSingleMedia.height} +

    {/if}
    @@ -69,10 +70,8 @@

    Multiple Selection Mode

    Test selecting multiple media items.

    - - + + {#if selectedMultipleMedia.length > 0}
    @@ -97,11 +96,14 @@

    Image Only Selection

    Test selecting only image files.

    - -
    @@ -253,4 +255,4 @@ } } } - \ No newline at end of file + diff --git a/src/routes/admin/media/upload/+page.svelte b/src/routes/admin/media/upload/+page.svelte index 3b8958a..32514b9 100644 --- a/src/routes/admin/media/upload/+page.svelte +++ b/src/routes/admin/media/upload/+page.svelte @@ -34,7 +34,7 @@ function handleDrop(event: DragEvent) { event.preventDefault() dragActive = false - + const droppedFiles = Array.from(event.dataTransfer?.files || []) addFiles(droppedFiles) } @@ -47,10 +47,13 @@ function addFiles(newFiles: File[]) { // Filter for image files - const imageFiles = newFiles.filter(file => file.type.startsWith('image/')) - + const imageFiles = newFiles.filter((file) => file.type.startsWith('image/')) + if (imageFiles.length !== newFiles.length) { - uploadErrors = [...uploadErrors, `${newFiles.length - imageFiles.length} non-image files were skipped`] + uploadErrors = [ + ...uploadErrors, + `${newFiles.length - imageFiles.length} non-image files were skipped` + ] } files = [...files, ...imageFiles] @@ -98,7 +101,7 @@ const response = await fetch('/api/media/upload', { method: 'POST', headers: { - 'Authorization': `Basic ${auth}` + Authorization: `Basic ${auth}` }, body: formData }) @@ -145,8 +148,8 @@
    -
    0} ondragover={handleDragOver} @@ -156,12 +159,54 @@
    {#if files.length === 0}
    - - - - - - + + + + + +

    Drop images here

    @@ -174,7 +219,7 @@
    {/if}
    - + - - -
    - +
    {file.name}
    {formatFileSize(file.size)}
    - + {#if uploadProgress[file.name]}
    {/if}
    - + {#if !isUploading} -
    @@ -373,7 +371,6 @@ } } - .btn { padding: $unit-2x $unit-3x; border: none; diff --git a/src/routes/admin/posts/new/+page.svelte b/src/routes/admin/posts/new/+page.svelte index 2feb618..0819280 100644 --- a/src/routes/admin/posts/new/+page.svelte +++ b/src/routes/admin/posts/new/+page.svelte @@ -114,8 +114,6 @@ } } - - // Mock post object for metadata popover const mockPost = $derived({ id: null, @@ -171,7 +169,7 @@ onAddTag={addTag} onRemoveTag={removeTag} onDelete={() => {}} - onClose={() => showMetadata = false} + onClose={() => (showMetadata = false)} /> {/if}
    @@ -252,7 +250,6 @@ } } - .btn { padding: $unit-2x $unit-3x; border: none; diff --git a/src/routes/admin/projects/+page.svelte b/src/routes/admin/projects/+page.svelte index c48ace0..082bcd0 100644 --- a/src/routes/admin/projects/+page.svelte +++ b/src/routes/admin/projects/+page.svelte @@ -233,7 +233,8 @@ {#if selectedStatusFilter === 'all' && selectedTypeFilter === 'all'} No projects found. Create your first project! {:else} - No projects found matching the current filters. Try adjusting your filters or create a new project. + No projects found matching the current filters. Try adjusting your filters or create a + new project. {/if}

    @@ -263,8 +264,6 @@ /> \ No newline at end of file + diff --git a/src/routes/labs/[slug]/+page.ts b/src/routes/labs/[slug]/+page.ts index 9ab9255..9d74553 100644 --- a/src/routes/labs/[slug]/+page.ts +++ b/src/routes/labs/[slug]/+page.ts @@ -4,7 +4,9 @@ import type { Project } from '$lib/types/project' export const load: PageLoad = async ({ params, fetch }) => { try { // Find project by slug - we'll fetch all published, list-only, and password-protected projects - const response = await fetch(`/api/projects?projectType=labs&includeListOnly=true&includePasswordProtected=true`) + const response = await fetch( + `/api/projects?projectType=labs&includeListOnly=true&includePasswordProtected=true` + ) if (!response.ok) { throw new Error('Failed to fetch projects') } @@ -31,4 +33,4 @@ export const load: PageLoad = async ({ params, fetch }) => { error: error instanceof Error ? error.message : 'Failed to load project' } } -} \ No newline at end of file +} diff --git a/src/routes/photos/+page.ts b/src/routes/photos/+page.ts index 2d8e0c7..c5fa813 100644 --- a/src/routes/photos/+page.ts +++ b/src/routes/photos/+page.ts @@ -6,7 +6,7 @@ export const load: PageLoad = async ({ fetch }) => { if (!response.ok) { throw new Error('Failed to fetch photos') } - + const data = await response.json() return { photoItems: data.photoItems || [], @@ -14,7 +14,7 @@ export const load: PageLoad = async ({ fetch }) => { } } catch (error) { console.error('Error loading photos:', error) - + // Fallback to empty array if API fails return { photoItems: [], @@ -22,4 +22,4 @@ export const load: PageLoad = async ({ fetch }) => { error: 'Failed to load photos' } } -} \ No newline at end of file +} diff --git a/src/routes/photos/[albumSlug]/[photoId]/+page.svelte b/src/routes/photos/[albumSlug]/[photoId]/+page.svelte index d47b62e..ad0d194 100644 --- a/src/routes/photos/[albumSlug]/[photoId]/+page.svelte +++ b/src/routes/photos/[albumSlug]/[photoId]/+page.svelte @@ -19,7 +19,7 @@ const formatExif = (exifData: any) => { if (!exifData) return null - + const formatSpeed = (speed: string) => { if (speed?.includes('/')) return speed if (speed?.includes('s')) return speed @@ -34,7 +34,9 @@ exifData.aperture, formatSpeed(exifData.shutterSpeed), exifData.iso ? `ISO ${exifData.iso}` : null - ].filter(Boolean).join(' • '), + ] + .filter(Boolean) + .join(' • '), location: exifData.location, dateTaken: exifData.dateTaken } @@ -45,15 +47,28 @@ {#if photo && album} - {photo.title || photo.caption || `Photo ${navigation?.currentIndex}`} - {album.title} - - + {photo.title || photo.caption || `Photo ${navigation?.currentIndex}`} - {album.title} + + - - + + - + {#if exif?.dateTaken} @@ -68,7 +83,7 @@

    Photo Not Found

    -

    {error || 'The photo you\'re looking for doesn\'t exist.'}

    +

    {error || "The photo you're looking for doesn't exist."}

    ← Back to Photos
    @@ -88,14 +103,26 @@ {#if navigation.prevPhoto} {:else}
    - + Previous
    @@ -105,14 +132,26 @@ {:else}
    Next - +
    {/if} @@ -122,8 +161,8 @@
    - {photo.caption

    Photo Details

    - + {#if exif.camera}
    Camera @@ -240,17 +279,17 @@ .photo-page { min-height: 100vh; display: grid; - grid-template-areas: - "header header" - "main details"; + grid-template-areas: + 'header header' + 'main details'; grid-template-columns: 1fr 400px; grid-template-rows: auto 1fr; @include breakpoint('tablet') { - grid-template-areas: - "header" - "main" - "details"; + grid-template-areas: + 'header' + 'main' + 'details'; grid-template-columns: 1fr; grid-template-rows: auto 1fr auto; } @@ -468,4 +507,4 @@ color: $grey-20; } } - \ No newline at end of file + diff --git a/src/routes/photos/[albumSlug]/[photoId]/+page.ts b/src/routes/photos/[albumSlug]/[photoId]/+page.ts index 24d9f7d..e22c5c2 100644 --- a/src/routes/photos/[albumSlug]/[photoId]/+page.ts +++ b/src/routes/photos/[albumSlug]/[photoId]/+page.ts @@ -3,7 +3,7 @@ import type { PageLoad } from './$types' export const load: PageLoad = async ({ params, fetch }) => { try { const response = await fetch(`/api/photos/${params.albumSlug}/${params.photoId}`) - + if (!response.ok) { if (response.status === 404) { throw new Error('Photo not found') @@ -27,4 +27,4 @@ export const load: PageLoad = async ({ params, fetch }) => { error: error instanceof Error ? error.message : 'Failed to load photo' } } -} \ No newline at end of file +} diff --git a/src/routes/photos/[slug]/+page.svelte b/src/routes/photos/[slug]/+page.svelte index 6bb9a2b..95dd9d3 100644 --- a/src/routes/photos/[slug]/+page.svelte +++ b/src/routes/photos/[slug]/+page.svelte @@ -8,14 +8,16 @@ const error = $derived(data.error) // Transform album data to PhotoItem format for PhotoGrid - const photoItems = $derived(album?.photos?.map((photo: any) => ({ - id: `photo-${photo.id}`, - src: photo.url, - alt: photo.caption || photo.filename, - caption: photo.caption, - width: photo.width || 400, - height: photo.height || 400 - })) ?? []) + const photoItems = $derived( + album?.photos?.map((photo: any) => ({ + id: `photo-${photo.id}`, + src: photo.url, + alt: photo.caption || photo.filename, + caption: photo.caption, + width: photo.width || 400, + height: photo.height || 400 + })) ?? [] + ) const formatDate = (dateString: string) => { const date = new Date(dateString) @@ -56,11 +58,11 @@

    {album.title}

    - + {#if album.description}

    {album.description}

    {/if} - +
    {#if album.date} 📅 {formatDate(album.date)} @@ -68,13 +70,15 @@ {#if album.location} 📍 {album.location} {/if} - 📷 {album.photos?.length || 0} photo{(album.photos?.length || 0) !== 1 ? 's' : ''} + 📷 {album.photos?.length || 0} photo{(album.photos?.length || 0) !== 1 ? 's' : ''}
    {#if photoItems.length > 0} - + {:else}

    This album doesn't contain any photos yet.

    @@ -220,4 +224,4 @@ padding: $unit-6x $unit-3x; color: $grey-40; } - \ No newline at end of file + diff --git a/src/routes/photos/[slug]/+page.ts b/src/routes/photos/[slug]/+page.ts index ec3b160..e3ef1b1 100644 --- a/src/routes/photos/[slug]/+page.ts +++ b/src/routes/photos/[slug]/+page.ts @@ -28,4 +28,4 @@ export const load: PageLoad = async ({ params, fetch }) => { error: error instanceof Error ? error.message : 'Failed to load album' } } -} \ No newline at end of file +} diff --git a/src/routes/rss/+server.ts b/src/routes/rss/+server.ts index e1210a4..190b379 100644 --- a/src/routes/rss/+server.ts +++ b/src/routes/rss/+server.ts @@ -16,7 +16,7 @@ function escapeXML(str: string): string { // Helper function to convert content to HTML for full content function convertContentToHTML(content: any): string { if (!content || !content.blocks) return '' - + return content.blocks .map((block: any) => { switch (block.type) { @@ -26,7 +26,9 @@ function convertContentToHTML(content: any): string { const level = block.level || 2 return `${escapeXML(block.content || '')}` case 'list': - const items = (block.content || []).map((item: any) => `
  • ${escapeXML(item)}
    • `).join('') + const items = (block.content || []) + .map((item: any) => `
  • ${escapeXML(item)}
    • `) + .join('') return block.listType === 'ordered' ? `
      ${items}
    ` : `
      ${items}
    ` default: return `

    ${escapeXML(block.content || '')}

    ` @@ -38,12 +40,12 @@ function convertContentToHTML(content: any): string { // Helper function to extract text summary from content function extractTextSummary(content: any, maxLength: number = 300): string { if (!content || !content.blocks) return '' - + const text = content.blocks .filter((block: any) => block.type === 'paragraph' && block.content) .map((block: any) => block.content) .join(' ') - + return text.length > maxLength ? text.substring(0, maxLength) + '...' : text } @@ -56,7 +58,7 @@ export const GET: RequestHandler = async (event) => { try { // Get published posts from Universe const posts = await prisma.post.findMany({ - where: { + where: { status: 'published', publishedAt: { not: null } }, @@ -103,7 +105,7 @@ export const GET: RequestHandler = async (event) => { take: 1 // Get first photo for cover image }, _count: { - select: { + select: { photos: { where: { status: 'published', @@ -119,11 +121,12 @@ export const GET: RequestHandler = async (event) => { // Combine all content types const items = [ - ...posts.map(post => ({ + ...posts.map((post) => ({ type: 'post', section: 'universe', id: post.id.toString(), - title: post.title || `${post.postType.charAt(0).toUpperCase() + post.postType.slice(1)} Post`, + title: + post.title || `${post.postType.charAt(0).toUpperCase() + post.postType.slice(1)} Post`, description: post.excerpt || extractTextSummary(post.content) || '', content: convertContentToHTML(post.content), link: `${event.url.origin}/universe/${post.slug}`, @@ -133,12 +136,14 @@ export const GET: RequestHandler = async (event) => { postType: post.postType, linkUrl: post.linkUrl || null })), - ...universeAlbums.map(album => ({ + ...universeAlbums.map((album) => ({ type: 'album', section: 'universe', id: album.id.toString(), title: album.title, - description: album.description || `Photo album with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, + description: + album.description || + `Photo album with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, content: album.description ? `

    ${escapeXML(album.description)}

    ` : '', link: `${event.url.origin}/photos/${album.slug}`, guid: `${event.url.origin}/photos/${album.slug}`, @@ -149,13 +154,15 @@ export const GET: RequestHandler = async (event) => { location: album.location })), ...photoAlbums - .filter(album => !universeAlbums.some(ua => ua.id === album.id)) // Avoid duplicates - .map(album => ({ + .filter((album) => !universeAlbums.some((ua) => ua.id === album.id)) // Avoid duplicates + .map((album) => ({ type: 'album', section: 'photos', id: album.id.toString(), title: album.title, - description: album.description || `Photography album${album.location ? ` from ${album.location}` : ''} with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, + description: + album.description || + `Photography album${album.location ? ` from ${album.location}` : ''} with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, content: album.description ? `

    ${escapeXML(album.description)}

    ` : '', link: `${event.url.origin}/photos/${album.slug}`, guid: `${event.url.origin}/photos/${album.slug}`, @@ -170,7 +177,7 @@ export const GET: RequestHandler = async (event) => { const now = new Date() const lastBuildDate = formatRFC822Date(now) - + // Build RSS XML following best practices const rssXml = ` @@ -186,7 +193,9 @@ export const GET: RequestHandler = async (event) => { SvelteKit RSS Generator https://cyber.harvard.edu/rss/rss.html 60 -${items.map(item => ` +${items + .map( + (item) => ` ${escapeXML(item.title)} @@ -198,13 +207,19 @@ ${item.updatedDate ? `${new Date(item.updatedDate).toISOString()}< ${item.section} ${item.type === 'post' ? item.postType : 'album'} ${item.type === 'post' && item.linkUrl ? `${item.linkUrl}` : ''} -${item.type === 'album' && item.coverPhoto ? ` +${ + item.type === 'album' && item.coverPhoto + ? ` -` : ''} +` + : '' +} ${item.location ? `${escapeXML(item.location)}` : ''} noreply@jedmund.com (Justin Edmund) -`).join('')} +` + ) + .join('')} ` @@ -215,13 +230,13 @@ ${item.location ? `${escapeXML(item.location)} { take: 1 // Get first photo for cover image }, _count: { - select: { + select: { photos: { where: { status: 'published', @@ -63,30 +63,36 @@ export const GET: RequestHandler = async (event) => { // Combine albums and standalone photos const items = [ - ...albums.map(album => ({ + ...albums.map((album) => ({ type: 'album', id: album.id.toString(), title: album.title, - description: album.description || `Photography album${album.location ? ` from ${album.location}` : ''} with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, - content: album.description ? `

    ${escapeXML(album.description)}

    ` : '', + description: + album.description || + `Photography album${album.location ? ` from ${album.location}` : ''} with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, + content: album.description ? `

    ${escapeXML(album.description)}

    ` : '', link: `${event.url.origin}/photos/${album.slug}`, pubDate: album.createdAt, - updatedDate: album.updatedAt, + updatedDate: album.updatedAt, guid: `${event.url.origin}/photos/${album.slug}`, photoCount: album._count.photos, coverPhoto: album.photos[0], location: album.location, date: album.date })), - ...standalonePhotos.map(photo => ({ + ...standalonePhotos.map((photo) => ({ type: 'photo', id: photo.id.toString(), title: photo.title || photo.filename, description: photo.description || photo.caption || `Photo: ${photo.filename}`, - content: photo.description ? `

    ${escapeXML(photo.description)}

    ` : (photo.caption ? `

    ${escapeXML(photo.caption)}

    ` : ''), + content: photo.description + ? `

    ${escapeXML(photo.description)}

    ` + : photo.caption + ? `

    ${escapeXML(photo.caption)}

    ` + : '', link: `${event.url.origin}/photos/photo/${photo.slug || photo.id}`, pubDate: photo.publishedAt || photo.createdAt, - updatedDate: photo.updatedAt, + updatedDate: photo.updatedAt, guid: `${event.url.origin}/photos/photo/${photo.slug || photo.id}`, url: photo.url, thumbnailUrl: photo.thumbnailUrl @@ -95,7 +101,7 @@ export const GET: RequestHandler = async (event) => { const now = new Date() const lastBuildDate = formatRFC822Date(now) - + // Build RSS XML following best practices const rssXml = ` @@ -111,7 +117,9 @@ export const GET: RequestHandler = async (event) => { SvelteKit RSS Generator https://cyber.harvard.edu/rss/rss.html 60 -${items.map(item => ` +${items + .map( + (item) => ` ${escapeXML(item.title)} @@ -121,17 +129,27 @@ ${item.content ? ` ${formatRFC822Date(new Date(item.pubDate))} ${item.updatedDate ? `${new Date(item.updatedDate).toISOString()}` : ''} ${item.type} -${item.type === 'album' && item.coverPhoto ? ` +${ + item.type === 'album' && item.coverPhoto + ? ` -` : ''} -${item.type === 'photo' ? ` +` + : '' +} +${ + item.type === 'photo' + ? ` -` : ''} +` + : '' +} ${item.location ? `${escapeXML(item.location)}` : ''} noreply@jedmund.com (Justin Edmund) -`).join('')} +` + ) + .join('')} ` @@ -142,13 +160,13 @@ ${item.location ? `${escapeXML(item.location)} { switch (block.type) { @@ -26,7 +26,9 @@ function convertContentToHTML(content: any): string { const level = block.level || 2 return `${escapeXML(block.content || '')}` case 'list': - const items = (block.content || []).map((item: any) => `
  • ${escapeXML(item)}
    • `).join('') + const items = (block.content || []) + .map((item: any) => `
  • ${escapeXML(item)}
    • `) + .join('') return block.listType === 'ordered' ? `
      ${items}
    ` : `
      ${items}
    ` default: return `

    ${escapeXML(block.content || '')}

    ` @@ -38,12 +40,12 @@ function convertContentToHTML(content: any): string { // Helper function to extract text summary from content function extractTextSummary(content: any, maxLength: number = 300): string { if (!content || !content.blocks) return '' - + const text = content.blocks .filter((block: any) => block.type === 'paragraph' && block.content) .map((block: any) => block.content) .join(' ') - + return text.length > maxLength ? text.substring(0, maxLength) + '...' : text } @@ -56,7 +58,7 @@ export const GET: RequestHandler = async (event) => { try { // Get published posts from Universe const posts = await prisma.post.findMany({ - where: { + where: { status: 'published', publishedAt: { not: null } }, @@ -81,10 +83,11 @@ export const GET: RequestHandler = async (event) => { // Combine and sort by date const items = [ - ...posts.map(post => ({ + ...posts.map((post) => ({ type: 'post', id: post.id.toString(), - title: post.title || `${post.postType.charAt(0).toUpperCase() + post.postType.slice(1)} Post`, + title: + post.title || `${post.postType.charAt(0).toUpperCase() + post.postType.slice(1)} Post`, description: post.excerpt || extractTextSummary(post.content) || '', content: convertContentToHTML(post.content), link: `${event.url.origin}/universe/${post.slug}`, @@ -94,11 +97,13 @@ export const GET: RequestHandler = async (event) => { postType: post.postType, linkUrl: post.linkUrl || null })), - ...albums.map(album => ({ + ...albums.map((album) => ({ type: 'album', id: album.id.toString(), title: album.title, - description: album.description || `Photo album with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, + description: + album.description || + `Photo album with ${album._count.photos} photo${album._count.photos !== 1 ? 's' : ''}`, content: album.description ? `

    ${escapeXML(album.description)}

    ` : '', link: `${event.url.origin}/photos/${album.slug}`, guid: `${event.url.origin}/photos/${album.slug}`, @@ -110,7 +115,7 @@ export const GET: RequestHandler = async (event) => { const now = new Date() const lastBuildDate = formatRFC822Date(now) - + // Build RSS XML following best practices const rssXml = ` @@ -126,7 +131,9 @@ export const GET: RequestHandler = async (event) => { SvelteKit RSS Generator https://cyber.harvard.edu/rss/rss.html 60 -${items.map(item => ` +${items + .map( + (item) => ` ${escapeXML(item.title)} @@ -138,7 +145,9 @@ ${item.updatedDate ? `${new Date(item.updatedDate).toISOString()}< ${item.type === 'post' ? item.postType : 'album'} ${item.type === 'post' && item.linkUrl ? `${item.linkUrl}` : ''} noreply@jedmund.com (Justin Edmund) -`).join('')} +` + ) + .join('')} ` @@ -149,13 +158,13 @@ ${item.type === 'post' && item.linkUrl ? `${item.linkUrl}` 'Content-Type': 'application/rss+xml; charset=utf-8', 'Cache-Control': 'public, max-age=3600, stale-while-revalidate=86400', 'Last-Modified': lastBuildDate, - 'ETag': `"${Buffer.from(rssXml).toString('base64').slice(0, 16)}"`, + ETag: `"${Buffer.from(rssXml).toString('base64').slice(0, 16)}"`, 'X-Content-Type-Options': 'nosniff', - 'Vary': 'Accept-Encoding' + Vary: 'Accept-Encoding' } }) } catch (error) { logger.error('Failed to generate Universe RSS feed', error as Error) return new Response('Failed to generate RSS feed', { status: 500 }) } -} \ No newline at end of file +} diff --git a/src/routes/universe/+page.server.ts b/src/routes/universe/+page.server.ts index d2f2695..0f75f1e 100644 --- a/src/routes/universe/+page.server.ts +++ b/src/routes/universe/+page.server.ts @@ -6,7 +6,7 @@ export const load: PageServerLoad = async ({ fetch }) => { if (!response.ok) { throw new Error('Failed to fetch universe feed') } - + const data = await response.json() return { universeItems: data.items || [], diff --git a/src/routes/universe/[slug]/+page.server.ts b/src/routes/universe/[slug]/+page.server.ts index 3ef2f47..63d2f5f 100644 --- a/src/routes/universe/[slug]/+page.server.ts +++ b/src/routes/universe/[slug]/+page.server.ts @@ -4,7 +4,7 @@ export const load: PageServerLoad = async ({ params, fetch }) => { try { // Fetch the specific post by slug from the database const response = await fetch(`/api/posts/by-slug/${params.slug}`) - + if (!response.ok) { if (response.status === 404) { return { diff --git a/src/routes/universe/[slug]/+page.svelte b/src/routes/universe/[slug]/+page.svelte index e0ed2fa..4afddbe 100644 --- a/src/routes/universe/[slug]/+page.svelte +++ b/src/routes/universe/[slug]/+page.svelte @@ -13,16 +13,22 @@ {#if post} {pageTitle} - jedmund - - + + - + {#if post.attachments && post.attachments.length > 0} {/if} - + @@ -36,7 +42,7 @@

    Post Not Found

    -

    {error || 'The post you\'re looking for doesn\'t exist.'}

    +

    {error || "The post you're looking for doesn't exist."}

    ← Back to Universe
    diff --git a/src/routes/work/[slug]/+page.svelte b/src/routes/work/[slug]/+page.svelte index 4dc256d..b3ba711 100644 --- a/src/routes/work/[slug]/+page.svelte +++ b/src/routes/work/[slug]/+page.svelte @@ -37,11 +37,18 @@ {:else if project.status === 'password-protected'} - + {#snippet children()}
    {#if project.logoUrl} -