terrier-engine 4.4.0 → 4.4.3

package/data-dive/dd-app.ts

@@ -0,0 +1,45 @@
+import {NoState, PartTag} from "tuff-core/parts"
+import {TerrierApp} from "../terrier/app"
+import {RouterPart} from "tuff-core/routing"
+import {routes} from "./dd-routes"
+import {DiveListPage} from "./dives/dive-list"
+import {Logger} from "tuff-core/logging"
+import DdSession from "./dd-session"
+
+Logger.level = 'debug'
+
+class ContentRouterPart extends RouterPart {
+    get defaultPart() {
+        return DiveListPage
+    }
+
+    get routes() {
+        return routes
+    }
+
+}
+
+export default class DdApp extends TerrierApp<NoState> {
+
+    contentPart!: ContentRouterPart
+    session!: DdSession
+
+    async init() {
+        await super.init()
+        this.contentPart = this.makePart(ContentRouterPart, {})
+
+        this.session = await DdSession.get()
+
+        this.dirty()
+    }
+
+    get parentClasses(): Array<string> {
+        return ['tt-typography']
+    }
+
+    render(parent: PartTag) {
+        parent.part(this.contentPart)
+        parent.part(this.overlayPart)
+    }
+
+}

package/data-dive/dd-db.ts

@@ -0,0 +1,12 @@
+import DbClient from "../terrier/db-client"
+import {ModelIncludesMap, PersistedModelTypeMap, UnpersistedModelTypeMap} from "./gen/models"
+
+/**
+ * DbClient specifically for the data-dive database.
+ */
+class DdDb extends DbClient<PersistedModelTypeMap, UnpersistedModelTypeMap, ModelIncludesMap> {
+}
+
+export default function Db() {
+    return new DdDb()
+}

package/data-dive/dd-routes.ts

@@ -0,0 +1,10 @@
+import {partRoute} from "tuff-core/routing"
+import {stringParser} from 'typesafe-routes'
+import {DiveListPage} from "./dives/dive-list"
+import {DiveEditorPage} from "./dives/dive-editor"
+
+
+export const routes = {
+    list: partRoute(DiveListPage, '/data_dive', {}),
+    editor: partRoute(DiveEditorPage, '/data_dive/editor/:id', {id: stringParser})
+}

package/data-dive/dd-session.ts

@@ -0,0 +1,45 @@
+import {DdUser} from "./dd-user"
+import Api from "../terrier/api"
+import {DdDiveGroup} from "./gen/models"
+import {arrays} from "tuff-core";
+import {SelectOptions} from "tuff-core/forms"
+
+
+type DdSessionData = {
+    user: DdUser
+    groupMap: Record<string, DdDiveGroup>
+}
+
+/**
+ * Stores authentication information as well as various options from the server.
+ */
+export default class DdSession {
+
+    constructor(readonly data: DdSessionData) {
+    }
+
+    get user(): DdUser {
+        return this.data.user
+    }
+
+    get isSuper(): boolean {
+        return this.user.role == 'super'
+    }
+
+    groupsInOrder(): DdDiveGroup[] {
+        return arrays.sortBy(Object.values(this.data.groupMap), 'name')
+    }
+
+    groupOptions(): SelectOptions {
+        return this.groupsInOrder().map(g => {
+            return {title: g.name, value: g.id}
+        })
+    }
+
+    static async get(): Promise<DdSession> {
+        const data = await Api.safeGet<DdSessionData>("/data_dive/user_session.json", {})
+        return new DdSession(data)
+    }
+
+
+}

package/data-dive/dd-user.ts

@@ -0,0 +1,12 @@
+
+/**
+ * We don't know what the users will look like,
+ * so we'll just use a stub.
+ */
+export type DdUser = {
+    id: string
+    role: string
+    first_name?: string
+    last_name?: string
+    name?: string
+}

package/data-dive/dives/dive-editor.ts

