@d-mok/quasar-app-extension-quasar-axe 2.0.25 → 2.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@d-mok/quasar-app-extension-quasar-axe",
-    "version": "2.0.25",
+    "version": "2.1.2",
     "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",
@@ -24,6 +24,7 @@
         "jszip": "^3.9.0",
         "lodash": "^4.17.21",
         "papaparse": "^5.3.2",
+        "sapphire-js": "^2.0.3",
         "vuedraggable": "^4.1.0"
     },
     "devDependencies": {

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

@@ -1,11 +1,8 @@
+import 'sapphire-js'
+
 export { qDialog } from './dialog'
 export * as qNotify from './notify'
 
-export { Sheet, List } from './sapphire'
-
-import * as lo from 'lodash'
-export const _ = lo
-
 export { HANDLE_ERROR, supabase } from './supabase'
 
 export { localSettings } from './settings'

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

@@ -1,41 +1,27 @@
-
 import { Core } from '../core'
 import { Filter } from '../type'
 import { ui } from './ui'
 
-
-
 type Promisable<T> = T | PromiseLike<T>
 
+type onfulfilled<T, U> = ((value: T) => Promisable<U>) | undefined | null
 
-
-type onfulfilled<T, U> =
-    | ((value: T) => Promisable<U>)
-    | undefined
-    | null
-
-type onrejected<U> =
-    | ((reason: any) => Promisable<U>)
-    | undefined
-    | null
-
-
+type onrejected<U> = ((reason: any) => Promisable<U>) | undefined | null
 
 abstract class BuilderUI {
-
     private isSlience: boolean = false
     private isConfirm: boolean = false
-    private confirmContent: { title: string, msg: string } = { title: '', msg: '' }
+    private confirmContent: { title: string; msg: string } = {
+        title: '',
+        msg: '',
+    }
     private isNotify: boolean = false
     private notifyContent: string = ''
 
-
     protected abstract dataLogic(): Promise<void>
 
-
     protected async run() {
-        if (this.isSlience)
-            ui.loadingOff()
+        if (this.isSlience) ui.loadingOff()
 
         if (this.isConfirm) {
             let { title, msg } = this.confirmContent
@@ -44,21 +30,17 @@ abstract class BuilderUI {
 
         await this.dataLogic()
 
-        if (this.isNotify)
-            ui.onNotify(this.notifyContent)
+        if (this.isNotify) ui.onNotify(this.notifyContent)
 
-        if (this.isSlience)
-            ui.loadingOn()
+        if (this.isSlience) ui.loadingOn()
     }
 
-
     confirm(title: string, ...msgs: string[]): this {
         this.isConfirm = true
         this.confirmContent = { title, msg: msgs.join('<br/>') }
         return this
     }
 
-
     notify(msg: string): this {
         this.isNotify = true
         this.notifyContent = msg
@@ -75,22 +57,20 @@ abstract class BuilderUI {
         this.isNotify = false
         return this
     }
-
 }
 
-
 abstract class Builder<T, R> extends BuilderUI implements PromiseLike<void> {
-
     constructor(
         protected core: Core<T, R>,
-        private callback: (objs: T[]) => void,
-    ) { super() }
+        private callback: (objs: T[]) => void
+    ) {
+        super()
+    }
 
     protected abstract logType: string
 
     protected abstract fetch(): Promise<R[]>
 
-
     protected override async dataLogic(): Promise<void> {
         let data = await this.fetch()
         let entities = data.map($ => this.core.convertor($))
@@ -98,18 +78,15 @@ abstract class Builder<T, R> extends BuilderUI implements PromiseLike<void> {
         ui.log(this.core.tableName, this.logType, entities)
     }
 
-
-    async then<Y, N>(onfulfilled?: onfulfilled<void, Y>, onrejected?: onrejected<N>): Promise<Y | N> {
+    async then<Y, N>(
+        onfulfilled?: onfulfilled<void, Y>,
+        onrejected?: onrejected<N>
+    ): Promise<Y | N> {
         return this.run().then(onfulfilled, onrejected)
     }
-
 }
 
-
-
-
-abstract class FilterBuilder<T, R> extends Builder<T, R>{
-
+abstract class FilterBuilder<T, R> extends Builder<T, R> {
     protected filters: Filter<R>[] = []
 
     eq<K extends keyof R>(key: K, val: R[K]): this {
@@ -127,43 +104,36 @@ abstract class FilterBuilder<T, R> extends Builder<T, R>{
         return this
     }
 
-
     limit(count: number): this {
         this.filters.push({ type: 'limit', payload: count })
         return this
     }
 
-
     order<K extends keyof R>(key: K, ascending: boolean = true): this {
         this.filters.push({ type: 'order', payload: { key, asc: ascending } })
         return this
     }
-
-
 }
 
-
-export class SelectBuilder<T, R> extends FilterBuilder<T, R>{
-
+export class SelectBuilder<T, R> extends FilterBuilder<T, R> {
     protected logType = 'select'
 
     protected override async fetch() {
         return this.core.fetchSelect(this.filters)
     }
-
 }
 
-
-
-export class SelectInBuilder<T, R, K extends keyof R> extends FilterBuilder<T, R>{
-
+export class SelectInBuilder<T, R, K extends keyof R> extends FilterBuilder<
+    T,
+    R
+> {
     protected logType = 'selectIn'
 
     constructor(
         private key: K,
         private vals: R[K][],
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -171,18 +141,15 @@ export class SelectInBuilder<T, R, K extends keyof R> extends FilterBuilder<T, R
     protected override async fetch() {
         return this.core.fetchSelectIn(this.key, this.vals, this.filters)
     }
-
 }
 
-
-export class SelectRPCBuilder<T, R> extends FilterBuilder<T, R>{
-
+export class SelectRPCBuilder<T, R> extends FilterBuilder<T, R> {
     protected logType = 'rpc'
 
     constructor(
         private param: object,
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -190,20 +157,15 @@ export class SelectRPCBuilder<T, R> extends FilterBuilder<T, R>{
     protected override async fetch() {
         return this.core.fetchRPC(this.param, this.filters)
     }
-
 }
 
-
-
-
-export class InsertBuilder<T, R> extends Builder<T, R>{
-
+export class InsertBuilder<T, R> extends Builder<T, R> {
     protected logType = 'insert'
 
     constructor(
         private rows: Partial<R>[],
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -211,20 +173,16 @@ export class InsertBuilder<T, R> extends Builder<T, R>{
     protected override async fetch() {
         return this.core.fetchInsert(this.rows)
     }
-
 }
 
-
-
-export class UpdateBuilder<T, R> extends Builder<T, R>{
-
+export class UpdateBuilder<T, R> extends Builder<T, R> {
     protected logType = 'update'
 
     constructor(
         private idVal: R[keyof R],
         private row: Partial<R>,
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -232,19 +190,15 @@ export class UpdateBuilder<T, R> extends Builder<T, R>{
     protected override async fetch() {
         return this.core.fetchUpdate(this.idVal, this.row)
     }
-
 }
 
-
-
-export class DeleteBuilder<T, R> extends Builder<T, R>{
-
+export class DeleteBuilder<T, R> extends Builder<T, R> {
     protected logType = 'delete'
 
     constructor(
         private idVal: R[keyof R],
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -252,23 +206,16 @@ export class DeleteBuilder<T, R> extends Builder<T, R>{
     protected override async fetch() {
         return this.core.fetchDelete(this.idVal)
     }
-
 }
 
-
-
-
-
-
-export class UpsertBuilder<T, R> extends Builder<T, R>{
-
+export class UpsertBuilder<T, R> extends Builder<T, R> {
     protected logType = 'upsert'
 
     constructor(
         private row: Partial<R>,
         private conflictKeys: (keyof R)[],
         core: Core<T, R>,
-        callback: (objs: T[]) => void,
+        callback: (objs: T[]) => void
     ) {
         super(core, callback)
     }
@@ -276,6 +223,4 @@ export class UpsertBuilder<T, R> extends Builder<T, R>{
     protected override async fetch() {
         return this.core.fetchUpsert(this.row, this.conflictKeys)
     }
-
 }
-

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

@@ -2,20 +2,17 @@ import { qDialog } from '../..'
 import { qNotify } from '../..'
 import { LoadingBar } from 'quasar'
 
-
 /**
  * I am responsible for providing UI interaction functions using Quasar.
  * Purely functional.
  */
 class UI {
-
-
     loadingOff(): void {
-        LoadingBar.setDefaults({ size: "0px" })
+        LoadingBar.setDefaults({ size: '0px' })
     }
 
     loadingOn(): void {
-        setTimeout(() => LoadingBar.setDefaults({ size: "5px" }), 3000)
+        setTimeout(() => LoadingBar.setDefaults({ size: '5px' }), 3000)
     }
 
     onConfirm(title: string, msg: string): Promise<void> {
@@ -27,11 +24,8 @@ class UI {
     }
 
     log(table: string, type: string, data: any[]): void {
-        if (process.env.DEBUGGING)
-            console.log(`[${table}] ${type}`, data)
+        if (process.env.DEBUGGING) console.log(`[${table}] ${type}`, data)
     }
-
-
 }
 
 export const ui = new UI()

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

@@ -1,23 +1,24 @@
 import { Filter } 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 convertor: ($: R) => T
-    ) { }
+    ) {}
 
     async fetchSelect(filters: Filter<R>[]): Promise<R[]> {
         return db.select(this.tableName, this.fields, filters)
     }
 
-    async fetchSelectIn<K extends keyof R>(key: K, vals: R[K][], filters: Filter<R>[]): Promise<R[]> {
+    async fetchSelectIn<K extends keyof R>(
+        key: K,
+        vals: R[K][],
+        filters: Filter<R>[]
+    ): Promise<R[]> {
         return db.selectIn(this.tableName, this.fields, key, vals, filters)
     }
 
@@ -37,11 +38,10 @@ 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: (keyof R)[]
+    ): Promise<R[]> {
         return db.upsert(this.tableName, this.idKey, row, conflictKeys)
     }
-
-
 }
-
-

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

@@ -1,19 +1,12 @@
 import { DeleteBuilder, UpdateBuilder } from './builder'
 import { Constructor, BooleanKeys } from './type'
 
-
 export function ENTITY<
     TBase extends Constructor,
     K extends string & keyof R,
     R extends InstanceType<TBase> = InstanceType<TBase>
->(
-    RowClass: TBase,
-    tableName: string,
-    idKey: K
-) {
-
+>(RowClass: TBase, tableName: string, idKey: K) {
     class VIEW extends RowClass {
-
         constructor(...args: any[]) {
             super(...args)
             let template = args[0] ?? {}
@@ -27,13 +20,9 @@ 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)
@@ -48,13 +37,9 @@ export function ENTITY<
             // @ts-ignore
             return this._hostTable.updateRow(this, { [key]: !this[key] })
         }
-
-
     }
     return {
         EDIT,
-        VIEW
+        VIEW,
     }
 }
-
-

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

@@ -1,3 +1,2 @@
 export { ENTITY } from './entity'
 export { TABLE } from './table'
-

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

@@ -1,4 +1,3 @@
-import { Criteria, Ordering, Sheet } from '../sapphire'
 import {
     DeleteBuilder,
     InsertBuilder,
@@ -12,6 +11,7 @@ import { Constructor } from './type'
 import { Core } from './core'
 import { ENTITY } from './entity'
 import { reactive } from 'vue'
+import _ from 'lodash'
 
 type imprinted<R extends object> = {
     _RowClass: Constructor
@@ -38,7 +38,7 @@ export function TABLE<
     ClassT extends EntityClass<T, R>,
     R extends RowOf<ClassT> = RowOf<ClassT>,
     T extends R = InstanceType<ClassT>
->(EntityClass: ClassT, ordering: Ordering<InstanceType<ClassT>> = []) {
+>(EntityClass: ClassT) {
     const tableName: string = EntityClass._tableName
     const idKey: ClassT['_idKey'] = EntityClass._idKey
     const fields: any[] = EntityClass._fields
@@ -58,24 +58,7 @@ export function TABLE<
         return new Core<T, R>(tableName, idKey, fields, convertor(host))
     }
 
-    class Base extends Sheet<T> {
-        protected reorder() {
-            this.order(...ordering)
-        }
-
-        /** Get an item by `criteria`. If not found, throw error. */
-        got(criteria: Criteria<T>): T {
-            let obj = this.get(criteria)
-            if (obj === undefined) {
-                throw (
-                    EntityClass.name +
-                    ' has no element matching ' +
-                    JSON.stringify(criteria)
-                )
-            }
-            return obj
-        }
-
+    class Base extends Array<T> {
         /** make reactive */
         reactive(): this {
             const rec = reactive(this) as this
@@ -91,16 +74,9 @@ export function TABLE<
     }
 
     class TableView extends Base {
-        private orderByList<K extends keyof R>(key: K, vals: R[K][]) {
-            ordering.length > 0
-                ? this.reorder()
-                : this.order({ [key]: vals } as any)
-        }
-
         select() {
             let callback = ($: T[]) => {
                 this.set($)
-                this.reorder()
                 this.onChange()
             }
             return new SelectBuilder(core(this), callback)
@@ -109,7 +85,6 @@ export function TABLE<
         patch() {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
-                this.reorder()
                 this.onChange()
             }
             return new SelectBuilder(core(this), callback)
@@ -118,7 +93,7 @@ export function TABLE<
         selectIn<K extends keyof R>(key: K, vals: R[K][]) {
             let callback = ($: T[]) => {
                 this.set($)
-                this.orderByList(key, vals)
+                this.sortBy($ => vals.indexOf($[key]))
                 this.onChange()
             }
             return new SelectInBuilder(key, vals, core(this), callback)
@@ -127,7 +102,7 @@ export function TABLE<
         patchIn<K extends keyof R>(key: K, vals: R[K][]) {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
-                this.orderByList(key, vals)
+                this.sortBy($ => vals.indexOf($[key]))
                 this.onChange()
             }
             return new SelectInBuilder(key, vals, core(this), callback)
@@ -138,7 +113,6 @@ export function TABLE<
         selectRPC(param: object = {}) {
             let callback = ($: T[]) => {
                 this.set($)
-                this.reorder()
                 this.onChange()
             }
             return new SelectRPCBuilder(param, core(this), callback)
@@ -147,7 +121,6 @@ export function TABLE<
         patchRPC(param: object = {}) {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
-                this.reorder()
                 this.onChange()
             }
             return new SelectRPCBuilder(param, core(this), callback)
@@ -158,7 +131,6 @@ export function TABLE<
         insert(row: Partial<R>) {
             let callback = ($: T[]) => {
                 this.push(...$)
-                this.reorder()
                 this.onChange()
                 this.onEdit()
             }
@@ -170,7 +142,6 @@ export function TABLE<
         update(idVal: R[ClassT['_idKey']], row: Partial<R>) {
             let callback = ($: T[]) => {
                 this.merge($, idKey)
-                this.reorder()
                 this.onChange()
                 this.onEdit()
             }
@@ -186,8 +157,7 @@ export function TABLE<
 
         delete(idVal: R[ClassT['_idKey']]) {
             let callback = ($: T[]) => {
-                this.discard({ [idKey]: idVal } as any)
-                this.reorder()
+                _.remove(this, $ => $[idKey] === idVal)
                 this.onChange()
                 this.onEdit()
             }
@@ -204,7 +174,6 @@ export function TABLE<
         upsert(row: Partial<R>, conflictKeys: (keyof R)[]) {
             let callback = ($: T[]) => {
                 this.absorb($, idKey)
-                this.reorder()
                 this.onChange()
                 this.onEdit()
             }

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

@@ -1,17 +1,13 @@
-
 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 } }
-    | { type: 'limit', payload: number }
-    | { type: 'order', payload: { key: keyof R, asc: boolean } }
-
-
-
-
+    | { type: 'eq'; payload: { key: keyof R; val: any } }
+    | { type: 'in'; payload: { key: keyof R; vals: any[] } }
+    | { type: 'like'; payload: { key: keyof R; pattern: string } }
+    | { type: 'limit'; payload: number }
+    | { type: 'order'; payload: { key: keyof R; asc: boolean } }
 
 export type Constructor<T extends object = {}> = new (...args: any[]) => T
 
-
-export type BooleanKeys<T> = { [k in keyof T]: T[k] extends boolean ? k : never }[keyof T]
+export type BooleanKeys<T> = {
+    [k in keyof T]: T[k] extends boolean ? k : never
+}[keyof T]
 // type OnlyBoolean<T> = { [k in BooleanKeys<T>]: boolean }