create-atsdc-stack 1.0.1 → 1.2.0

package/app/drizzle.config.ts

@@ -1,16 +1,16 @@
-import type { Config } from 'drizzle-kit';
-
-if (!process.env.DATABASE_URL) {
-    throw new Error('DATABASE_URL environment variable is required');
-}
-
-export default {
-    schema: './src/db/schema.ts',
-    out: './drizzle',
-    dialect: 'postgresql',
-    dbCredentials: {
-        url: process.env.DATABASE_URL,
-    },
-    verbose: true,
-    strict: true,
-} satisfies Config;
+import type { Config } from 'drizzle-kit';
+
+if (!process.env.DATABASE_URL) {
+    throw new Error('DATABASE_URL environment variable is required');
+}
+
+export default {
+    schema: './src/db/schema.ts',
+    out: './drizzle',
+    dialect: 'postgresql',
+    dbCredentials: {
+        url: process.env.DATABASE_URL,
+    },
+    verbose: true,
+    strict: true,
+} satisfies Config;

package/app/package.json

@@ -1,52 +1,66 @@
-{
-    "name": "atsdc-app",
-    "version": "1.0.0",
-    "description": "ATSDC Stack - Astro application",
-    "type": "module",
-    "scripts": {
-        "dev": "astro dev",
-        "build": "astro check && astro build",
-        "preview": "astro preview",
-        "astro": "astro",
-        "db:generate": "drizzle-kit generate",
-        "db:migrate": "drizzle-kit migrate",
-        "db:push": "drizzle-kit push",
-        "db:studio": "drizzle-kit studio"
-    },
-    "dependencies": {
-        "@astrojs/check": "^0.9.6",
-        "@astrojs/react": "^4.4.2",
-        "@astrojs/vercel": "^9.0.2",
-        "@clerk/astro": "^1.4.3",
-        "@clerk/clerk-react": "^5.17.3",
-        "@rocicorp/zero": "^0.2.0",
-        "@vercel/postgres": "^0.10.0",
-        "ai": "^5.0.0",
-        "astro": "^5.16.6",
-        "cheerio": "^1.0.0",
-        "drizzle-orm": "^0.36.4",
-        "exa-js": "^1.1.1",
-        "marked": "^14.1.3",
-        "nanoid": "^5.0.9",
-        "open-props": "^1.7.17",
-        "react": "^18.3.1",
-        "react-dom": "^18.3.1",
-        "sass": "^1.82.0",
-        "turndown": "^7.2.0",
-        "typescript": "^5.7.2",
-        "zod": "^3.24.1"
-    },
-    "devDependencies": {
-        "@types/node": "^22.10.5",
-        "@types/react": "^18.3.18",
-        "@types/react-dom": "^18.3.5",
-        "@types/turndown": "^5.0.5",
-        "@vite-pwa/assets-generator": "^0.2.6",
-        "drizzle-kit": "^0.29.1",
-        "vercel": "^39.2.0",
-        "vite-plugin-pwa": "^0.21.2"
-    },
-    "engines": {
-        "node": ">=18.0.0"
-    }
-}
+{
+    "name": "atsdc-app",
+    "version": "1.0.0",
+    "description": "ATSDC Stack - Astro application",
+    "type": "module",
+    "scripts": {
+        "dev": "astro dev",
+        "build": "astro check && astro build",
+        "preview": "astro preview",
+        "astro": "astro",
+        "ts": "node --experimental-strip-types",
+        "test:chrome": "npx playwright test --headed --browser=chromium",
+        "test:firefox": "npx playwright test --headed --browser=firefox",
+        "test:safari": "npx playwright test --headed --browser=webkit",
+        "test": "npm run test:chrome && npm run test:firefox && npm run test:safari",
+        "test:nopause:chrome": "npx playwright test tests/browser.test.nopause.ts --browser=chromium",
+        "test:nopause:firefox": "npx playwright test tests/browser.test.nopause.ts --browser=firefox",
+        "test:nopause:safari": "npx playwright test tests/browser.test.nopause.ts --browser=webkit",
+        "test:nopause": "npm run test:nopause:chrome && npm run test:nopause:firefox && npm run test:nopause:safari",
+        "test:nopause:chrome:headed": "npx playwright test tests/browser.test.nopause.ts --headed --browser=chromium",
+        "test:nopause:firefox:headed": "npx playwright test tests/browser.test.nopause.ts --headed --browser=firefox",
+        "test:nopause:safari:headed": "npx playwright test tests/browser.test.nopause.ts --headed --browser=webkit",
+        "check": "astro check && stylelint \"src/**/*.scss\" && astro build",
+        "stylelint:fix": "stylelint \"src/**/*.scss\" --fix"
+    },
+    "dependencies": {
+        "@astrojs/check": "^0.9.6",
+        "@astrojs/react": "^4.4.2",
+        "@astrojs/vercel": "^9.0.2",
+        "@clerk/astro": "^1.4.3",
+        "@clerk/clerk-react": "^5.17.3",
+        "@rocicorp/zero": "^0.2.0",
+        "@vercel/postgres": "^0.10.0",
+        "ai": "^5.0.0",
+        "astro": "^5.16.6",
+        "cheerio": "^1.0.0",
+        "drizzle-orm": "^0.36.4",
+        "exa-js": "^1.1.1",
+        "marked": "^14.1.3",
+        "nanoid": "^5.0.9",
+        "open-props": "^1.7.17",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
+        "sass": "^1.82.0",
+        "turndown": "^7.2.0",
+        "typescript": "^5.7.2",
+        "zod": "^3.24.1"
+    },
+    "devDependencies": {
+        "@playwright/test": "^1.58.2",
+        "@types/node": "^22.10.5",
+        "@types/react": "^18.3.18",
+        "@types/react-dom": "^18.3.5",
+        "@types/turndown": "^5.0.5",
+        "@vite-pwa/assets-generator": "^0.2.6",
+        "dotenv": "^16.6.1",
+        "drizzle-kit": "^0.29.1",
+        "stylelint": "^16.26.1",
+        "stylelint-config-standard-scss": "^14.0.0",
+        "vercel": "^39.2.0",
+        "vite-plugin-pwa": "^0.21.2"
+    },
+    "engines": {
+        "node": ">=18.0.0"
+    }
+}

