fix: pergel theme configuration and styles

packages/nuxt/src/runtime/modules/graphqlYoga/index.ts

@@ -1,13 +1,12 @@
 import { basename, join, resolve } from 'node:path'
-import { existsSync, writeFileSync } from 'node:fs'
+import { cpSync, existsSync, mkdirSync, writeFileSync } from 'node:fs'
 import { addServerImportsDir, createResolver } from '@nuxt/kit'
 import { pascalCase } from 'scule'
 
 import { globbySync } from 'globby'
 import { definePergelModule } from '../../core/definePergel'
 import { useNitroImports } from '../../core/utils/useImports'
 import { generateModuleRuntimeConfig } from '../../core/utils/moduleRuntimeConfig'
-import { createFolderModule } from '../../core/utils/createFolderModule'
 import type { GraphQLYogaConfig, ResolvedGraphQLYogaConfig } from './types'
 import { generateGraphQLTemplate } from './utils/generateGraphqlTemplate'
 
@@ -25,26 +24,12 @@ export default definePergelModule<GraphQLYogaConfig, ResolvedGraphQLYogaConfig>(
   defaults({ rootOptions, options, nuxt }) {
     const documentDir = rootOptions.documentDir ? join(nuxt._pergel.rootDir, rootOptions.documentDir) : join(options.serverDir, 'documents')
 
-    const schemaDir = rootOptions.schemaDir ? join(nuxt._pergel.rootDir, rootOptions.schemaDir) : join(options.serverDir, 'graphql')
+    const schemaDir = rootOptions.schemaDir ? join(nuxt._pergel.rootDir, rootOptions.schemaDir) : join(options.serverDir, 'schemas')
 
     const clientConfigFile = rootOptions.codegen?.client?.configFilePath ? resolve(nuxt._pergel.rootDir, rootOptions.codegen?.client?.configFilePath) : resolve(options.serverDir, 'codegen/client.ts')
 
     const serverConfigFile = rootOptions.codegen?.server?.configFilePath ? resolve(nuxt._pergel.rootDir, rootOptions.codegen?.server?.configFilePath) : resolve(options.serverDir, 'codegen/server.ts')
 
-    rootOptions.documentDir ?? createFolderModule({
-      nuxt,
-      serverDir: documentDir,
-      moduleName: options.moduleName,
-      projectName: options.projectName,
-    })
-
-    rootOptions.schemaDir ?? createFolderModule({
-      nuxt,
-      serverDir: schemaDir,
-      moduleName: options.moduleName,
-      projectName: options.projectName,
-    })
-
     return {
       ...options,
       documentDir,
@@ -138,11 +123,6 @@ export default definePergelModule<GraphQLYogaConfig, ResolvedGraphQLYogaConfig>(
       ],
     })
 
-    generateGraphQLTemplate({
-      nuxt,
-      options,
-    })
-
     if (nuxt._pergel.projects[options.projectName]?.drizzle && nuxt._pergel.projects[options.projectName]?.lucia) {
       if (!existsSync(resolve(options.serverDir, 'index.ts'))) {
         const files = globbySync(resolver.resolve(join('templates', 'drizzle-lucia', 'root'), '**/*'), {
@@ -164,6 +144,26 @@ export default definePergelModule<GraphQLYogaConfig, ResolvedGraphQLYogaConfig>(
           }
         }
       }
+
+      if (!existsSync(resolve(options.serverDir, 'documents'))) {
+        mkdirSync(resolve(options.serverDir, 'documents'), {
+          recursive: true,
+        })
+
+        cpSync(resolver.resolve(join('templates', 'drizzle-lucia', 'documents')), resolve(options.serverDir, 'documents'), {
+          recursive: true,
+        })
+      }
+
+      if (!existsSync(resolve(options.serverDir, 'schemas'))) {
+        mkdirSync(resolve(options.serverDir, 'schemas'), {
+          recursive: true,
+        })
+
+        cpSync(resolver.resolve(join('templates', 'drizzle-lucia', 'schemas')), resolve(options.serverDir, 'schemas'), {
+          recursive: true,
+        })
+      }
     }
     else {
       if (!existsSync(resolve(options.serverDir, 'index.ts'))) {
@@ -185,6 +185,26 @@ export default definePergelModule<GraphQLYogaConfig, ResolvedGraphQLYogaConfig>(
             })
           }
         }
+
+        if (!existsSync(resolve(options.serverDir, 'documents'))) {
+          mkdirSync(resolve(options.serverDir, 'documents'), {
+            recursive: true,
+          })
+
+          cpSync(resolver.resolve(join('templates', 'root', 'documents')), resolve(options.serverDir, 'documents'), {
+            recursive: true,
+          })
+        }
+
+        if (!existsSync(resolve(options.serverDir, 'schemas'))) {
+          mkdirSync(resolve(options.serverDir, 'schemas'), {
+            recursive: true,
+          })
+
+          cpSync(resolver.resolve(join('templates', 'root', 'schemas')), resolve(options.serverDir, 'schemas'), {
+            recursive: true,
+          })
+        }
       }
     }
 
