@things-factory/dashboard 7.0.0-alpha.9 → 7.0.0

package/client/actions/{board-settings.js → board-settings.ts}

@@ -1,13 +1,14 @@
-import { client } from '@things-factory/shell'
 import gql from 'graphql-tag'
 
+import { client } from '@operato/graphql'
+
 export const UPDATE_BOARD_SETTINGS = 'UPDATE_BOARD_SETTINGS'
 export const CLEAR_BOARD_SETTINGS = 'CLEAR_BOARD_SETTINGS'
 
 export async function fetchBoardSettings(names) {
   var response = await client.query({
     query: gql`
-      query($names: [String!]) {
+      query ($names: [String!]) {
         boardSettings(names: $names) {
           name
           value

package/client/{bootstrap.js → bootstrap.ts}

@@ -1,7 +1,7 @@
 import { html } from 'lit'
-import { store } from '@things-factory/shell'
+import { store } from '@operato/shell'
 import { auth, hasPrivilege } from '@things-factory/auth-base/dist-client'
-import { ADD_SETTING } from '@things-factory/setting-base'
+import { ADD_SETTING } from '@things-factory/setting-base/dist-client'
 
 import { UPDATE_BOARD_SETTINGS, fetchBoardSettings } from './actions/board-settings'
 import boardSetting from './reducers/board-settings'

package/client/{const.js → const.ts}

@@ -2,4 +2,4 @@ export const FALLBACK_HOME_BOARD = 'home' /* for backward compatibility */
 export const DASHBOARD = 'dashboard'
 export const DASHBOARD_MOBILE = 'dashboard-mobile'
 export const DASHBOARD_DESCRIPTION = 'dashboard'
-export const DASHBOARD_MOBILE_DESCRIPTION = 'dashboard mobile'
+export const DASHBOARD_MOBILE_DESCRIPTION = 'dashboard mobile'

package/client/index.ts

@@ -0,0 +1 @@
+export * from './actions'

package/client/pages/{dashboard.js → dashboard.ts}

@@ -2,29 +2,30 @@ import '@operato/board/ox-board-selector.js'
 
 import gql from 'graphql-tag'
 import { html } from 'lit'
+import { customElement } from 'lit/decorators.js'
 
+import { store } from '@operato/shell'
+import { client } from '@operato/graphql'
+import { i18next } from '@operato/i18n'
 import { openPopup } from '@operato/layout'
-import { BoardViewerPage } from '@things-factory/board-ui'
-import { i18next } from '@things-factory/i18n-base'
-import { client, store } from '@things-factory/shell'
-import { gqlBuilder, isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@operato/utils'
+import { BoardViewerPage } from '@things-factory/board-ui/dist-client'
 
 import { fetchBoardSettings, UPDATE_BOARD_SETTINGS } from '../actions/board-settings'
 import { DASHBOARD, DASHBOARD_MOBILE, FALLBACK_HOME_BOARD } from '../const'
 
 const HOME_DESCRIPTION = 'home dashboard'
 
-const FALLBACK_ORDER = isMobileDevice()
-  ? [DASHBOARD_MOBILE, DASHBOARD, FALLBACK_HOME_BOARD]
-  : [DASHBOARD, FALLBACK_HOME_BOARD]
+const FALLBACK_ORDER = isMobileDevice() ? [DASHBOARD_MOBILE, DASHBOARD, FALLBACK_HOME_BOARD] : [DASHBOARD, FALLBACK_HOME_BOARD]
 const HOME_BOARD = isMobileDevice() ? DASHBOARD_MOBILE : DASHBOARD
 
-class DashboardHome extends BoardViewerPage {
+@customElement('dashboard-home')
+export class DashboardHome extends BoardViewerPage {
   stateChanged(state) {
     super.stateChanged(state)
 
     const dashboard = state?.boardSetting
-    const homeBoard = dashboard && dashboard[FALLBACK_ORDER.find(name => dashboard[name])]
+    const homeBoard = dashboard && dashboard[FALLBACK_ORDER.find(name => dashboard[name]) || 'maybe notfound']
     this._boardId = homeBoard?.value
   }
 
@@ -82,26 +83,28 @@ class DashboardHome extends BoardViewerPage {
   }
 
   async saveSettings({ name, value, category, description }) {
-    if (!(name && value)) return
+    if (!(name && value)) {
+      return
+    }
 
     await client.query({
       query: gql`
-      mutation {
-        updateSetting(${gqlBuilder.buildArgs({
-          name,
-          patch: {
-            name,
-            description,
-            category,
+        mutation UpdateSetting($patch: SettingPatch!, $name: String!) {
+          updateSetting(patch: $patch, name: $name) {
+            name
             value
           }
-        })}) {
-          name
+        }
+      `,
+      variables: {
+        name,
+        patch: {
+          name,
+          description,
+          category,
           value
         }
-      }`
+      }
     })
   }
 }
-
-customElements.define('dashboard-home', DashboardHome)

package/client/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig-base.json",
+  "compilerOptions": {
+    "strict": true,
+    "declaration": true,
+    "module": "esnext",
+    "outDir": "../dist-client",
+    "baseUrl": "./"
+  },
+  "include": ["./**/*"]
+}