package/app/playwright.config.ts

@@ -0,0 +1,27 @@
+import { defineConfig, devices } from '@playwright/test'
+
+export default defineConfig({
+    testDir: './tests',
+    fullyParallel: false,
+    forbidOnly: !!process.env.CI,
+    retries: process.env.CI ? 1 : 0,
+    reporter: 'html',
+    use: {
+        baseURL: 'http://localhost:4321',
+        trace: 'on-first-retry',
+    },
+    projects: [
+        {
+            name: 'chromium',
+            use: { ...devices['Desktop Chrome'] },
+        },
+        {
+            name: 'firefox',
+            use: { ...devices['Desktop Firefox'] },
+        },
+        {
+            name: 'webkit',
+            use: { ...devices['Desktop Safari'] },
+        },
+    ],
+})

package/app/public/manifest.webmanifest

@@ -1,36 +1,36 @@
-{
-  "name": "ATSDC Stack App",
-  "short_name": "ATSDC",
-  "description": "Progressive Web App built with the ATSDC Stack",
-  "start_url": "/",
-  "display": "standalone",
-  "background_color": "#ffffff",
-  "theme_color": "#4f46e5",
-  "orientation": "portrait-primary",
-  "icons": [
-    {
-      "src": "/pwa-192x192.png",
-      "sizes": "192x192",
-      "type": "image/png",
-      "purpose": "any"
-    },
-    {
-      "src": "/pwa-512x512.png",
-      "sizes": "512x512",
-      "type": "image/png",
-      "purpose": "any"
-    },
-    {
-      "src": "/pwa-512x512.png",
-      "sizes": "512x512",
-      "type": "image/png",
-      "purpose": "maskable"
-    }
-  ],
-  "categories": [
-    "productivity",
-    "utilities"
-  ],
-  "screenshots": [],
-  "shortcuts": []
-}
+{
+  "name": "ATSDC Stack App",
+  "short_name": "ATSDC",
+  "description": "Progressive Web App built with the ATSDC Stack",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#4f46e5",
+  "orientation": "portrait-primary",
+  "icons": [
+    {
+      "src": "/pwa-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/pwa-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/pwa-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "categories": [
+    "productivity",
+    "utilities"
+  ],
+  "screenshots": [],
+  "shortcuts": []
+}

package/app/pwa-assets.config.ts

@@ -0,0 +1,8 @@
+import { defineConfig, minimal2023Preset as preset } from '@vite-pwa/assets-generator/config'
+
+export default defineConfig({
+    preset,
+    images: [
+        'favicon.png'
+    ]
+})

package/app/src/components/Card.astro

@@ -1,36 +1,36 @@
----
-/**
- * Card Component
- * Demonstrates proper SCSS architecture:
- * - No <style> tag in this file
- * - Styles imported from external SCSS file
- * - Reusable component with props
- */
-
-interface Props {
-    title?: string;
-    href?: string;
-    class?: string;
-}
-
-const { title, href, class: className = '' } = Astro.props;
-
-// Import component-specific styles
-import '@/styles/components/card.scss';
----
-
-{href ? (
-    <a href={href} class={`card-component ${className}`}>
-        {title && <h3 class="card-component__title">{title}</h3>}
-        <div class="card-component__content">
-            <slot />
-        </div>
-    </a>
-) : (
-    <div class={`card-component ${className}`}>
-        {title && <h3 class="card-component__title">{title}</h3>}
-        <div class="card-component__content">
-            <slot />
-        </div>
-    </div>
-)}
+---
+/**
+ * Card Component
+ * Demonstrates proper SCSS architecture:
+ * - No <style> tag in this file
+ * - Styles imported from external SCSS file
+ * - Reusable component with props
+ */
+
+interface Props {
+    title?: string;
+    href?: string;
+    class?: string;
+}
+
+const { title, href, class: className = '' } = Astro.props;
+
+// Import component-specific styles
+import '@/styles/components/card.scss';
+---
+
+{href ? (
+    <a href={href} class={`card-component ${className}`}>
+        {title && <h3 class="card-component__title">{title}</h3>}
+        <div class="card-component__content">
+            <slot />
+        </div>
+    </a>
+) : (
+    <div class={`card-component ${className}`}>
+        {title && <h3 class="card-component__title">{title}</h3>}
+        <div class="card-component__content">
+            <slot />
+        </div>
+    </div>
+)}

package/app/src/db/initialize.ts

@@ -1,107 +1,107 @@
-import { sql } from '@vercel/postgres';
-import { drizzle } from 'drizzle-orm/vercel-postgres';
-import * as schema from './schema';
-import { posts, comments } from './schema';
-
-/**
- * Database client configuration
- * Uses Vercel Postgres for production-ready connection pooling
- */
-
-// Create Drizzle instance with schema
-export const db = drizzle(sql, { schema });
-
-// Export schema for convenience
-export { schema };
-
-/**
- * Database initialization utilities
- * Handles table creation, migrations, and initial setup
- */
-
-/**
- * Check if the database tables exist by attempting a simple query
- */
-export async function checkTablesExist(): Promise<boolean> {
-    try {
-        await db.select().from(posts).limit(1);
-        return true;
-    } catch (error) {
-        console.error('Error checking if tables exist:', error);
-        return false;
-    }
-}
-
-/**
- * Initialize the database by creating tables if they don't exist
- * Note: In production, use Drizzle migrations instead
- */
-export async function initializeDatabase(): Promise<void> {
-    try {
-        const tablesExist = await checkTablesExist();
-
-        if (!tablesExist) {
-            console.log('Database tables do not exist. Please run migrations using:');
-            console.log('  npm run db:push');
-            console.log('  or');
-            console.log('  npm run db:migrate');
-            throw new Error('Database tables not initialized');
-        }
-
-        console.log('Database tables verified successfully');
-    } catch (error) {
-        console.error('Database initialization failed:', error);
-        throw error;
-    }
-}
-
-/**
- * Verify database connection
- */
-export async function verifyConnection(): Promise<boolean> {
-    try {
-        await db.select().from(posts).limit(1);
-        return true;
-    } catch (error) {
-        console.error('Database connection failed:', error);
-        return false;
-    }
-}
-
-/**
- * Get database health status
- */
-export async function getDatabaseHealth(): Promise<{
-    connected: boolean;
-    tablesExist: boolean;
-    timestamp: Date;
-}> {
-    const connected = await verifyConnection();
-    const tablesExist = connected ? await checkTablesExist() : false;
-
-    return {
-        connected,
-        tablesExist,
-        timestamp: new Date(),
-    };
-}
-
-/**
- * Seed initial data (optional - for development)
- */
-export async function seedDatabase(): Promise<void> {
-    try {
-        // Check if data already exists
-        const existingPosts = await db.select().from(posts).limit(1);
-
-        if (existingPosts.length > 0) {
-            console.log('Database already contains data, skipping seed');
-            return;
-        }
-
-        console.log('Database seeding completed');
-    } catch (error) {
-        console.error('Database seeding failed:', error);
-        throw error;
-    }
-}
+import { sql } from '@vercel/postgres';
+import { drizzle } from 'drizzle-orm/vercel-postgres';
+import * as schema from './schema';
+import { posts, comments } from './schema';
+
+/**
+ * Database client configuration
+ * Uses Vercel Postgres for production-ready connection pooling
+ */
+
+// Create Drizzle instance with schema
+export const db = drizzle(sql, { schema });
+
+// Export schema for convenience
+export { schema };
+
+/**
+ * Database initialization utilities
+ * Handles table creation, migrations, and initial setup
+ */
+
+/**
+ * Check if the database tables exist by attempting a simple query
+ */
+export async function checkTablesExist(): Promise<boolean> {
+    try {
+        await db.select().from(posts).limit(1);
+        return true;
+    } catch (error) {
+        console.error('Error checking if tables exist:', error);
+        return false;
+    }
+}
+
+/**
+ * Initialize the database by creating tables if they don't exist
+ * Note: In production, use Drizzle migrations instead
+ */
+export async function initializeDatabase(): Promise<void> {
+    try {
+        const tablesExist = await checkTablesExist();
+
+        if (!tablesExist) {
+            console.log('Database tables do not exist. Please run migrations using:');
+            console.log('  npm run db:push');
+            console.log('  or');
+            console.log('  npm run db:migrate');
+            throw new Error('Database tables not initialized');
+        }
+
+        console.log('Database tables verified successfully');
+    } catch (error) {
+        console.error('Database initialization failed:', error);
+        throw error;
+    }
+}
+
+/**
+ * Verify database connection
+ */
+export async function verifyConnection(): Promise<boolean> {
+    try {
+        await db.select().from(posts).limit(1);
+        return true;
+    } catch (error) {
+        console.error('Database connection failed:', error);
+        return false;
+    }
+}
+
+/**
+ * Get database health status
+ */
+export async function getDatabaseHealth(): Promise<{
+    connected: boolean;
+    tablesExist: boolean;
+    timestamp: Date;
+}> {
+    const connected = await verifyConnection();
+    const tablesExist = connected ? await checkTablesExist() : false;
+
+    return {
+        connected,
+        tablesExist,
+        timestamp: new Date(),
+    };
+}
+
+/**
+ * Seed initial data (optional - for development)
+ */
+export async function seedDatabase(): Promise<void> {
+    try {
+        // Check if data already exists
+        const existingPosts = await db.select().from(posts).limit(1);
+
+        if (existingPosts.length > 0) {
+            console.log('Database already contains data, skipping seed');
+            return;
+        }
+
+        console.log('Database seeding completed');
+    } catch (error) {
+        console.error('Database seeding failed:', error);
+        throw error;
+    }
+}