@@ -206,5 +226,10 @@ export default definePergelModule<GraphQLYogaConfig, ResolvedGraphQLYogaConfig>(
             graphqlYoga: graphqlYoga,
         `,
     })
+
+    generateGraphQLTemplate({
+      nuxt,
+      options,
+    })
   },
 })

packages/nuxt/src/runtime/modules/graphqlYoga/utils/generateCodegen.ts

@@ -67,7 +67,7 @@ export async function useGenerateCodegen({
   const { client, server } = useCodegen()
 
   const { printSchema, schema, loadDocument } = await loadGraphQLFiles({
-    rootDir: nuxt._pergel.rootDir,
+    rootDir: nuxt._pergel.serverDir,
     documentDir,
     schemaDir,
   })

packages/nuxt/src/runtime/modules/graphqlYoga/utils/generateGraphqlTemplate.ts

@@ -1,5 +1,4 @@
 import { join } from 'node:path'
-import { existsSync, writeFileSync } from 'node:fs'
 import { matchGlobs } from '../utils'
 import type { ResolvedGraphQLYogaConfig } from '../types'
 import { addModuleDTS } from '../../../core/utils/addModuleDTS'
@@ -13,35 +12,6 @@ export function generateGraphQLTemplate(data: {
 }) {
   const { codegen, dir } = data.options
 
-  const schemaTemplate = `type Query {
-  book(id: ID!): Book!
-  books: [Book!]!
-}
-
-type Book {
-  id: ID!
-  name: String!
-  email: String!
-  password: String!
-  createdAt: String!
-  updatedAt: String
-}
-    `
-
-  const documentsTemplate = `query book {
-  book(id: 1) {
-    id
-    name
-  }
-}
-    `
-
-  if (!existsSync(join(data.options.schemaDir, 'book.graphql')))
-    writeFileSync(join(data.options.schemaDir, 'book.graphql'), schemaTemplate)
-
-  if (!existsSync(join(data.options.documentDir, 'book.graphql')))
-    writeFileSync(join(data.options.documentDir, 'book.graphql'), documentsTemplate)
-
   addModuleDTS({
     template: /* ts */`
 import type { H3Event } from 'h3'

themes/pergel-auth/app.vue

@@ -1,4 +1,4 @@
-<script setup>
+<script setup lang="ts">
 import {
   darkTheme,
   lightTheme,
@@ -30,7 +30,8 @@ const isDark = computed({
   </div>
 </template>
 
-<style>
+<style lang="postcss">
+@import url("~/assets/css/pergel.css");
 #__nuxt {
   @apply w-full h-full;
 }

themes/pergel-auth/assets/pergel.css → themes/pergel-auth/assets/css/pergel.css

@@ -1,4 +1,4 @@
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
+/* @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"); */
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

themes/pergel-auth/components/mol/MolLangSwitcherButton.vue

@@ -14,7 +14,11 @@ const availableLocales = computed(() => {
       )"
     >
       <AtomIcon dynamic name="i-ph-globe-bold" class="size-4" />
-      {{ locale.value }}
+      <span
+        class="ml-2"
+      >
+        {{ locale }}
+      </span>
     </UiDropdownMenuTrigger>
     <UiDropdownMenuContent>
       <UiDropdownMenuLabel>

themes/pergel-auth/nuxt.config.ts

@@ -5,8 +5,9 @@ export default defineNuxtConfig({
     '../../packages/nuxt/src/module',
   ],
   css: [
-    '~/assets/pergel.css',
+    '~/assets/css/pergel.css',
   ],
+  ssr: false,
   pergel: {
     projects: {
       changeName: {

themes/pergel-auth/server/graphqlYoga-changeName/documents/book.graphql

@@ -1,7 +1,7 @@
 query book {
   book(id: 1) {
     id
-    name
+    title
   }
 }
 

themes/pergel-auth/server/graphqlYoga-changeName/graphql/book.graphql → themes/pergel-auth/server/graphqlYoga-changeName/schemas/book.graphql

@@ -1,14 +1,14 @@
+scalar DateTime
+
 type Query {
   book(id: ID!): Book!
   books: [Book!]!
 }
 
 type Book {
   id: ID!
-  name: String!
-  email: String!
-  password: String!
+  title: String!
   createdAt: String!
   updatedAt: String
 }
-    
+

themes/pergel-auth/server/graphqlYoga-changeName/schemas/search.graphql

@@ -0,0 +1,10 @@
+input SearchInput {
+    tableName: String!
+    text: String!
+}
+
+union SearchResult = User | Book
+
+extend type Query {
+    search(input: SearchInput!): [SearchResult]
+}

themes/pergel-auth/server/graphqlYoga-changeName/schemas/user.graphql

@@ -0,0 +1,42 @@
+enum RoleStatus {
+  user
+  admin
+  superadmin
+}
+
+type User {
+  id: ID!
+  name: String
+  email: String
+  createdAt: DateTime!
+  roleStatus: RoleStatus!
+}
+
+input UserInput {
+  name: String!
+  email: String!
+  password: String!
+}
+
+input UserUpdateInput {
+  name: String
+  email: String
+  password: String
+}
+
+
+type UserToken {
+  user: User!
+  token: String!
+}
+
+type Mutation {
+  createUser(input: UserInput!): UserToken!
+  updateUser(id: ID!, input: UserInput!): User!
+  deleteUser(id: ID!): User!
+  login(email: String!, password: String!): UserToken!
+}
+
+type Query {
+  users(search: String): [User!]!
+}

themes/pergel-auth/server/schema.graphql

@@ -0,0 +1,60 @@
+scalar DateTime
+
+type Query {
+  book(id: ID!): Book!
+  books: [Book!]!
+  search(input: SearchInput!): [SearchResult]
+  users(search: String): [User!]!
+}
+
+type Book {
+  id: ID!
+  title: String!
+  createdAt: String!
+  updatedAt: String
+}
+
+input SearchInput {
+  tableName: String!
+  text: String!
+}
+
+union SearchResult = User | Book
+
+enum RoleStatus {
+  user
+  admin
+  superadmin
+}
+
+type User {
+  id: ID!
+  name: String
+  email: String
+  createdAt: DateTime!
+  roleStatus: RoleStatus!
+}
+
+input UserInput {
+  name: String!
+  email: String!
+  password: String!
+}
+
+input UserUpdateInput {
+  name: String
+  email: String
+  password: String
+}
+
+type UserToken {
+  user: User!
+  token: String!
+}
+
+type Mutation {
+  createUser(input: UserInput!): UserToken!
+  updateUser(id: ID!, input: UserInput!): User!
+  deleteUser(id: ID!): User!
+  login(email: String!, password: String!): UserToken!
+}