package/client/viewparts/{dashboard-setting-let.js → dashboard-setting-let.ts}

@@ -1,14 +1,16 @@
+import '@material/web/icon/icon.js'
 import '@operato/board/ox-board-selector.js'
 import '@operato/i18n/ox-i18n.js'
 
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
+import { customElement, state } from 'lit/decorators.js'
 import { connect } from 'pwa-helpers'
 
 import { openPopup } from '@operato/layout'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { client, store } from '@things-factory/shell'
-import { gqlBuilder } from '@things-factory/utils'
+import { i18next, localize } from '@operato/i18n'
+import { store } from '@operato/shell'
+import { client } from '@operato/graphql'
 
 import { fetchBoardSettings, UPDATE_BOARD_SETTINGS } from '../actions/board-settings'
 import {
@@ -19,110 +21,104 @@ import {
   FALLBACK_HOME_BOARD
 } from '../const'
 
+@customElement('dashboard-setting-let')
 export class DashboardSettingLet extends connect(store)(localize(i18next)(LitElement)) {
-  static get styles() {
-    return [
-      css`
-        div.field {
-          display: flex;
-          flex-direction: row;
-          align-items: flex-start;
-          max-width: 100%;
-          overflow: hidden;
-        }
+  static styles = [
+    css`
+      div.field {
+        display: flex;
+        flex-direction: row;
+        align-items: flex-start;
+        max-width: 100%;
+        overflow: hidden;
+      }
 
-        div.field > * {
-          flex: none;
-        }
+      div.field > * {
+        flex: none;
+      }
 
-        div.field > div {
-          flex: 1;
-          display: flex;
-          flex-direction: column;
-          align-items: flex-start;
-        }
+      div.field > div {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+      }
 
-        div.field a {
-          overflow: hidden;
-          border: var(--border-dark-color);
-          border-radius: var(--border-radius);
-          background-color: rgba(0, 0, 0, 0.1);
-          min-width: 50px;
-          min-height: 50px;
-        }
+      div.field a {
+        overflow: hidden;
+        border: var(--border-dim-color);
+        border-radius: var(--border-radius);
+        background-color: rgba(0, 0, 0, 0.1);
+        min-width: 50px;
+        min-height: 50px;
+      }
 
-        div.field img {
-          max-height: 250px;
-          max-width: 100%;
-        }
+      div.field img {
+        max-height: 250px;
+        max-width: 100%;
+      }
 
-        .name {
-          color: var(--secondary-color, #394e64);
-        }
+      .name {
+        color: var(--md-sys-color-on-secondary-container);
+      }
 
-        .description {
-          font-size: 0.7rem;
-          opacity: 0.7;
-          color: var(--secondary-text-color);
-        }
+      .description {
+        font-size: 0.7rem;
+        opacity: 0.7;
+        color: var(--md-sys-color-on-secondary-container);
+      }
 
-        label {
-          width: 80px;
-          padding-right: var(--padding-default);
-          font: bold 0.9em var(--theme-font);
-        }
+      label {
+        width: 80px;
+        padding-right: var(--spacing-medium);
+        font: bold 0.9em var(--theme-font);
+      }
 
-        setting-let > form {
-          display: grid;
-          grid-template-columns: 1fr 1fr;
-        }
+      setting-let > form {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+      }
 
-        mwc-icon {
-          background-color: var(--secondary-color, #394e64);
-          margin: 2px 2px 5px 2px;
-          padding: 0 var(--padding-default);
-          color: var(--button-color, #fff);
-          border-radius: var(--border-radius, 5px);
-          border: var(--button-border, 1px solid transparent);
-          font-size: 18px;
-        }
+      md-icon {
+        --md-icon-size: 18px;
+        margin: 2px 2px 5px 2px;
+        padding: 0 var(--spacing-medium);
+        color: var(--md-sys-on-secondary-container, #fff);
+        background-color: var(--md-sys-secondary-container, #394e64);
+        border-radius: var(--border-radius, 5px);
+        border: var(--button-border, 1px solid transparent);
+      }
 
-        mwc-icon:hover,
-        mwc-icon:active {
-          background-color: var(--button-active-background-color, #22a6a7);
-          border: var(--button-active-border);
-        }
+      md-icon:hover,
+      md-icon:active {
+        background-color: var(--button-active-background-color, #22a6a7);
+      }
 
-        @media screen and (max-width: 460px) {
-          setting-let > form {
-            display: flex;
-            flex-direction: column;
-          }
-          div.field {
-            border-bottom: var(--border-dark-color);
-            padding: var(--padding-default);
-          }
-          mwc-icon {
-            padding: var(--padding-narrow) var(--padding-default);
-          }
+      @media screen and (max-width: 460px) {
+        setting-let > form {
+          display: flex;
+          flex-direction: column;
         }
-      `
-    ]
-  }
+        div.field {
+          border-bottom: var(--border-dim-color);
+          padding: var(--spacing-medium);
+        }
+        md-icon {
+          padding: var(--spacing-small) var(--spacing-medium);
+        }
+      }
+    `
+  ]
 
-  static get properties() {
-    return {
-      dashboard: Object,
-      dashboardMobile: Object
-    }
-  }
+  @state() private dashboard: any
+  @state() private dashboardMobile: any
 
   render() {
     return html`
       <setting-let>
         <ox-i18n slot="title" msgid="title.dashboard setting"></ox-i18n>
 
-        <form slot="content" @submit=${e => this._handleSubmit(e)}>
+        <form slot="content">
           ${[
             {
               title: i18next.t('label.dashboard for desktop'),
@@ -143,9 +139,9 @@ export class DashboardSettingLet extends connect(store)(localize(i18next)(LitEle
                 <div>
                   <div class="name">${field.board.name}</div>
                   <span class="description">${field.board.description}</span>
-                  <mwc-icon @click=${e => this.onClickBoardSelector(field.key, field.description)}>
+                  <md-icon @click=${e => this.onClickBoardSelector(field.key, field.description)}>
                     more_horiz
-                  </mwc-icon>
+                  </md-icon>
                   ${
                     field.board.id
                       ? html`
@@ -167,7 +163,7 @@ export class DashboardSettingLet extends connect(store)(localize(i18next)(LitEle
     `
   }
 
-  stateChanged(state) {
+  stateChanged(state: any) {
     var dashboard = state.boardSetting[DASHBOARD] || state.boardSetting[FALLBACK_HOME_BOARD]
     var dashboardMobile = state.boardSetting[DASHBOARD_MOBILE] || dashboard
 
@@ -175,7 +171,7 @@ export class DashboardSettingLet extends connect(store)(localize(i18next)(LitEle
     this.dashboardMobile = (dashboardMobile ? dashboardMobile.board : {}) || {}
   }
 
-  onClickBoardSelector(name, description) {
+  onClickBoardSelector(name: string, description: string) {
     var popup = openPopup(
       html`
         <ox-board-selector
@@ -214,26 +210,28 @@ export class DashboardSettingLet extends connect(store)(localize(i18next)(LitEle
   }
 
   async saveSettings({ name, value, category, description }) {
-    if (!(name && value)) return
+    if (!(name && value)) {
+      return
+    }
 
     await client.query({
       query: gql`
-      mutation {
-        updateSetting(${gqlBuilder.buildArgs({
-          name,
-          patch: {
-            name,
-            description,
-            category,
+        mutation UpdateSetting($patch: SettingPatch!, $name: String!) {
+          updateSetting(patch: $patch, name: $name) {
+            name
             value
           }
-        })}) {
-          name
+        }
+      `,
+      variables: {
+        name,
+        patch: {
+          name,
+          description,
+          category,
           value
         }
-      }`
+      }
     })
   }
 }
-
-customElements.define('dashboard-setting-let', DashboardSettingLet)

package/dist-client/actions/board-settings.d.ts

@@ -0,0 +1,3 @@
+export declare const UPDATE_BOARD_SETTINGS = "UPDATE_BOARD_SETTINGS";
+export declare const CLEAR_BOARD_SETTINGS = "CLEAR_BOARD_SETTINGS";
+export declare function fetchBoardSettings(names: any): Promise<any>;

package/dist-client/actions/board-settings.js

@@ -0,0 +1,29 @@
+import gql from 'graphql-tag';
+import { client } from '@operato/graphql';
+export const UPDATE_BOARD_SETTINGS = 'UPDATE_BOARD_SETTINGS';
+export const CLEAR_BOARD_SETTINGS = 'CLEAR_BOARD_SETTINGS';
+export async function fetchBoardSettings(names) {
+    var response = await client.query({
+        query: gql `
+      query ($names: [String!]) {
+        boardSettings(names: $names) {
+          name
+          value
+          board {
+            id
+            name
+            description
+            thumbnail
+          }
+        }
+      }
+    `,
+        variables: {
+            names
+        }
+    });
+    if (!response || !response.data)
+        return;
+    return response.data.boardSettings;
+}
+//# sourceMappingURL=board-settings.js.map

package/dist-client/actions/board-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"board-settings.js","sourceRoot":"","sources":["../../client/actions/board-settings.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAEzC,MAAM,CAAC,MAAM,qBAAqB,GAAG,uBAAuB,CAAA;AAC5D,MAAM,CAAC,MAAM,oBAAoB,GAAG,sBAAsB,CAAA;AAE1D,MAAM,CAAC,KAAK,UAAU,kBAAkB,CAAC,KAAK;IAC5C,IAAI,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAChC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;KAaT;QACD,SAAS,EAAE;YACT,KAAK;SACN;KACF,CAAC,CAAA;IAEF,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,CAAC,IAAI;QAAE,OAAM;IACvC,OAAO,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAA;AACpC,CAAC","sourcesContent":["import gql from 'graphql-tag'\n\nimport { client } from '@operato/graphql'\n\nexport const UPDATE_BOARD_SETTINGS = 'UPDATE_BOARD_SETTINGS'\nexport const CLEAR_BOARD_SETTINGS = 'CLEAR_BOARD_SETTINGS'\n\nexport async function fetchBoardSettings(names) {\n  var response = await client.query({\n    query: gql`\n      query ($names: [String!]) {\n        boardSettings(names: $names) {\n          name\n          value\n          board {\n            id\n            name\n            description\n            thumbnail\n          }\n        }\n      }\n    `,\n    variables: {\n      names\n    }\n  })\n\n  if (!response || !response.data) return\n  return response.data.boardSettings\n}\n"]}

package/dist-client/actions/index.d.ts

@@ -0,0 +1 @@
+export * from './board-settings';

package/dist-client/actions/index.js

@@ -0,0 +1,2 @@
+export * from './board-settings';
+//# sourceMappingURL=index.js.map

package/dist-client/actions/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../client/actions/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAA","sourcesContent":["export * from './board-settings'\n"]}

package/dist-client/bootstrap.d.ts

@@ -0,0 +1,2 @@
+import './viewparts/dashboard-setting-let';
+export default function bootstrap(): void;

package/dist-client/bootstrap.js

@@ -0,0 +1,31 @@
+import { html } from 'lit';
+import { store } from '@operato/shell';
+import { auth, hasPrivilege } from '@things-factory/auth-base/dist-client';
+import { ADD_SETTING } from '@things-factory/setting-base/dist-client';
+import { UPDATE_BOARD_SETTINGS, fetchBoardSettings } from './actions/board-settings';
+import boardSetting from './reducers/board-settings';
+import './viewparts/dashboard-setting-let';
+import { FALLBACK_HOME_BOARD, DASHBOARD, DASHBOARD_MOBILE } from './const';
+export default function bootstrap() {
+    store.addReducers({ boardSetting });
+    auth.on('profile', async () => {
+        var settings = await fetchBoardSettings([FALLBACK_HOME_BOARD, DASHBOARD, DASHBOARD_MOBILE]);
+        store.dispatch({
+            type: UPDATE_BOARD_SETTINGS,
+            settings: settings.reduce((settings, setting) => {
+                settings[setting.name] = setting;
+                return settings;
+            }, {})
+        });
+        if (await hasPrivilege({ privilege: 'mutation', category: 'setting' })) {
+            store.dispatch({
+                type: ADD_SETTING,
+                setting: {
+                    seq: 20,
+                    template: html ` <dashboard-setting-let></dashboard-setting-let> `
+                }
+            });
+        }
+    });
+}
+//# sourceMappingURL=bootstrap.js.map

package/dist-client/bootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AACtC,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAA;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,0CAA0C,CAAA;AAEtE,OAAO,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AACpF,OAAO,YAAY,MAAM,2BAA2B,CAAA;AAEpD,OAAO,mCAAmC,CAAA;AAE1C,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE1E,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,KAAK,CAAC,WAAW,CAAC,EAAE,YAAY,EAAE,CAAC,CAAA;IAEnC,IAAI,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QAC5B,IAAI,QAAQ,GAAG,MAAM,kBAAkB,CAAC,CAAC,mBAAmB,EAAE,SAAS,EAAE,gBAAgB,CAAC,CAAC,CAAA;QAE3F,KAAK,CAAC,QAAQ,CAAC;YACb,IAAI,EAAE,qBAAqB;YAC3B,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE;gBAC9C,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,CAAA;gBAChC,OAAO,QAAQ,CAAA;YACjB,CAAC,EAAE,EAAE,CAAC;SACP,CAAC,CAAA;QAEF,IAAI,MAAM,YAAY,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC;YACvE,KAAK,CAAC,QAAQ,CAAC;gBACb,IAAI,EAAE,WAAW;gBACjB,OAAO,EAAE;oBACP,GAAG,EAAE,EAAE;oBACP,QAAQ,EAAE,IAAI,CAAA,mDAAmD;iBAClE;aACF,CAAC,CAAA;QACJ,CAAC;IACH,CAAC,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import { html } from 'lit'\nimport { store } from '@operato/shell'\nimport { auth, hasPrivilege } from '@things-factory/auth-base/dist-client'\nimport { ADD_SETTING } from '@things-factory/setting-base/dist-client'\n\nimport { UPDATE_BOARD_SETTINGS, fetchBoardSettings } from './actions/board-settings'\nimport boardSetting from './reducers/board-settings'\n\nimport './viewparts/dashboard-setting-let'\n\nimport { FALLBACK_HOME_BOARD, DASHBOARD, DASHBOARD_MOBILE } from './const'\n\nexport default function bootstrap() {\n  store.addReducers({ boardSetting })\n\n  auth.on('profile', async () => {\n    var settings = await fetchBoardSettings([FALLBACK_HOME_BOARD, DASHBOARD, DASHBOARD_MOBILE])\n\n    store.dispatch({\n      type: UPDATE_BOARD_SETTINGS,\n      settings: settings.reduce((settings, setting) => {\n        settings[setting.name] = setting\n        return settings\n      }, {})\n    })\n\n    if (await hasPrivilege({ privilege: 'mutation', category: 'setting' })) {\n      store.dispatch({\n        type: ADD_SETTING,\n        setting: {\n          seq: 20,\n          template: html` <dashboard-setting-let></dashboard-setting-let> `\n        }\n      })\n    }\n  })\n}\n"]}

package/dist-client/const.d.ts

@@ -0,0 +1,5 @@
+export declare const FALLBACK_HOME_BOARD = "home";
+export declare const DASHBOARD = "dashboard";
+export declare const DASHBOARD_MOBILE = "dashboard-mobile";
+export declare const DASHBOARD_DESCRIPTION = "dashboard";
+export declare const DASHBOARD_MOBILE_DESCRIPTION = "dashboard mobile";

package/dist-client/const.js

@@ -0,0 +1,6 @@
+export const FALLBACK_HOME_BOARD = 'home'; /* for backward compatibility */
+export const DASHBOARD = 'dashboard';
+export const DASHBOARD_MOBILE = 'dashboard-mobile';
+export const DASHBOARD_DESCRIPTION = 'dashboard';
+export const DASHBOARD_MOBILE_DESCRIPTION = 'dashboard mobile';
+//# sourceMappingURL=const.js.map

package/dist-client/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"","sources":["../client/const.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAA,CAAC,gCAAgC;AAC1E,MAAM,CAAC,MAAM,SAAS,GAAG,WAAW,CAAA;AACpC,MAAM,CAAC,MAAM,gBAAgB,GAAG,kBAAkB,CAAA;AAClD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAA;AAChD,MAAM,CAAC,MAAM,4BAA4B,GAAG,kBAAkB,CAAA","sourcesContent":["export const FALLBACK_HOME_BOARD = 'home' /* for backward compatibility */\nexport const DASHBOARD = 'dashboard'\nexport const DASHBOARD_MOBILE = 'dashboard-mobile'\nexport const DASHBOARD_DESCRIPTION = 'dashboard'\nexport const DASHBOARD_MOBILE_DESCRIPTION = 'dashboard mobile'\n"]}

package/dist-client/index.d.ts

@@ -0,0 +1 @@
+export * from './actions';

package/dist-client/index.js

@@ -0,0 +1,2 @@
+export * from './actions';
+//# sourceMappingURL=index.js.map

package/dist-client/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../client/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA","sourcesContent":["export * from './actions'\n"]}

package/dist-client/pages/dashboard.d.ts

@@ -0,0 +1,21 @@
+import '@operato/board/ox-board-selector.js';
+import { BoardViewerPage } from '@things-factory/board-ui/dist-client';
+export declare class DashboardHome extends BoardViewerPage {
+    stateChanged(state: any): void;
+    get oopsNote(): {
+        icon: string;
+        title: string;
+        description: string;
+        click: (e: any) => void;
+    };
+    get context(): {
+        title: string;
+    };
+    onClickDashboardSetting(name: any, description: any): void;
+    saveSettings({ name, value, category, description }: {
+        name: any;
+        value: any;
+        category: any;
+        description: any;
+    }): Promise<void>;
+}

package/dist-client/pages/dashboard.js

@@ -0,0 +1,97 @@
+import { __decorate } from "tslib";
+import '@operato/board/ox-board-selector.js';
+import gql from 'graphql-tag';
+import { html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { store } from '@operato/shell';
+import { client } from '@operato/graphql';
+import { i18next } from '@operato/i18n';
+import { openPopup } from '@operato/layout';
+import { isMobileDevice } from '@operato/utils';
+import { BoardViewerPage } from '@things-factory/board-ui/dist-client';
+import { fetchBoardSettings, UPDATE_BOARD_SETTINGS } from '../actions/board-settings';
+import { DASHBOARD, DASHBOARD_MOBILE, FALLBACK_HOME_BOARD } from '../const';
+const HOME_DESCRIPTION = 'home dashboard';
+const FALLBACK_ORDER = isMobileDevice() ? [DASHBOARD_MOBILE, DASHBOARD, FALLBACK_HOME_BOARD] : [DASHBOARD, FALLBACK_HOME_BOARD];
+const HOME_BOARD = isMobileDevice() ? DASHBOARD_MOBILE : DASHBOARD;
+let DashboardHome = class DashboardHome extends BoardViewerPage {
+    stateChanged(state) {
+        super.stateChanged(state);
+        const dashboard = state === null || state === void 0 ? void 0 : state.boardSetting;
+        const homeBoard = dashboard && dashboard[FALLBACK_ORDER.find(name => dashboard[name]) || 'maybe notfound'];
+        this._boardId = homeBoard === null || homeBoard === void 0 ? void 0 : homeBoard.value;
+    }
+    get oopsNote() {
+        return {
+            icon: 'insert_chart',
+            title: 'HOME DASHBOARD',
+            description: 'There are no home dashboard setting. Pls, click to setting home dashboard.',
+            click: e => this.onClickDashboardSetting(HOME_BOARD, HOME_DESCRIPTION)
+        };
+    }
+    get context() {
+        return {
+            title: HOME_DESCRIPTION
+        };
+    }
+    onClickDashboardSetting(name, description) {
+        var popup = openPopup(html `
+        <ox-board-selector
+          .creatable=${true}
+          .value=${this._boardId}
+          @board-selected=${async (e) => {
+            var board = e.detail.board;
+            await this.saveSettings({
+                name,
+                value: board.id,
+                category: 'board',
+                description
+            });
+            var settings = await fetchBoardSettings([FALLBACK_HOME_BOARD, DASHBOARD, DASHBOARD_MOBILE]);
+            store.dispatch({
+                type: UPDATE_BOARD_SETTINGS,
+                settings: settings.reduce((settings, setting) => {
+                    settings[setting.name] = setting;
+                    return settings;
+                }, {})
+            });
+            popup.close();
+            this.requestUpdate();
+        }}
+        ></ox-board-selector>
+      `, {
+            backdrop: true,
+            size: 'large',
+            title: i18next.t('title.dashboard setting')
+        });
+    }
+    async saveSettings({ name, value, category, description }) {
+        if (!(name && value)) {
+            return;
+        }
+        await client.query({
+            query: gql `
+        mutation UpdateSetting($patch: SettingPatch!, $name: String!) {
+          updateSetting(patch: $patch, name: $name) {
+            name
+            value
+          }
+        }
+      `,
+            variables: {
+                name,
+                patch: {
+                    name,
+                    description,
+                    category,
+                    value
+                }
+            }
+        });
+    }
+};
+DashboardHome = __decorate([
+    customElement('dashboard-home')
+], DashboardHome);
+export { DashboardHome };
+//# sourceMappingURL=dashboard.js.map