@d-mok/quasar-app-extension-quasar-axe 2.1.7 → 2.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@d-mok/quasar-app-extension-quasar-axe",
-    "version": "2.1.7",
+    "version": "2.1.8",
     "description": "A Quasar App Extension",
     "author": "d-mok <49301824+d-mok@users.noreply.github.com>",
     "license": "MIT",
@@ -15,7 +15,7 @@
     },
     "dependencies": {
         "@handsontable/vue3": "^12.1.0",
-        "@supabase/supabase-js": "^1.35.4",
+        "@supabase/supabase-js": "^2.24.0",
         "@types/lodash": "^4.14.182",
         "@types/papaparse": "^5.3.2",
         "@types/webpack-env": "^1.17.0",

package/src/templates/src/utils/index.ts

@@ -3,9 +3,7 @@ import 'sapphire-js'
 export { qDialog } from './dialog'
 export * as qNotify from './notify'
 
-export { HANDLE_ERROR, supabase } from './supabase'
-
-export { localSettings } from './settings'
+export { HANDLE_ERROR, supabase } from './supabase2'
 
 export { TABLE, ENTITY } from './puppets'
 

package/src/templates/src/utils/puppets/builder/index.ts

@@ -1,5 +1,5 @@
 import { Core } from '../core'
-import { Filter } from '../type'
+import { Filter, Key } from '../type'
 import { ui } from './ui'
 
 type Promisable<T> = T | PromiseLike<T>
@@ -89,17 +89,17 @@ abstract class Builder<T, R> extends BuilderUI implements PromiseLike<void> {
 abstract class FilterBuilder<T, R> extends Builder<T, R> {
     protected filters: Filter<R>[] = []
 
-    eq<K extends keyof R>(key: K, val: R[K]): this {
+    eq<K extends Key<R>>(key: K, val: R[K]): this {
         this.filters.push({ type: 'eq', payload: { key, val } })
         return this
     }
 
-    in<K extends keyof R>(key: K, vals: R[K][]): this {
+    in<K extends Key<R>>(key: K, vals: R[K][]): this {
         this.filters.push({ type: 'in', payload: { key, vals } })
         return this
     }
 
-    like<K extends keyof R>(key: K, pattern: string): this {
+    like<K extends Key<R>>(key: K, pattern: string): this {
         this.filters.push({ type: 'like', payload: { key, pattern } })
         return this
     }
@@ -109,7 +109,7 @@ abstract class FilterBuilder<T, R> extends Builder<T, R> {
         return this
     }
 
-    order<K extends keyof R>(key: K, ascending: boolean = true): this {
+    order<K extends Key<R>>(key: K, ascending: boolean = true): this {
         this.filters.push({ type: 'order', payload: { key, asc: ascending } })
         return this
     }
@@ -123,7 +123,7 @@ export class SelectBuilder<T, R> extends FilterBuilder<T, R> {
     }
 }
 
-export class SelectInBuilder<T, R, K extends keyof R> extends FilterBuilder<
+export class SelectInBuilder<T, R, K extends Key<R>> extends FilterBuilder<
     T,
     R
 > {
@@ -213,7 +213,7 @@ export class UpsertBuilder<T, R> extends Builder<T, R> {
 
     constructor(
         private row: Partial<R>,
-        private conflictKeys: (keyof R)[],
+        private conflictKeys: Key<R>[],
         core: Core<T, R>,
         callback: (objs: T[]) => void
     ) {

package/src/templates/src/utils/puppets/core/db.ts

@@ -3,59 +3,36 @@ import {
     HANDLE_ERROR,
     PostgrestFilterBuilder,
     PostgrestSingleResponse,
-} from '../../supabase'
+} from '../../supabase2'
 import { Filter } from '../type'
-import _ from 'lodash'
 
-async function send<R>(q: PostgrestFilterBuilder<R>): Promise<R[]> {
+type FilterBuilder = PostgrestFilterBuilder<any, any, any, any>
+
+async function send(q: FilterBuilder): Promise<any[]> {
     let { data, error } = await q
     HANDLE_ERROR(data, error)
     return data
 }
 
-async function sendSingle<R>(
-    q: PromiseLike<PostgrestSingleResponse<R>>
-): Promise<R[]> {
+async function sendSingle(
+    q: PromiseLike<PostgrestSingleResponse<any>>
+): Promise<any[]> {
     let { data, error } = await q
     HANDLE_ERROR(data, error)
     return [data]
 }
 
-function parseFilter<R>(
-    q: PostgrestFilterBuilder<R>,
-    filter: Filter<R>
-): PostgrestFilterBuilder<R> {
-    if (filter.type === 'eq') q = q.eq(filter.payload.key, filter.payload.val)
-    if (filter.type === 'in') q = q.in(filter.payload.key, filter.payload.vals)
-    if (filter.type === 'like')
-        q = q.like(filter.payload.key, filter.payload.pattern)
-    return q
-}
-
-function parseLimit<R>(
-    q: PostgrestFilterBuilder<R>,
-    filter: Filter<R>
-): PostgrestFilterBuilder<R> {
-    if (filter.type === 'limit') q = q.limit(filter.payload)
-    return q
-}
-
-function parseOrder<R>(
-    q: PostgrestFilterBuilder<R>,
-    filter: Filter<R>
-): PostgrestFilterBuilder<R> {
-    if (filter.type === 'order')
-        q = q.order(filter.payload.key, { ascending: filter.payload.asc })
-    return q
-}
-
-function parseFilters<R>(
-    q: PostgrestFilterBuilder<R>,
-    filters: Filter<R>[]
-): PostgrestFilterBuilder<R> {
-    for (const filter of filters) q = parseFilter(q, filter)
-    for (const filter of filters) q = parseOrder(q, filter)
-    for (const filter of filters) q = parseLimit(q, filter)
+function parseFilters(q: FilterBuilder, filters: Filter[]): FilterBuilder {
+    let sortedFilters = filters.sortedBy(f =>
+        ['eq', 'in', 'like', 'limit', 'order'].indexOf(f.type)
+    )
+    for (const { type: t, payload: p } of sortedFilters) {
+        if (t === 'eq') q = q.eq(p.key, p.val)
+        if (t === 'in') q = q.in(p.key, p.vals)
+        if (t === 'like') q = q.like(p.key, p.pattern)
+        if (t === 'limit') q = q.limit(p)
+        if (t === 'order') q = q.order(p.key, { ascending: p.asc })
+    }
     return q
 }
 
@@ -64,89 +41,81 @@ function parseFilters<R>(
  * Purely functional.
  */
 class DB {
-    async select<R>(
+    async select(
         table: string,
-        fields: (keyof R)[],
-        filters: Filter<R>[]
-    ): Promise<R[]> {
-        let q = supabase.from<R>(table).select(fields.join(','))
+        fields: string[],
+        filters: Filter[]
+    ): Promise<any[]> {
+        let q = supabase.from(table).select(fields.join(','))
         q = parseFilters(q, filters)
         return send(q)
     }
 
-    async selectIn<R, K extends keyof R>(
+    async selectIn(
         table: string,
-        fields: (keyof R)[],
-        key: K,
-        vals: R[K][],
-        filters: Filter<R>[]
-    ): Promise<R[]> {
-        let getRows = (chunkPiece: R[K][]): Promise<R[]> => {
+        fields: string[],
+        key: string,
+        vals: any[],
+        filters: Filter[]
+    ): Promise<any[]> {
+        let getRows = (chunkPiece: any[]): Promise<any[]> => {
             let q = supabase
-                .from<R>(table)
+                .from(table)
                 .select(fields.join(','))
                 .in(key, chunkPiece)
             q = parseFilters(q, filters)
             return send(q)
         }
-        let promises = _.chunk(vals, 100).map(getRows)
+        let promises = vals.chunk(100).map(getRows)
         let result = await Promise.all(promises)
         return result.flat()
     }
 
-    async rpc<R>(
-        fn: string,
-        param: object,
-        filters: Filter<R>[]
-    ): Promise<R[]> {
-        let q = supabase.rpc<R>(fn, param)
+    async rpc(fn: string, param: any, filters: Filter[]): Promise<any[]> {
+        let q = supabase.rpc(fn, param)
         q = parseFilters(q, filters)
         return send(q)
     }
 
-    async insert<R>(table: string, rows: Partial<R>[]): Promise<R[]> {
-        let q = supabase.from<R>(table).insert(rows)
+    async insert(table: string, rows: any[]): Promise<any[]> {
+        let q = supabase.from(table).insert(rows)
         return send(q)
     }
 
-    async update<R, K extends keyof R>(
+    async update(
         table: string,
-        idKey: K,
-        idVal: R[K],
-        row: Partial<R>
-    ): Promise<R[]> {
-        let q = supabase.from<R>(table).update(row).eq(idKey, idVal).single()
+        idKey: string,
+        idVal: any,
+        row: any
+    ): Promise<any[]> {
+        let q = supabase.from(table).update(row).eq(idKey, idVal).single()
         return sendSingle(q)
     }
 
-    async delete<R, K extends keyof R>(
-        table: string,
-        idKey: K,
-        idVal: R[K]
-    ): Promise<R[]> {
-        let q = supabase.from<R>(table).delete().eq(idKey, idVal).single()
+    async delete(table: string, idKey: string, idVal: any): Promise<any[]> {
+        let q = supabase.from(table).delete().eq(idKey, idVal).single()
         return sendSingle(q)
     }
 
-    async upsert<R, K extends keyof R>(
+    async upsert(
         table: string,
-        idKey: K,
-        row: Partial<R>,
-        conflictKeys: (keyof R)[]
-    ): Promise<R[]> {
+        idKey: string,
+        row: any,
+        conflictKeys: (string & keyof typeof row)[]
+    ): Promise<any[]> {
         let conflict: any = {}
         for (let f of conflictKeys) {
             conflict[f] = row[f]
         }
 
-        let q = supabase.from<R>(table).select('*').match(conflict)
+        let q = supabase.from(table).select('*').match(conflict)
         let data = await send(q)
 
         if (data.length > 1)
             throw 'Fail to upsert! More than 1 rows matching the conflictKeys are found!'
 
         if (data.length === 1) {
-            let id = data[0][idKey]
+            let id = data[0][idKey as keyof (typeof data)[0]]
             return await this.update(table, idKey, id, row)
         } else {
             return await this.insert(table, [row])

package/src/templates/src/utils/puppets/core/index.ts

@@ -1,12 +1,12 @@
-import { Filter } from '../type'
+import { Filter, Key } from '../type'
 import { db } from './db'
 
 /** I am responsible for transfering the state from Table to Builders.*/
 export class Core<T, R> {
     constructor(
         public tableName: string,
-        public idKey: keyof R,
-        public fields: (keyof R)[],
+        public idKey: Key<R>,
+        public fields: Key<R>[],
         public convertor: ($: R) => T
     ) {}
 
@@ -14,7 +14,7 @@ export class Core<T, R> {
         return db.select(this.tableName, this.fields, filters)
     }
 
-    async fetchSelectIn<K extends keyof R>(
+    async fetchSelectIn<K extends Key<R>>(
         key: K,
         vals: R[K][],
         filters: Filter<R>[]
@@ -38,10 +38,7 @@ export class Core<T, R> {
         return db.delete(this.tableName, this.idKey, idVal)
     }
 
-    async fetchUpsert(
-        row: Partial<R>,
-        conflictKeys: (keyof R)[]
-    ): Promise<R[]> {
+    async fetchUpsert(row: Partial<R>, conflictKeys: Key<R>[]): Promise<R[]> {
         return db.upsert(this.tableName, this.idKey, row, conflictKeys)
     }
 }

package/src/templates/src/utils/puppets/entity.ts

@@ -6,7 +6,7 @@ export function ENTITY<
     K extends string & keyof R,
     R extends InstanceType<TBase> = InstanceType<TBase>
 >(RowClass: TBase, tableName: string, idKey: K) {
-    class VIEW extends RowClass {
+    return class extends RowClass {
         constructor(...args: any[]) {
             super(...args)
             let template = args[0] ?? {}
@@ -20,26 +20,20 @@ export function ENTITY<
         static _idKey: K = idKey
 
         static _fields: any[] = Object.keys(new RowClass())
-    }
 
-    class EDIT extends VIEW {
         update(row: Partial<R>): UpdateBuilder<any, R> {
             // @ts-ignore
-            return this._hostTable.updateRow(this, row)
+            return this._hostTable.update(this[idKey], row)
         }
 
         delete(): DeleteBuilder<any, R> {
             // @ts-ignore
-            return this._hostTable.deleteRow!(this)
+            return this._hostTable.delete(this[idKey])
         }
 
         toggle(key: BooleanKeys<R>): UpdateBuilder<any, R> {
             // @ts-ignore
-            return this._hostTable.updateRow(this, { [key]: !this[key] })
+            return this._hostTable.update(this[idKey], { [key]: !this[key] })
         }
     }
-    return {
-        EDIT,
-        VIEW,
-    }
 }

package/src/templates/src/utils/puppets/table.ts

@@ -7,7 +7,7 @@ import {
     UpdateBuilder,
     UpsertBuilder,
 } from './builder'
-import { Constructor } from './type'
+import { Constructor, Key } from './type'
 import { Core } from './core'
 import { ENTITY } from './entity'
 import { reactive } from 'vue'
@@ -58,7 +58,7 @@ export function TABLE<
         return new Core<T, R>(tableName, idKey, fields, convertor(host))
     }
 
-    class Base extends Array<T> {
+    return class extends Array<T> {
         /** make reactive */
         reactive(): this {
             const rec = reactive(this) as this
@@ -71,9 +71,7 @@ export function TABLE<
 
         protected onChange(): any {}
         protected onEdit(): any {}
-    }
 
-    class TableView extends Base {
         select() {
             let callback = ($: T[]) => {
                 this.set($)
@@ -90,7 +88,7 @@ export function TABLE<
             return new SelectBuilder(core(this), callback)
         }
 
-        selectIn<K extends keyof R>(key: K, vals: R[K][]) {
+        selectIn<K extends Key<R>>(key: K, vals: R[K][]) {
             let callback = ($: T[]) => {
                 this.set($)
                 this.sortBy($ => vals.indexOf($[key]))
@@ -99,7 +97,7 @@ export function TABLE<
             return new SelectInBuilder(key, vals, core(this), callback)
         }
 
-        patchIn<K extends keyof R>(key: K, vals: R[K][]) {
+        patchIn<K extends Key<R>>(key: K, vals: R[K][]) {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
                 this.sortBy($ => vals.indexOf($[key]))
@@ -107,9 +105,7 @@ export function TABLE<
             }
             return new SelectInBuilder(key, vals, core(this), callback)
         }
-    }
 
-    class TableRPC extends Base {
         selectRPC(param: object = {}) {
             let callback = ($: T[]) => {
                 this.set($)
@@ -125,9 +121,7 @@ export function TABLE<
             }
             return new SelectRPCBuilder(param, core(this), callback)
         }
-    }
 
-    class TableEdit extends TableView {
         insert(row: Partial<R>) {
             let callback = ($: T[]) => {
                 this.push(...$)
@@ -150,11 +144,6 @@ export function TABLE<
             )
         }
 
-        updateRow(oldRow: R, updatedRow: Partial<R>) {
-            let idVal = oldRow[idKey]
-            return this.update(idVal, updatedRow)
-        }
-
         delete(idVal: R[ClassT['_idKey']]) {
             let callback = ($: T[]) => {
                 _.remove(this, $ => $[idKey] === idVal)
@@ -166,12 +155,7 @@ export function TABLE<
             )
         }
 
-        deleteRow(rowToDelete: R) {
-            let idVal = rowToDelete[idKey]
-            return this.delete(idVal)
-        }
-
-        upsert(row: Partial<R>, conflictKeys: (keyof R)[]) {
+        upsert(row: Partial<R>, conflictKeys: Key<R>[]) {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
                 this.onChange()
@@ -185,45 +169,33 @@ export function TABLE<
             ).notify('Updated!')
         }
     }
-
-    return {
-        EDIT: TableEdit,
-        VIEW: TableView,
-        RPC: TableRPC,
-    }
 }
 
 // // example
 
 // class StudentRow {
-
-//     public name: string = ""
-//     public class: string = ""
+//     public name: string = ''
+//     public class: string = ''
 //     public num: number = 0
 //     public pass: boolean = false
 //     public pasds: boolean = false
-
 // }
 
-// class Student extends Entity(StudentRow, 'student', 'num').EDIT {
-
+// class Student extends ENTITY(StudentRow, 'student', 'num') {
 //     public full = this.class + this.name
-
 // }
 
 // let s = new Student()
 // // s.ful
 // s.toggle('pass')
 
-// class StudentsCollection extends Table(Student, ['full']).EDIT {
-
+// class StudentsCollection extends TABLE(Student) {
 //     protected override onChange() {
 //         return 1
 //     }
-
 // }
 
 // let ss = new StudentsCollection()
-// ss.select().eq('num',)
-// ss.insert()
+// ss.select().eq('name', 'a')
+// ss.insert({ name: 'a' })
 // ss.delete(1)

package/src/templates/src/utils/puppets/type.ts

@@ -1,9 +1,9 @@
-export type Filter<R> =
-    | { type: 'eq'; payload: { key: keyof R; val: any } }
-    | { type: 'in'; payload: { key: keyof R; vals: any[] } }
-    | { type: 'like'; payload: { key: keyof R; pattern: string } }
+export type Filter<R = any> =
+    | { type: 'eq'; payload: { key: Key<R>; val: any } }
+    | { type: 'in'; payload: { key: Key<R>; vals: any[] } }
+    | { type: 'like'; payload: { key: Key<R>; pattern: string } }
     | { type: 'limit'; payload: number }
-    | { type: 'order'; payload: { key: keyof R; asc: boolean } }
+    | { type: 'order'; payload: { key: Key<R>; asc: boolean } }
 
 export type Constructor<T extends object = {}> = new (...args: any[]) => T
 
@@ -11,3 +11,5 @@ export type BooleanKeys<T> = {
     [k in keyof T]: T[k] extends boolean ? k : never
 }[keyof T]
 // type OnlyBoolean<T> = { [k in BooleanKeys<T>]: boolean }
+
+export type Key<R> = string & keyof R

package/src/templates/src/utils/supabase.ts

@@ -1,130 +1,130 @@
-import {
-    createClient,
-    PostgrestError,
-    SupabaseClient,
-} from '@supabase/supabase-js'
-import { qDialog } from './dialog'
+// import {
+//     createClient,
+//     PostgrestError,
+//     SupabaseClient,
+// } from '@supabase/supabase-js'
+// import { qDialog } from './dialog'
 
-export type {
-    PostgrestFilterBuilder,
-    PostgrestSingleResponse,
-} from '@supabase/postgrest-js'
+// export type {
+//     PostgrestFilterBuilder,
+//     PostgrestSingleResponse,
+// } from '@supabase/postgrest-js'
 
-declare module '@supabase/supabase-js' {
-    interface SupabaseClient {
-        signIn: () => void
-        accessTokenLife: () => number
-        waitForSignin: () => Promise<void>
-        email: () => string
-        call: <T>(fn: string, params?: object | undefined) => Promise<T[]>
-        callSingle: <T>(fn: string, params?: object | undefined) => Promise<T>
-    }
-}
+// declare module '@supabase/supabase-js' {
+//     interface SupabaseClient {
+//         signIn: () => void
+//         accessTokenLife: () => number
+//         waitForSignin: () => Promise<void>
+//         email: () => string
+//         call: <T>(fn: string, params?: object | undefined) => Promise<T[]>
+//         callSingle: <T>(fn: string, params?: object | undefined) => Promise<T>
+//     }
+// }
 
-export let supabase: SupabaseClient
-let SUPABASE_URL = process.env.SUPABASE_URL
-let SUPABASE_KEY = process.env.SUPABASE_KEY
+// export let supabase: SupabaseClient
+// let SUPABASE_URL = process.env.SUPABASE_URL
+// let SUPABASE_KEY = process.env.SUPABASE_KEY
 
-if (SUPABASE_URL && SUPABASE_KEY) {
-    supabase = createClient(SUPABASE_URL, SUPABASE_KEY, {
-        autoRefreshToken: true,
-    })
+// if (SUPABASE_URL && SUPABASE_KEY) {
+//     supabase = createClient(SUPABASE_URL, SUPABASE_KEY, {
+//         autoRefreshToken: true,
+//     })
 
-    supabase.signIn = async () => {
-        await supabase.auth.signOut()
-        await supabase.auth.signIn(
-            { provider: 'google' },
-            { redirectTo: window.location.href }
-        )
-    }
+//     supabase.signIn = async () => {
+//         await supabase.auth.signOut()
+//         await supabase.auth.signIn(
+//             { provider: 'google' },
+//             { redirectTo: window.location.href }
+//         )
+//     }
 
-    supabase.accessTokenLife = () => {
-        const session = supabase.auth.session()
-        if (session?.expires_at === undefined) return -999999
-        const expireAt = new Date(session.expires_at * 1000)
-        const ms = expireAt.getTime() - new Date().getTime() // ms
-        return Math.round(ms / 1000)
-    }
+//     supabase.accessTokenLife = () => {
+//         const session = supabase.auth.session()
+//         if (session?.expires_at === undefined) return -999999
+//         const expireAt = new Date(session.expires_at * 1000)
+//         const ms = expireAt.getTime() - new Date().getTime() // ms
+//         return Math.round(ms / 1000)
+//     }
 
-    supabase.auth.onAuthStateChange((event, session) => {
-        console.log('[SUPABASE AUTH]', event, session?.user?.email)
-    })
+//     supabase.auth.onAuthStateChange((event, session) => {
+//         console.log('[SUPABASE AUTH]', event, session?.user?.email)
+//     })
 
-    supabase.waitForSignin = async function (): Promise<void> {
-        setInterval(() => {
-            if (supabase.auth.session() === null) supabase.signIn()
-        }, 1000)
-        await waitFor(
-            () => supabase.auth.session() !== null,
-            '[Wait for SignIn] waiting...',
-            '[Wait for SignIn] DONE!'
-        )
-    }
+//     supabase.waitForSignin = async function (): Promise<void> {
+//         setInterval(() => {
+//             if (supabase.auth.session() === null) supabase.signIn()
+//         }, 1000)
+//         await waitFor(
+//             () => supabase.auth.session() !== null,
+//             '[Wait for SignIn] waiting...',
+//             '[Wait for SignIn] DONE!'
+//         )
+//     }
 
-    supabase.call = async function <T>(
-        fn: string,
-        params?: object | undefined
-    ): Promise<T[]> {
-        let { data, error } = await supabase.rpc<T>(fn, params)
-        HANDLE_ERROR(data, error)
-        return data
-    }
+//     supabase.call = async function <T>(
+//         fn: string,
+//         params?: object | undefined
+//     ): Promise<T[]> {
+//         let { data, error } = await supabase.rpc<T>(fn, params)
+//         HANDLE_ERROR(data, error)
+//         return data
+//     }
 
-    supabase.callSingle = async function <T>(
-        fn: string,
-        params?: object | undefined
-    ): Promise<T> {
-        let { data, error } = await supabase.rpc<T>(fn, params).single()
-        HANDLE_ERROR(data, error)
-        return data
-    }
+//     supabase.callSingle = async function <T>(
+//         fn: string,
+//         params?: object | undefined
+//     ): Promise<T> {
+//         let { data, error } = await supabase.rpc<T>(fn, params).single()
+//         HANDLE_ERROR(data, error)
+//         return data
+//     }
 
-    supabase.email = function (): string {
-        return supabase.auth.user()?.email ?? 'unauthenticated'
-    }
-}
+//     supabase.email = function (): string {
+//         return supabase.auth.user()?.email ?? 'unauthenticated'
+//     }
+// }
 
-export function HANDLE_ERROR<T>(
-    data: T[] | T | null,
-    error: PostgrestError | null
-): asserts data {
-    if (error) {
-        if (error.message === 'JWSError JWSInvalidSignature') {
-            localStorage.removeItem('supabase.auth.token')
-            qDialog.error(
-                'Database Error!',
-                'Your login session has expired. Please try refreshing the website.'
-            )
-            throw error
-        }
-        let msg = ''
-        msg += error.details ?? '' + '<br/>'
-        msg += error.message ?? '' + '<br/>'
-        msg += error.hint ?? ''
-        qDialog.error('Database Error!', msg)
-        throw error
-    }
-    if (data === null) {
-        qDialog.error('Supabase Error!', 'Returned data is null')
-        throw 'supabase return data is null!'
-    }
-}
+// export function HANDLE_ERROR<T>(
+//     data: T[] | T | null,
+//     error: PostgrestError | null
+// ): asserts data {
+//     if (error) {
+//         if (error.message === 'JWSError JWSInvalidSignature') {
+//             localStorage.removeItem('supabase.auth.token')
+//             qDialog.error(
+//                 'Database Error!',
+//                 'Your login session has expired. Please try refreshing the website.'
+//             )
+//             throw error
+//         }
+//         let msg = ''
+//         msg += error.details ?? '' + '<br/>'
+//         msg += error.message ?? '' + '<br/>'
+//         msg += error.hint ?? ''
+//         qDialog.error('Database Error!', msg)
+//         throw error
+//     }
+//     if (data === null) {
+//         qDialog.error('Supabase Error!', 'Returned data is null')
+//         throw 'supabase return data is null!'
+//     }
+// }
 
-async function waitFor(
-    predicate: () => boolean,
-    waitingMsg: string,
-    doneMsg: string
-) {
-    return new Promise(resolve => {
-        function checker() {
-            if (predicate()) {
-                console.log(doneMsg)
-                resolve(true)
-            } else {
-                console.log(waitingMsg)
-                setTimeout(() => checker(), 50)
-            }
-        }
-        checker()
-    })
-}
+// async function waitFor(
+//     predicate: () => boolean,
+//     waitingMsg: string,
+//     doneMsg: string
+// ) {
+//     return new Promise(resolve => {
+//         function checker() {
+//             if (predicate()) {
+//                 console.log(doneMsg)
+//                 resolve(true)
+//             } else {
+//                 console.log(waitingMsg)
+//                 setTimeout(() => checker(), 50)
+//             }
+//         }
+//         checker()
+//     })
+// }

package/src/templates/src/utils/supabase2.ts

@@ -1,128 +1,116 @@
-// import {
-//     createClient,
-//     PostgrestError,
-//     SupabaseClient,
-//     Session,
-//     SupabaseClientOptions,
-// } from '@supabase/supabase-js'
-// import { qDialog } from './dialog'
+import {
+    createClient,
+    PostgrestError,
+    SupabaseClient,
+    Session,
+    SupabaseClientOptions,
+} from '@supabase/supabase-js'
+import { qDialog } from './dialog'
 
-// export type {
-//     PostgrestFilterBuilder,
-//     PostgrestSingleResponse,
-// } from '@supabase/postgrest-js'
+export type {
+    PostgrestFilterBuilder,
+    PostgrestSingleResponse,
+} from '@supabase/postgrest-js'
 
-// let SUPABASE_URL = process.env.SUPABASE_URL ?? ''
-// let SUPABASE_KEY = process.env.SUPABASE_KEY ?? ''
+let SUPABASE_URL = process.env.SUPABASE_URL ?? ''
+let SUPABASE_KEY = process.env.SUPABASE_KEY ?? ''
 
-// export class MySupabaseClient<Database> extends SupabaseClient<Database> {
-//     email: string = 'unauthenticated'
-//     session: Session | null = null
+export class MySupabaseClient extends SupabaseClient {
+    email: string = 'unauthenticated'
+    session: Session | null = null
 
-//     constructor() {
-//         super(SUPABASE_URL, SUPABASE_KEY, {
-//             auth: {
-//                 autoRefreshToken: true,
-//                 persistSession: true,
-//                 detectSessionInUrl: true,
-//             },
-//         })
-//         this.auth.onAuthStateChange((event, session) => {
-//             console.log('[SUPABASE AUTH]', event, session?.user?.email)
-//             this.session = session
-//             this.email = session?.user?.email ?? 'unauthenticated'
-//         })
-//     }
+    constructor() {
+        super(SUPABASE_URL, SUPABASE_KEY, {
+            auth: {
+                autoRefreshToken: true,
+                persistSession: true,
+                detectSessionInUrl: true,
+            },
+        })
+        this.auth.onAuthStateChange((event, session) => {
+            console.log('[SUPABASE AUTH]', event, session?.user?.email)
+            this.session = session
+            this.email = session?.user?.email ?? 'unauthenticated'
+        })
+    }
 
-//     async signIn() {
-//         await this.auth.signOut()
-//         await this.auth.signInWithOAuth({
-//             provider: 'google',
-//             options: {
-//                 redirectTo: window.location.href,
-//             },
-//         })
-//     }
+    async signIn() {
+        await this.auth.signOut()
+        await this.auth.signInWithOAuth({
+            provider: 'google',
+            options: {
+                redirectTo: window.location.href,
+            },
+        })
+    }
 
-//     async call<T>(fn: string, params?: object | undefined): Promise<T[]> {
-//         let { data, error } = await this.rpc<string, any>(fn, params)
-//         HANDLE_ERROR(data, error)
-//         return data
-//     }
+    async call<T>(fn: string, params?: object | undefined): Promise<T[]> {
+        let { data, error } = await this.rpc<string, any>(fn, params)
+        HANDLE_ERROR(data, error)
+        return data
+    }
 
-//     async callSingle<T>(fn: string, params?: object | undefined): Promise<T> {
-//         let { data, error } = await this.rpc<string, any>(fn, params).single()
-//         HANDLE_ERROR(data, error)
-//         return data as T
-//     }
+    async callSingle<T>(fn: string, params?: object | undefined): Promise<T> {
+        let { data, error } = await this.rpc<string, any>(fn, params).single()
+        HANDLE_ERROR(data, error)
+        return data as T
+    }
 
-//     async waitForSignin(): Promise<void> {
-//         setInterval(() => {
-//             if (this.session === null) this.signIn()
-//         }, 1000)
-//         waitFor(
-//             () => this.session !== null,
-//             '[Wait for SignIn] waiting...',
-//             '[Wait for SignIn] DONE!'
-//         )
-//     }
-// }
+    async waitForSignin(): Promise<void> {
+        setInterval(() => {
+            if (this.session === null) this.signIn()
+        }, 1000)
+        waitFor(
+            () => this.session !== null,
+            '[Wait for SignIn] waiting...',
+            '[Wait for SignIn] DONE!'
+        )
+    }
+}
 
-// // export let supabase: MySupabaseClient
-// // let SUPABASE_URL = process.env.SUPABASE_URL
-// // let SUPABASE_KEY = process.env.SUPABASE_KEY
+export let supabase = new MySupabaseClient()
 
-// // if (SUPABASE_URL && SUPABASE_KEY) {
-// //     supabase = new MySupabaseClient(SUPABASE_URL, SUPABASE_KEY, {
-// //         auth: {
-// //             autoRefreshToken: true,
-// //             persistSession: true,
-// //             detectSessionInUrl: true,
-// //         },
-// //     })
-// // }
+export function HANDLE_ERROR<T>(
+    data: T[] | T | null,
+    error: PostgrestError | null
+): asserts data {
+    if (error) {
+        if (error.message === 'JWSError JWSInvalidSignature') {
+            localStorage.removeItem('supabase.auth.token')
+            qDialog.error(
+                'Database Error!',
+                'Your login session has expired. Please try refreshing the website.'
+            )
+            throw error
+        }
+        let msg = ''
+        msg += error.details ?? '' + '<br/>'
+        msg += error.message ?? '' + '<br/>'
+        msg += error.hint ?? ''
+        qDialog.error('Database Error!', msg)
+        throw error
+    }
+    if (data === null) {
+        qDialog.error('Supabase Error!', 'Returned data is null')
+        throw 'supabase return data is null!'
+    }
+}
 
-// export function HANDLE_ERROR<T>(
-//     data: T[] | T | null,
-//     error: PostgrestError | null
-// ): asserts data {
-//     if (error) {
-//         if (error.message === 'JWSError JWSInvalidSignature') {
-//             localStorage.removeItem('supabase.auth.token')
-//             qDialog.error(
-//                 'Database Error!',
-//                 'Your login session has expired. Please try refreshing the website.'
-//             )
-//             throw error
-//         }
-//         let msg = ''
-//         msg += error.details ?? '' + '<br/>'
-//         msg += error.message ?? '' + '<br/>'
-//         msg += error.hint ?? ''
-//         qDialog.error('Database Error!', msg)
-//         throw error
-//     }
-//     if (data === null) {
-//         qDialog.error('Supabase Error!', 'Returned data is null')
-//         throw 'supabase return data is null!'
-//     }
-// }
-
-// async function waitFor(
-//     predicate: () => boolean,
-//     waitingMsg: string,
-//     doneMsg: string
-// ) {
-//     return new Promise(resolve => {
-//         async function checker() {
-//             if (predicate()) {
-//                 console.log(doneMsg)
-//                 resolve(true)
-//             } else {
-//                 console.log(waitingMsg)
-//                 setTimeout(checker, 50)
-//             }
-//         }
-//         checker()
-//     })
-// }
+async function waitFor(
+    predicate: () => boolean,
+    waitingMsg: string,
+    doneMsg: string
+) {
+    return new Promise(resolve => {
+        async function checker() {
+            if (predicate()) {
+                console.log(doneMsg)
+                resolve(true)
+            } else {
+                console.log(waitingMsg)
+                setTimeout(checker, 50)
+            }
+        }
+        checker()
+    })
+}

package/src/templates/src/utils/settings.ts

@@ -1,20 +0,0 @@
-import { reactive, effect } from '@vue/reactivity'
-
-function getFromLocal<T extends object>(key: string): T {
-    let val = localStorage.getItem(key)
-    return val === null ? {} : JSON.parse(val)
-}
-
-export function localSettings<T extends object>(
-    preset: T,
-    localStorageKey = 'settings'
-): T {
-    let ss = reactive({ ...preset, ...getFromLocal<T>(localStorageKey) })
-    effect(() => {
-        localStorage.setItem('settings', JSON.stringify(ss))
-        for (let k in ss) {
-            let val = ss[k]
-        }
-    })
-    return ss as T
-}