feat: experimental generate resource
This commit is contained in:
arashsheyda
24
build.config.ts
Normal file
24
build.config.ts
Normal file
@ -0,0 +1,24 @@
|
||||
import { defineBuildConfig } from 'unbuild'
|
||||
|
||||
export default defineBuildConfig({
|
||||
entries: [
|
||||
'src/module',
|
||||
// Chunking
|
||||
'src/types',
|
||||
],
|
||||
externals: [
|
||||
'nuxt',
|
||||
'nuxt/schema',
|
||||
'vite',
|
||||
'@nuxt/kit',
|
||||
'@nuxt/schema',
|
||||
// Type only
|
||||
'vue',
|
||||
'vue-router',
|
||||
'unstorage',
|
||||
'nitropack',
|
||||
],
|
||||
rollup: {
|
||||
inlineDependencies: true,
|
||||
},
|
||||
})
|
||||
261
client/components/CreateResource.vue
Normal file
261
client/components/CreateResource.vue
Normal file
@ -0,0 +1,261 @@
|
||||
<script lang="ts" setup>
|
||||
interface ColumnInterface {
|
||||
name: string
|
||||
type: string
|
||||
required: boolean
|
||||
unique: boolean
|
||||
default: any
|
||||
}
|
||||
|
||||
const emit = defineEmits(['refresh'])
|
||||
const router = useRouter()
|
||||
|
||||
const schema = ref(true)
|
||||
const bread = reactive({
|
||||
browse: {
|
||||
active: true,
|
||||
type: 'index',
|
||||
},
|
||||
read: {
|
||||
active: true,
|
||||
type: 'show',
|
||||
by: '_id',
|
||||
},
|
||||
edit: {
|
||||
active: true,
|
||||
type: 'put',
|
||||
by: '_id',
|
||||
},
|
||||
add: {
|
||||
active: true,
|
||||
type: 'create',
|
||||
},
|
||||
delete: {
|
||||
active: true,
|
||||
type: 'delete',
|
||||
by: '_id',
|
||||
},
|
||||
})
|
||||
|
||||
const hasBread = computed({
|
||||
get() {
|
||||
return bread.browse.active || bread.read.active || bread.edit.active || bread.add.active || bread.delete.active
|
||||
},
|
||||
set(value: boolean) {
|
||||
bread.browse.active = value
|
||||
bread.read.active = value
|
||||
bread.edit.active = value
|
||||
bread.add.active = value
|
||||
bread.delete.active = value
|
||||
},
|
||||
})
|
||||
|
||||
const collection = ref('')
|
||||
const fields = ref<ColumnInterface[]>([
|
||||
{
|
||||
name: 'name',
|
||||
type: 'string',
|
||||
required: true,
|
||||
unique: false,
|
||||
default: '',
|
||||
},
|
||||
{
|
||||
name: 'slug',
|
||||
type: 'string',
|
||||
required: true,
|
||||
unique: true,
|
||||
default: '',
|
||||
},
|
||||
])
|
||||
|
||||
const allFields = computed(() => {
|
||||
return [{ name: '_id', type: 'ObjectId', required: true, unique: true, default: '' }, ...fields.value]
|
||||
})
|
||||
|
||||
const fieldsLabels = ['name', 'type', 'required', 'unique', 'default']
|
||||
const mongoTypes = [
|
||||
'string',
|
||||
'number',
|
||||
'boolean',
|
||||
'date',
|
||||
'object',
|
||||
'array',
|
||||
'ObjectId',
|
||||
]
|
||||
|
||||
function addField(index: number) {
|
||||
fields.value.splice(index + 1, 0, {
|
||||
name: '',
|
||||
type: 'string',
|
||||
required: false,
|
||||
unique: false,
|
||||
default: '',
|
||||
})
|
||||
}
|
||||
|
||||
function removeField(index: number) {
|
||||
fields.value.splice(index, 1)
|
||||
}
|
||||
|
||||
const convertedBread = computed(() => {
|
||||
const breads: any = []
|
||||
// add active breads
|
||||
// eslint-disable-next-line unused-imports/no-unused-vars
|
||||
for (const [key, value] of Object.entries(bread) as any) {
|
||||
if (value.active) {
|
||||
breads.push({
|
||||
type: value.type,
|
||||
by: value?.by,
|
||||
})
|
||||
}
|
||||
}
|
||||
return breads
|
||||
})
|
||||
|
||||
const formattedFields = computed(() => {
|
||||
return fields.value.map((field) => {
|
||||
for (const [key, value] of Object.entries(field)) {
|
||||
if (!value) {
|
||||
// @ts-expect-error - no need for type checking
|
||||
delete field[key]
|
||||
}
|
||||
}
|
||||
|
||||
return field
|
||||
})
|
||||
})
|
||||
|
||||
async function generate() {
|
||||
await rpc.generateResource(
|
||||
{
|
||||
name: collection.value,
|
||||
fields: schema.value ? formattedFields.value : undefined,
|
||||
},
|
||||
convertedBread.value,
|
||||
).then(() => {
|
||||
emit('refresh')
|
||||
router.push(`/?table=${collection.value}`)
|
||||
})
|
||||
}
|
||||
|
||||
// TODO: remove this
|
||||
const toggleSchema = computed({
|
||||
get() {
|
||||
if (hasBread.value)
|
||||
return schema.value = true
|
||||
return schema.value
|
||||
},
|
||||
set(value: boolean) {
|
||||
schema.value = value
|
||||
if (!schema.value)
|
||||
return hasBread.value = false
|
||||
hasBread.value = true
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div relative h-full of-hidden>
|
||||
<div sticky top-0 px8 py4 n-bg-base>
|
||||
<div mb2 flex items-center>
|
||||
<span text-2xl font-bold mt1>
|
||||
<NCheckbox v-model="hasBread" n="green">
|
||||
BREAD
|
||||
|
|
||||
</NCheckbox>
|
||||
</span>
|
||||
<span flex gap4 mt2 ml2>
|
||||
<NCheckbox v-model="bread.browse.active" n="blue">
|
||||
Browse
|
||||
</NCheckbox>
|
||||
<div flex gap2>
|
||||
<NCheckbox v-model="bread.read.active" n="cyan">
|
||||
Read
|
||||
</NCheckbox>
|
||||
<NSelect v-if="bread.read.active" v-model="bread.read.by">
|
||||
<option v-for="field in allFields" :key="field.name" :value="field.name">
|
||||
{{ field.name }}
|
||||
</option>
|
||||
</NSelect>
|
||||
</div>
|
||||
<div flex gap2>
|
||||
<NCheckbox v-model="bread.edit.active" n="purple">
|
||||
Edit
|
||||
</NCheckbox>
|
||||
<NSelect v-if="bread.edit.active" v-model="bread.edit.by">
|
||||
<option v-for="field in allFields" :key="field.name" :value="field.name">
|
||||
{{ field.name }}
|
||||
</option>
|
||||
</NSelect>
|
||||
</div>
|
||||
<NCheckbox v-model="bread.add.active" n="green">
|
||||
Add
|
||||
</NCheckbox>
|
||||
<div flex gap2>
|
||||
<NCheckbox v-model="bread.delete.active" n="red">
|
||||
Delete
|
||||
</NCheckbox>
|
||||
<NSelect v-if="bread.delete.active" v-model="bread.delete.by">
|
||||
<option v-for="field in allFields" :key="field.name" :value="field.name">
|
||||
{{ field.name }}
|
||||
</option>
|
||||
</NSelect>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
<div flex gap4>
|
||||
<NTextInput v-model="collection" flex-auto placeholder="Collection name" />
|
||||
<NCheckbox v-model="toggleSchema" n="green">
|
||||
Generate Schema
|
||||
</NCheckbox>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="schema" px8 h-full of-auto>
|
||||
<div grid="~ cols-1" gap-2 mt4 mb4>
|
||||
<div grid="~ cols-6" text-center>
|
||||
<div v-for="label in fieldsLabels" :key="label">
|
||||
{{ label }}
|
||||
</div>
|
||||
<div>
|
||||
Actions
|
||||
</div>
|
||||
</div>
|
||||
<div v-for="(column, index) in fields" :key="index" grid="~ cols-6" items-center text-center gap4>
|
||||
<div>
|
||||
<NTextInput v-model="column.name" />
|
||||
</div>
|
||||
<div>
|
||||
<NSelect v-model="column.type">
|
||||
<option v-for="mongoType of mongoTypes" :key="mongoType" :value="mongoType">
|
||||
{{ mongoType }}
|
||||
</option>
|
||||
</NSelect>
|
||||
</div>
|
||||
<div>
|
||||
<NCheckbox v-model="column.required" n="green" />
|
||||
</div>
|
||||
<div>
|
||||
<NCheckbox v-model="column.unique" n="cyan" />
|
||||
</div>
|
||||
<div>
|
||||
<NTextInput v-if="column.type === 'string'" v-model="column.default" type="string" n="orange" />
|
||||
<NTextInput v-else-if="column.type === 'number'" v-model="column.default" type="number" n="orange" />
|
||||
<NCheckbox v-else-if="column.type === 'boolean'" v-model="column.default" n="orange" />
|
||||
<NTextInput v-else-if="column.type === 'date'" v-model="column.default" type="date" n="orange" />
|
||||
<NTextInput v-else-if="column.type === 'ObjectId'" placeholder="no-default" disabled n="orange" />
|
||||
<NTextInput v-else v-model="column.default" n="orange" />
|
||||
</div>
|
||||
<div flex justify-center gap2>
|
||||
<NIconButton icon="carbon-add" n="cyan" @click="addField(index)" />
|
||||
<NIconButton icon="carbon-delete" n="red" @click="removeField(index)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<NButton absolute right-8 bottom-8 px8 py2 icon="carbon-magic-wand-filled" n="green" @click="generate">
|
||||
Create
|
||||
</NButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style></style>
|
||||
@ -1,3 +1,4 @@
|
||||
<!-- eslint-disable no-console -->
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps({
|
||||
collection: {
|
||||
@ -10,9 +11,15 @@ const documents = computedAsync(async () => {
|
||||
return await rpc.listDocuments(props.collection)
|
||||
})
|
||||
|
||||
const schema = computedAsync<any>(async () => {
|
||||
return await rpc.resourceSchema(props.collection)
|
||||
})
|
||||
|
||||
const fields = computed(() => {
|
||||
if (documents.value && documents.value.length > 0)
|
||||
return Object.keys(documents.value[0])
|
||||
if (schema.value)
|
||||
return Object.keys(schema.value)
|
||||
return []
|
||||
})
|
||||
|
||||
@ -34,14 +41,21 @@ const filtered = computed(() => {
|
||||
})
|
||||
|
||||
function addDocument() {
|
||||
// TODO: validate & show errors
|
||||
if (editing.value)
|
||||
return
|
||||
editing.value = true
|
||||
selectedDocument.value = {}
|
||||
for (const field of fields.value) {
|
||||
if (field !== '_id')
|
||||
if (schema.value) {
|
||||
for (const field of Object.keys(schema.value))
|
||||
selectedDocument.value[field] = ''
|
||||
}
|
||||
else {
|
||||
for (const field of fields.value) {
|
||||
if (field !== '_id')
|
||||
selectedDocument.value[field] = ''
|
||||
}
|
||||
}
|
||||
|
||||
const parent = dbContainer.value?.parentElement
|
||||
parent?.scrollTo(0, parent.scrollHeight)
|
||||
@ -78,10 +92,22 @@ async function deleteDocument(document: any) {
|
||||
rpc.deleteDocument(props.collection, document._id)
|
||||
documents.value = await rpc.listDocuments(props.collection)
|
||||
}
|
||||
|
||||
const fieldRefs = ref<any>([])
|
||||
function handleClickOutside(event: any) {
|
||||
if (editing.value && selectedDocument.value) {
|
||||
const isClickOutside = fieldRefs.value.every((ref: any) => !ref.contains(event.target))
|
||||
if (isClickOutside) {
|
||||
editing.value = false
|
||||
selectedDocument.value = null
|
||||
}
|
||||
}
|
||||
}
|
||||
// useEventListener('click', handleClickOutside)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div ref="dbContainer">
|
||||
<div ref="dbContainer" :class="{ 'h-full': !documents?.length }">
|
||||
<Navbar v-model:search="search" sticky top-0 px4 py2 backdrop-blur z-10>
|
||||
<template #actions>
|
||||
<NButton icon="carbon:add" n="green" @click="addDocument">
|
||||
@ -93,7 +119,7 @@ async function deleteDocument(document: any) {
|
||||
<span>{{ documents?.length }} documents in total</span>
|
||||
</div>
|
||||
</Navbar>
|
||||
<table v-if="documents?.length" w-full mb10 :class="{ 'editing-mode': editing }">
|
||||
<table v-if="documents?.length || selectedDocument" w-full mb10 :class="{ 'editing-mode': editing }">
|
||||
<thead>
|
||||
<tr>
|
||||
<th v-for="field of fields" :key="field" text-start>
|
||||
@ -105,8 +131,9 @@ async function deleteDocument(document: any) {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- hover-bg-green hover-bg-opacity-5 hover-text-green cursor-pointer -->
|
||||
<tr v-for="document in filtered" :key="document._id" :class="{ isEditing: editing && selectedDocument._id === document._id }">
|
||||
<td v-for="field of fields" :key="field" hover-bg-green hover-bg-opacity-5 hover-text-green cursor-pointer @dblclick="editDocument(document)">
|
||||
<td v-for="field of fields" :key="field" ref="fieldRefs" @dblclick="editDocument(document)">
|
||||
<template v-if="editing && selectedDocument._id === document._id">
|
||||
<input v-model="selectedDocument[field]" :disabled="field === '_id'">
|
||||
</template>
|
||||
|
||||
52
client/components/DrawerRight.vue
Normal file
52
client/components/DrawerRight.vue
Normal file
@ -0,0 +1,52 @@
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
modelValue?: boolean
|
||||
navbar?: HTMLElement
|
||||
autoClose?: boolean
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'close'): void
|
||||
}>()
|
||||
|
||||
const el = ref<HTMLElement>()
|
||||
|
||||
const { height: top } = useElementSize(() => props.navbar, undefined, { box: 'border-box' })
|
||||
|
||||
onClickOutside(el, () => {
|
||||
if (props.modelValue && props.autoClose)
|
||||
emit('close')
|
||||
}, {})
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
inheritAttrs: false,
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Transition
|
||||
enter-active-class="duration-200 ease-in"
|
||||
enter-from-class="transform translate-x-1/1"
|
||||
enter-to-class="opacity-100"
|
||||
leave-active-class="duration-200 ease-out"
|
||||
leave-from-class="opacity-100"
|
||||
leave-to-class="transform translate-x-1/1"
|
||||
>
|
||||
<div
|
||||
v-if="modelValue"
|
||||
ref="el"
|
||||
border="l base"
|
||||
flex="~ col gap-1"
|
||||
fixed bottom-0 right-0 z-10 z-20 of-auto text-sm backdrop-blur-lg
|
||||
:style="{ top: `${top}px` }"
|
||||
v-bind="$attrs"
|
||||
>
|
||||
<NIconButton absolute right-2 top-2 z-20 text-xl icon="carbon-close" @click="$emit('close')" />
|
||||
<div relative h-full w-full of-auto>
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
</Transition>
|
||||
</template>
|
||||
@ -1,5 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const selectedCollection = ref()
|
||||
// TODO: check connection
|
||||
@ -21,13 +22,26 @@ onMounted(() => {
|
||||
if (route.query.table)
|
||||
selectedCollection.value = route.query.table
|
||||
})
|
||||
|
||||
async function dropCollection(table: any) {
|
||||
await rpc.dropCollection(table.name)
|
||||
collections.value = await rpc.listCollections()
|
||||
if (selectedCollection.value === table.name) {
|
||||
selectedCollection.value = undefined
|
||||
router.push({ name: 'index' })
|
||||
}
|
||||
}
|
||||
|
||||
async function refresh() {
|
||||
collections.value = await rpc.listCollections()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<PanelLeftRight :min-left="13" :max-left="20">
|
||||
<template #left>
|
||||
<div py1 px4>
|
||||
<Navbar v-model:search="search" :placeholder="`${collections?.length ?? '-'} collection in total`" mt1>
|
||||
<div px4>
|
||||
<Navbar v-model:search="search" :placeholder="`${collections?.length ?? '-'} collection in total`" mt2>
|
||||
<div flex items-center gap2>
|
||||
<NIconButton w-full mb1.5 icon="carbon-reset" title="Refresh" />
|
||||
<NIconButton w-full mb1.5 icon="carbon-data-base" title="Connection Name" :class="connected ? 'text-green-5' : 'text-orange-5'" />
|
||||
@ -40,14 +54,27 @@ onMounted(() => {
|
||||
<NIcon icon="carbon-db2-database" />
|
||||
{{ table.name }}
|
||||
</span>
|
||||
<!-- TODO: -->
|
||||
<NIconButton icon="carbon-overflow-menu-horizontal" />
|
||||
<div flex gap2>
|
||||
<NIconButton block n="red" icon="carbon-delete" @click="dropCollection(table)" />
|
||||
<!-- <NIconButton icon="carbon-overflow-menu-horizontal" /> -->
|
||||
</div>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #right>
|
||||
<DatabaseDetail v-if="selectedCollection" :collection="selectedCollection" />
|
||||
<div v-else class="n-panel-grids-center">
|
||||
<div class="n-card n-card-base" px6 py2>
|
||||
<span op75 flex items-center>
|
||||
<NIcon icon="carbon:db2-buffer-pool" mr2 />
|
||||
Select a collection to start
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</PanelLeftRight>
|
||||
<DrawerRight v-model="drawer" style="width: calc(80.5%);" auto-close @close="drawer = false">
|
||||
<CreateResource @refresh="refresh" />
|
||||
</DrawerRight>
|
||||
</template>
|
||||
|
||||
15
module.cjs
Normal file
15
module.cjs
Normal file
@ -0,0 +1,15 @@
|
||||
/* eslint-disable eslint-comments/no-unlimited-disable */
|
||||
/* eslint-disable */
|
||||
module.exports = function (...args) {
|
||||
const nuxt = this.nuxt || args[1]
|
||||
let _a
|
||||
let version = (nuxt == null ? void 0 : nuxt._version) || (nuxt == null ? void 0 : nuxt.version) || ((_a = nuxt == null ? void 0 : nuxt.constructor) == null ? void 0 : _a.version) || ''
|
||||
version = version.replace(/^v/g, '')
|
||||
// Nuxt DevTools is not compatible with Nuxt 2, disabled
|
||||
if (version.startsWith('2.')) {
|
||||
return
|
||||
}
|
||||
return import('./dist/module.mjs').then(m => m.default.call(this, ...args))
|
||||
}
|
||||
const _meta = module.exports.meta = require('./dist/module.json')
|
||||
module.exports.getMeta = () => Promise.resolve(_meta)
|
||||
24
package.json
24
package.json
@ -11,24 +11,28 @@
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./dist/types.d.ts",
|
||||
"require": "./dist/module.cjs",
|
||||
"require": "./module.cjs",
|
||||
"import": "./dist/module.mjs"
|
||||
}
|
||||
},
|
||||
"./types": {
|
||||
"types": "./dist/types.d.ts",
|
||||
"import": "./dist/types.mjs"
|
||||
},
|
||||
"./*": "./*"
|
||||
},
|
||||
"main": "./dist/module.cjs",
|
||||
"main": "./module.cjs",
|
||||
"types": "./dist/types.d.ts",
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"scripts": {
|
||||
"prepack": "nuxt-module-build && npm run build:client",
|
||||
"build": "pnpm dev:prepare && pnpm build:module && pnpm build:client",
|
||||
"build:client": "nuxi generate client",
|
||||
"dev:client": "nuxi dev client --port 3300",
|
||||
"dev": "npm run play:dev",
|
||||
"dev:prepare": "nuxt-module-build --stub && nuxi prepare client",
|
||||
"play:dev": "nuxi dev playground",
|
||||
"play:prod": "npm run prepack && nuxi dev playground",
|
||||
"release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
|
||||
"build:module": "nuxt-build-module",
|
||||
"dev": "nuxi dev playground",
|
||||
"dev:prepare": "nuxi prepare client",
|
||||
"dev:prod": "npm run build && pnpm dev",
|
||||
"release": "npm run lint && npm run test && npm run build && changelogen --release && npm publish && git push --follow-tags",
|
||||
"lint": "eslint .",
|
||||
"test": "vitest run",
|
||||
"test:watch": "vitest watch"
|
||||
|
||||
@ -1,5 +0,0 @@
|
||||
import { User } from '~/server/models/user.schema'
|
||||
|
||||
export default defineEventHandler(() => {
|
||||
return User.find()
|
||||
})
|
||||
@ -1,18 +0,0 @@
|
||||
import { defineMongooseModel } from '#nuxt/mongoose'
|
||||
|
||||
export const User = defineMongooseModel({
|
||||
name: 'User',
|
||||
schema: {
|
||||
name: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
// export const User = defineMongooseModel('User', {
|
||||
// name: {
|
||||
// type: String,
|
||||
// required: true,
|
||||
// },
|
||||
// })
|
||||
@ -1,4 +1,4 @@
|
||||
import { addServerPlugin, addTemplate, createResolver, defineNuxtModule, logger } from '@nuxt/kit'
|
||||
import { addImportsDir, addServerPlugin, addTemplate, createResolver, defineNuxtModule, logger } from '@nuxt/kit'
|
||||
import { pathExists } from 'fs-extra'
|
||||
import { tinyws } from 'tinyws'
|
||||
import { defu } from 'defu'
|
||||
@ -22,6 +22,8 @@ export default defineNuxtModule<ModuleOptions>({
|
||||
setup(options, nuxt) {
|
||||
const { resolve } = createResolver(import.meta.url)
|
||||
|
||||
addImportsDir(resolve('./runtime/composables'))
|
||||
|
||||
if (!options.uri)
|
||||
console.warn('Missing `MONGODB_URI` in `.env`')
|
||||
|
||||
|
||||
8
src/runtime/composables/useMongoose.ts
Normal file
8
src/runtime/composables/useMongoose.ts
Normal file
@ -0,0 +1,8 @@
|
||||
import type { mongo } from 'mongoose'
|
||||
import { connection } from 'mongoose'
|
||||
|
||||
export function useMongoose(): { db: mongo.Db } {
|
||||
return {
|
||||
db: connection?.db,
|
||||
}
|
||||
}
|
||||
@ -1,39 +1,38 @@
|
||||
import { logger } from '@nuxt/kit'
|
||||
import { ObjectId } from 'mongodb'
|
||||
import { connection as MongooseConnection, connect } from 'mongoose'
|
||||
import mongoose from 'mongoose'
|
||||
import type { NuxtDevtoolsServerContext, ServerFunctions } from '../types'
|
||||
|
||||
export function setupDatabaseRPC({ nuxt }: NuxtDevtoolsServerContext): any {
|
||||
// TODO:
|
||||
connect('mongodb://127.0.0.1:27017/arcane')
|
||||
mongoose.connect('mongodb://127.0.0.1:27017/arcane')
|
||||
|
||||
return {
|
||||
async createCollection(name: string) {
|
||||
return await MongooseConnection.db.createCollection(name)
|
||||
return await mongoose.connection.db.createCollection(name)
|
||||
},
|
||||
async listCollections() {
|
||||
return await MongooseConnection.db.listCollections().toArray()
|
||||
return await mongoose.connection.db.listCollections().toArray()
|
||||
},
|
||||
async getCollection(name: string) {
|
||||
return MongooseConnection.db.collection(name)
|
||||
return mongoose.connection.db.collection(name)
|
||||
},
|
||||
async dropCollection(name: string) {
|
||||
return await MongooseConnection.db.collection(name).drop()
|
||||
return await mongoose.connection.db.collection(name).drop()
|
||||
},
|
||||
|
||||
async createDocument(collection: string, data: any) {
|
||||
return await MongooseConnection.db.collection(collection).insertOne(data)
|
||||
return await mongoose.connection.db.collection(collection).insertOne(data)
|
||||
},
|
||||
async listDocuments(collection: string) {
|
||||
return await MongooseConnection.db.collection(collection).find().toArray()
|
||||
return await mongoose.connection.db.collection(collection).find().toArray()
|
||||
},
|
||||
async getDocument(collection: string, document: {}) {
|
||||
return await MongooseConnection.db.collection(collection).findOne({ document })
|
||||
return await mongoose.connection.db.collection(collection).findOne({ document })
|
||||
},
|
||||
async updateDocument(collection: string, data: any) {
|
||||
const { _id, ...rest } = data
|
||||
try {
|
||||
return await MongooseConnection.db.collection(collection).findOneAndUpdate({ _id: new ObjectId(_id) }, { $set: rest })
|
||||
return await mongoose.connection.db.collection(collection).findOneAndUpdate({ _id: new mongoose.Types.ObjectId(_id) }, { $set: rest })
|
||||
}
|
||||
catch (error) {
|
||||
logger.log(error)
|
||||
@ -41,7 +40,7 @@ export function setupDatabaseRPC({ nuxt }: NuxtDevtoolsServerContext): any {
|
||||
}
|
||||
},
|
||||
async deleteDocument(collection: string, id: string) {
|
||||
return await MongooseConnection.db.collection(collection).deleteOne({ _id: new ObjectId(id) })
|
||||
return await mongoose.connection.db.collection(collection).deleteOne({ _id: new mongoose.Types.ObjectId(id) })
|
||||
},
|
||||
} satisfies Partial<ServerFunctions>
|
||||
}
|
||||
|
||||
@ -8,6 +8,7 @@ import { parse, stringify } from 'flatted'
|
||||
import type { Nuxt } from 'nuxt/schema'
|
||||
import type { ClientFunctions, ModuleOptions, NuxtDevtoolsServerContext, ServerFunctions } from '../types'
|
||||
import { setupDatabaseRPC } from './database'
|
||||
import { setupResourceRPC } from './resource'
|
||||
|
||||
export function setupRPC(nuxt: Nuxt, options: ModuleOptions): any {
|
||||
const serverFunctions = {} as ServerFunctions
|
||||
@ -63,6 +64,7 @@ export function setupRPC(nuxt: Nuxt, options: ModuleOptions): any {
|
||||
|
||||
Object.assign(serverFunctions, {
|
||||
...setupDatabaseRPC(ctx),
|
||||
...setupResourceRPC(ctx),
|
||||
} satisfies Partial<ServerFunctions>)
|
||||
|
||||
const wsClients = new Set<WebSocket>()
|
||||
|
||||
77
src/server-rpc/resource.ts
Normal file
77
src/server-rpc/resource.ts
Normal file
@ -0,0 +1,77 @@
|
||||
import fs from 'fs-extra'
|
||||
import { resolve } from 'pathe'
|
||||
import mongoose from 'mongoose'
|
||||
import type { Collection, NuxtDevtoolsServerContext, Resource, ServerFunctions } from '../types'
|
||||
import { generateApiRoute, generateSchemaFile } from '../utils/schematics'
|
||||
import { capitalize, pluralize, singularize } from '../utils/formatting'
|
||||
|
||||
export function setupResourceRPC({ nuxt }: NuxtDevtoolsServerContext): any {
|
||||
return {
|
||||
async generateResource(collection: Collection, resources: Resource[]) {
|
||||
const singular = singularize(collection.name).toLowerCase()
|
||||
const plural = pluralize(collection.name).toLowerCase()
|
||||
const dbName = capitalize(singular)
|
||||
|
||||
if (collection.fields) {
|
||||
if (!fs.existsSync(resolve(nuxt.options.serverDir, 'models', `${singular}.schema.ts`))) {
|
||||
fs.ensureDirSync(resolve(nuxt.options.serverDir, 'models'))
|
||||
fs.writeFileSync(
|
||||
resolve(nuxt.options.serverDir, 'models', `${singular}.schema.ts`),
|
||||
generateSchemaFile(dbName, collection.fields),
|
||||
)
|
||||
}
|
||||
|
||||
const model = { name: dbName, path: `${singular}.schema` }
|
||||
fs.ensureDirSync(resolve(nuxt.options.serverDir, `api/${plural}`))
|
||||
|
||||
// create resources
|
||||
// TODO: fix this
|
||||
resources.forEach((route: any) => {
|
||||
let fileName = ''
|
||||
if (route.type === 'index')
|
||||
fileName = 'index.get.ts'
|
||||
|
||||
if (route.type === 'create')
|
||||
fileName = 'create.post.ts'
|
||||
|
||||
if (route.type === 'show')
|
||||
fileName = `[_${route.by}].get.ts`.replace('_', '')
|
||||
|
||||
if (route.type === 'put')
|
||||
fileName = `[_${route.by}].put.ts`.replace('_', '')
|
||||
|
||||
if (route.type === 'delete')
|
||||
fileName = `[_${route.by}].delete.ts`.replace('_', '')
|
||||
|
||||
if (!fs.existsSync(resolve(nuxt.options.serverDir, `api/${plural}`, fileName))) {
|
||||
const content = generateApiRoute(route.type, { model, by: route.by })
|
||||
fs.writeFileSync(resolve(nuxt.options.serverDir, 'api', plural, fileName), content)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// create collection if not exists
|
||||
if (!mongoose.connection.modelNames().includes(dbName))
|
||||
await mongoose.connection.db.createCollection(plural)
|
||||
|
||||
// create rows and columns
|
||||
},
|
||||
async resourceSchema(collection: string) {
|
||||
// get schema file if exists
|
||||
const singular = singularize(collection).toLowerCase()
|
||||
|
||||
if (fs.existsSync(resolve(nuxt.options.serverDir, 'models', `${singular}.schema.ts`))) {
|
||||
const schemaPath = resolve(nuxt.options.serverDir, 'models', `${singular}.schema.ts`)
|
||||
|
||||
const content = fs.readFileSync(schemaPath, 'utf-8').match(/schema: \{(.|\n)*\}/g)
|
||||
|
||||
if (content) {
|
||||
const schemaString = content[0].replace('schema: ', '').slice(0, -3)
|
||||
// eslint-disable-next-line no-eval
|
||||
const schema = eval(`(${schemaString})`)
|
||||
return schema
|
||||
}
|
||||
}
|
||||
},
|
||||
} satisfies Partial<ServerFunctions>
|
||||
}
|
||||
@ -1,18 +1,32 @@
|
||||
export interface ServerFunctions {
|
||||
// collections
|
||||
// Database - collections
|
||||
createCollection(name: string): Promise<any>
|
||||
listCollections(): Promise<any>
|
||||
getCollection(name: string): Promise<any>
|
||||
dropCollection(name: string): Promise<any>
|
||||
|
||||
// documents
|
||||
// Database - documents
|
||||
createDocument(collection: string, data: any): Promise<any>
|
||||
listDocuments(collection: string): Promise<any>
|
||||
getDocument(collection: string, id: string): Promise<any>
|
||||
updateDocument(collection: string, data: any): Promise<any>
|
||||
deleteDocument(collection: string, id: string): Promise<any>
|
||||
|
||||
// Resource - api-routes & models
|
||||
generateResource(collection: Collection, resources: Resource[]): Promise<any>
|
||||
resourceSchema(collection: string): Promise<any>
|
||||
}
|
||||
|
||||
export interface ClientFunctions {
|
||||
refresh(type: string): void
|
||||
}
|
||||
|
||||
export interface Collection {
|
||||
name: string
|
||||
fields?: {}[]
|
||||
}
|
||||
|
||||
export interface Resource {
|
||||
type: string
|
||||
by?: string
|
||||
}
|
||||
|
||||
22
src/utils/formatting.ts
Normal file
22
src/utils/formatting.ts
Normal file
@ -0,0 +1,22 @@
|
||||
import plrz from 'pluralize'
|
||||
|
||||
export function normalizeToKebabOrSnakeCase(str: string) {
|
||||
const STRING_DASHERIZE_REGEXP = /\s/g
|
||||
const STRING_DECAMELIZE_REGEXP = /([a-z\d])([A-Z])/g
|
||||
return str
|
||||
.replace(STRING_DECAMELIZE_REGEXP, '$1-$2')
|
||||
.toLowerCase()
|
||||
.replace(STRING_DASHERIZE_REGEXP, '-')
|
||||
}
|
||||
|
||||
export function pluralize(str: string) {
|
||||
return plrz.plural(str)
|
||||
}
|
||||
|
||||
export function singularize(str: string) {
|
||||
return plrz.singular(str)
|
||||
}
|
||||
|
||||
export function capitalize(str: string) {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1)
|
||||
}
|
||||
49
src/utils/schematics.ts
Normal file
49
src/utils/schematics.ts
Normal file
@ -0,0 +1,49 @@
|
||||
import { capitalize } from './formatting'
|
||||
|
||||
export function generateSchemaFile(name: string, fields: any) {
|
||||
name = capitalize(name)
|
||||
// TODO: fix spacing
|
||||
const outputObject = JSON.stringify(
|
||||
fields.reduce((acc: any, curr: any) => {
|
||||
const { name, ...rest } = curr
|
||||
acc[name] = rest
|
||||
return acc
|
||||
}, {}),
|
||||
null, 2)
|
||||
.replace(/"([^"]+)":/g, '$1:')
|
||||
.replace(/"(\w+)":/g, '$1:')
|
||||
.replace(/\s*"\w+":/g, match => match.trim())
|
||||
.replace(/"string"/g, '\'string\'')
|
||||
|
||||
return `import { defineMongooseModel } from '#nuxt/mongoose'
|
||||
|
||||
export const ${name}Schema = defineMongooseModel({
|
||||
name: '${name}',
|
||||
schema: ${outputObject},
|
||||
})
|
||||
`
|
||||
}
|
||||
|
||||
export function generateApiRoute(action: string, { model, by }: { model: { name: string; path: string }; by?: string }) {
|
||||
const modelName = capitalize(model.name)
|
||||
const schemaImport = `import { ${modelName}Schema } from '../../models/${model.path}'\n\n`
|
||||
const operation = {
|
||||
index: `return await ${modelName}Schema.find({})`,
|
||||
create: `return await new ${modelName}Schema(body).save()`,
|
||||
show: `return await ${modelName}Schema.findOne({ ${by}: event.context.params?.${by} })`,
|
||||
put: `return await ${modelName}Schema.findOneAndUpdate({ ${by}: event.context.params?.${by} }, body, { new: true })`,
|
||||
delete: `return await ${modelName}Schema.findOneAndDelete({ ${by}: event.context.params?.${by} })`,
|
||||
}[action]
|
||||
|
||||
const main = `try {
|
||||
${operation}
|
||||
}
|
||||
catch (error) {
|
||||
return error
|
||||
}`
|
||||
|
||||
return `${schemaImport}export default defineEventHandler(async (event) => {
|
||||
${(action === 'create' || action === 'put') ? `const body = await readBody(event)\n ${main}` : main}
|
||||
})
|
||||
`
|
||||
}
|
||||
Reference in New Issue
Block a user