@@ -0,0 +1,244 @@
+import Schema, {SchemaDef} from "../../terrier/schema"
+import {PartTag} from "tuff-core/parts"
+import Dives from "./dives"
+import {Query, QueryModelPicker} from "../queries/queries"
+import QueryEditor from "../queries/query-editor"
+import {Logger} from "tuff-core/logging"
+import QueryForm from "../queries/query-form"
+import {arrays, messages} from "tuff-core"
+import {TabContainerPart} from "../../terrier/tabs"
+import PagePart from "../../terrier/parts/page-part"
+import ContentPart from "../../terrier/parts/content-part"
+import {ModalPart} from "../../terrier/modals"
+import {DdDive} from "../gen/models"
+import Ids from "../../terrier/ids"
+import Db from "../dd-db"
+import DdSession from "../dd-session"
+import {DiveRunModal} from "./dive-runs";
+
+const log = new Logger("DiveEditor")
+
+
+////////////////////////////////////////////////////////////////////////////////
+// Editor
+////////////////////////////////////////////////////////////////////////////////
+
+export type DiveEditorState = {
+    schema: SchemaDef
+    dive: DdDive
+}
+
+export default class DiveEditor extends ContentPart<DiveEditorState> {
+
+    tabs!: TabContainerPart
+
+    newQueryKey = messages.untypedKey()
+
+    queries = new Array<Query>()
+
+    async init() {
+        this.tabs = this.makePart(TabContainerPart, {side: 'top'})
+
+        this.tabs.setBeforeAction({
+            title: 'Queries:',
+            icon: 'glyp-data_dive_query'
+        })
+        this.tabs.setAfterAction({
+            icon: 'glyp-plus_outline',
+            click: {key: this.newQueryKey}
+        })
+
+        this.queries = this.state.dive.query_data?.queries || []
+        for (const query of this.queries) {
+            this.addQuery(query)
+        }
+
+        this.listenMessage(QueryForm.settingsChangedKey, m => {
+            const query = m.data
+            log.info(`Query settings changed`, query)
+            this.tabs.updateTab({key: query.id, title: query.name})
+        })
+
+        this.onClick(this.newQueryKey, _ => {
+            this.app.showModal(NewQueryModal, {editor: this as DiveEditor, schema: this.state.schema})
+        })
+
+        this.onClick(DiveEditor.deleteQueryKey, m => {
+            this.app.confirm({title: "Delete Query", icon: 'glyp-delete', body: "Are you sure you want to delete this query?"}, () => {
+                this.deleteQuery(m.data.id)
+            })
+        })
+    }
+
+    addQuery(query: Query) {
+        const state = {...this.state, query}
+        this.tabs.upsertTab({key: query.id, title: query.name}, QueryEditor, state)
+    }
+
+    deleteQuery(id: string) {
+        log.info(`Deleting query ${id}`)
+        if (arrays.deleteIf(this.queries, q => q.id == id) > 0) {
+            this.tabs.removeTab(id)
+            this.dirty()
+        }
+    }
+
+    get parentClasses(): Array<string> {
+        return ['dd-dive-editor']
+    }
+
+    renderContent(parent: PartTag) {
+        parent.part(this.tabs)
+    }
+
+    static readonly deleteQueryKey = messages.typedKey<{ id: string }>()
+
+    async serialize(): Promise<DdDive> {
+        const queries = this.queries
+        return {...this.state.dive, query_data: {queries}}
+    }
+
+}
+
+
+export class DiveEditorPage extends PagePart<{id: string}> {
+
+    editor!: DiveEditor
+    session!: DdSession
+
+    saveKey = messages.untypedKey()
+    runKey = messages.untypedKey()
+
+    async init() {
+        log.info(`Loading dive ${this.state.id}`)
+
+        const schema = await Schema.get()
+        this.session = await DdSession.get()
+        const dive = await Dives.get(this.state.id)
+        this.editor = this.makePart(DiveEditor, {schema, dive})
+
+        this.addBreadcrumb({
+            title: "Dives",
+            icon: 'glyp-data_dives',
+            href: "/data_dive"
+        })
+        this.addBreadcrumb({
+            title: dive.name,
+            icon: 'glyp-data_dive'
+        })
+
+        this.addAction({
+            title: 'Save',
+            icon: 'glyp-checkmark',
+            click: {key: this.saveKey}
+        }, 'tertiary')
+
+        this.addAction({
+            title: 'Run',
+            icon: 'glyp-play',
+            click: {key: this.runKey}
+        }, 'tertiary')
+
+        this.onClick(this.saveKey, _ => this.save())
+
+        this.onClick(this.runKey, _ => this.run())
+
+        this.dirty()
+    }
+
+    get parentClasses(): Array<string> {
+        return ['dd-dive-editor-page']
+    }
+
+    renderContent(parent: PartTag) {
+        parent.part(this.editor)
+    }
+
+    async save() {
+        const dive = await this.editor.serialize()
+        log.info(`Saving dive ${dive.name}`, dive)
+        const res = await Db().upsert('dd_dive', dive)
+        if (res.status == 'success') {
+            this.successToast(`Saved Dive!`)
+        }
+        else {
+            this.alertToast(res.message)
+        }
+    }
+
+    async run() {
+        const dive = await this.editor.serialize()
+        this.app.showModal(DiveRunModal, {dive})
+    }
+}
+
+
+////////////////////////////////////////////////////////////////////////////////
+// New Query Modal
+////////////////////////////////////////////////////////////////////////////////
+
+type NewQueryState = {
+    editor: DiveEditor
+    schema: SchemaDef
+}
+
+class NewQueryModal extends ModalPart<NewQueryState> {
+
+    addKey = messages.untypedKey()
+    settingsForm!: QueryForm
+    modelPicker!: QueryModelPicker
+
+    async init() {
+        this.settingsForm = this.makePart(QueryForm, {query: {id: 'new', name: '', notes: ''}})
+        this.modelPicker = this.makePart(QueryModelPicker, {schema: this.state.schema})
+
+        this.setIcon('glyp-data_dive_query')
+        this.setTitle("New Query")
+
+        this.addAction({
+            title: "Add",
+            icon: 'glyp-plus',
+            click: {key: this.addKey}
+        })
+
+        this.onClick(this.addKey, async _ => {
+            await this.save()
+        })
+
+        this.onChange(this.modelPicker.pickedKey, m => {
+            log.info(`Picked model ${m.data.model}`)
+            const model = this.state.schema.models[m.data.model]
+            if (!this.settingsForm.state.query.name?.length) {
+                this.settingsForm.state.query.name = model.name
+                this.settingsForm.dirty()
+            }
+        })
+    }
+
+    renderContent(parent: PartTag): void {
+        parent.div('.tt-flex.tt-form.padded.column.gap.dd-new-query-form', col => {
+            col.part(this.settingsForm)
+            col.part(this.modelPicker)
+        })
+    }
+
+    async save() {
+        log.info(`Saving new query`)
+        const settings = await this.settingsForm.fields.serialize()
+        if (!settings.name?.length) {
+            this.showToast("Please enter a query name", {color: 'alert'})
+            this.dirty()
+            return
+        }
+        const model = this.modelPicker.model
+        if (!model) {
+            this.showToast("Please select a model", {color: 'alert'})
+            return
+        }
+        const query = {...settings, id: Ids.makeUuid(), from: {model: model.name}}
+        this.state.editor.addQuery(query)
+        this.state.editor.tabs.showTab(query.id)
+        this.pop()
+    }
+
+}

package/data-dive/dives/dive-list.ts

@@ -0,0 +1,164 @@
+import {Logger} from "tuff-core/logging"
+import PagePart from "../../terrier/parts/page-part"
+import {PartTag} from "tuff-core/parts"
+import Schema, {SchemaDef} from "../../terrier/schema"
+import {arrays, messages} from "tuff-core"
+import {DdDive, DdDiveGroup, UnpersistedDdDive, UnpersistedDdDiveGroup} from "../gen/models"
+import Dives, {DiveListResult} from "./dives"
+import {GroupEditorModal} from "./group-editor"
+import Fragments from "../../terrier/fragments"
+import {IconName} from "../../terrier/theme"
+import {routes} from "../dd-routes"
+import {DiveSettingsModal} from "./dive-settings"
+import DdSession from "../dd-session"
+
+const log = new Logger("DiveList")
+
+
+////////////////////////////////////////////////////////////////////////////////
+// List
+////////////////////////////////////////////////////////////////////////////////
+
+export class DiveListPage extends PagePart<{}> {
+
+    newGroupKey = messages.untypedKey()
+    editGroupKey = messages.typedKey<{id: string}>()
+    newDiveKey = messages.typedKey<{group_id: string}>()
+    editDiveKey = messages.typedKey<{id: string}>()
+
+    session!: DdSession
+    result!: DiveListResult
+    schema!: SchemaDef
+    groupMap: Record<string, DdDiveGroup> = {}
+    diveMap: Record<string,DdDive> = {}
+
+    async init() {
+        this.setTitle("Data Dive")
+        this.setIcon('glyp-data_dives')
+
+        this.schema = await Schema.get()
+        this.session = await DdSession.get()
+
+        this.addAction({
+            title: "New Group",
+            icon: 'glyp-plus_outline',
+            click: {key: this.newGroupKey}
+        }, 'tertiary')
+
+        this.onClick(this.newGroupKey, _ => {
+            log.info("Showing new dive group model")
+            const newGroup = {name: '', group_types: []}
+            this.app.showModal(GroupEditorModal, {session: this.session,
+                group: newGroup,
+                callback: _ => this.reload()
+            })
+        })
+
+        this.onClick(this.editGroupKey, m => {
+            log.info(`Edit group ${m.data.id}`)
+            const group = this.groupMap[m.data.id]
+            if (group) {
+                this.app.showModal(GroupEditorModal, {
+                    session: this.session,
+                    group: group as UnpersistedDdDiveGroup,
+                    callback: _ => this.reload()
+                })
+            }
+            else {
+                this.alertToast(`No group with id ${m.data.id}`)
+            }
+        })
+
+        this.onClick(this.newDiveKey, m => {
+            const groupId = m.data.group_id
+            log.info(`Showing new dive modal for group ${groupId}`)
+            const dive: UnpersistedDdDive = {
+                name: '',
+                description_raw: '',
+                visibility: 'public',
+                owner_id: this.session.user.id,
+                dd_dive_group_id: groupId,
+                dive_types: []
+            }
+            this.app.showModal(DiveSettingsModal, {schema: this.schema, dive, session: this.session})
+        })
+
+        this.onClick(this.editDiveKey, m => {
+            const dive = this.diveMap[m.data.id] as UnpersistedDdDive
+            if (dive) {
+                log.info(`Editing settings for dive: ${dive.name}`)
+                this.app.showModal(DiveSettingsModal, {schema: this.schema, dive, session: this.session})
+            }
+            else {
+                log.warn(`No dive with id ${m.data.id}`)
+            }
+        })
+
+        await this.reload()
+    }
+
+    async reload() {
+        this.session = await DdSession.get()
+        this.result = await Dives.list()
+        log.info("Loading data dive list", this.result)
+        this.groupMap = this.session.data.groupMap
+        this.diveMap = arrays.indexBy(this.result.dives, 'id')
+        this.dirty()
+    }
+
+    renderContent(parent: PartTag): void {
+
+        const groupedDives = arrays.groupBy(this.result.dives, 'dd_dive_group_id')
+
+        parent.div('.dd-group-grid', grid => {
+            const groups = arrays.sortBy(Object.values(this.groupMap), 'name')
+            for (const group of groups) {
+                this.renderGroupPanel(grid, group, groupedDives[group.id] || [])
+            }
+        })
+    }
+
+    renderGroupPanel(parent: PartTag, group: DdDiveGroup, dives: DdDive[]) {
+        Fragments.panel(this.theme)
+            .title(group.name)
+            .icon((group.icon || 'glyp-data_dives') as IconName)
+            .classes('group')
+            .content(content => {
+                content.class('tt-list')
+                for (const dive of arrays.sortBy(dives, 'name')) {
+                    this.renderDiveRow(content, dive)
+                }
+            })
+            .addAction({
+                title: "New Dive",
+                icon: 'glyp-data_dive',
+                click: {key: this.newDiveKey, data: {group_id: group.id}}
+            }, 'secondary')
+            .addAction({
+                icon: 'glyp-settings',
+                click: {key: this.editGroupKey, data: {id: group.id}}
+            }, 'tertiary')
+            .render(parent)
+    }
+
+    renderDiveRow(parent: PartTag, dive: DdDive) {
+        parent.div('.dive', row => {
+            row.a({href: routes.editor.path({id: dive.id})}, a => {
+                if (dive.visibility == 'private') {
+                    a.i('.glyp-privacy')
+                        .data({tooltip: "Private Dive"})
+                }
+                else {
+                    a.i('.glyp-data_dive')
+                }
+                a.span().text(dive.name)
+            }).data({tooltip: "Open Editor"})
+            row.a('.icon-only', a => {
+                a.i('.glyp-settings')
+            }).data({tooltip: "Dive Settings"})
+              .emitClick(this.editDiveKey, {id: dive.id})
+        })
+    }
+
+}
+