Sidebar Title

- set as companyName
- open DatabaseSelector on click

src/components/DatabaseSelector.vue

@@ -0,0 +1,50 @@
+<template>
+  <form-layout
+    :fields="[docfield]"
+    :doc="doc"
+  />
+</template>
+<script>
+import frappe from 'frappejs';
+// import SQLite from 'frappejs/backends/sqlite';
+import FormLayout from 'frappejs/ui/components/Form/FormLayout';
+import Observable from 'frappejs/utils/observable';
+
+export default {
+  name: 'DatabaseSelector',
+  components: {
+    FormLayout
+  },
+  data() {
+    return {
+      docfield: {
+        fieldtype: 'File',
+        label: 'Select File',
+        fieldname: 'file',
+        filetypes: ['.db']
+      },
+      value: null,
+      invalid: false
+    }
+  },
+  created() {
+    this.doc = new Observable();
+  },
+  methods: {
+    handleChange(fileList) {
+      const value = fileList[0].name;
+      this.value = value;
+    },
+    async changeDatabase() {
+      if (frappe.db) {
+        frappe.db.close();
+      }
+
+      const dbPath = this.value;
+      frappe.db = new SQLite({ dbPath });
+      await frappe.db.connect();
+      await frappe.db.migrate();
+    }
+  }
+}
+</script>

src/sidebarConfig.js

@@ -1,42 +1,64 @@
-const { _ } = require('frappejs/utils');
+import frappe from 'frappejs';
+import { _ } from 'frappejs/utils';
+import DatabaseSelector from './components/DatabaseSelector';
 
-export default [
-  {
-    items: [
-      {
-        label: _('ToDo'), route: '#/list/ToDo'
-      },
-      {
-        label: _('Event'), route: '#/list/Event'
-      }
-    ]
+export default {
+  async getTitle() {
+    const accountingSettings = await frappe.getSingle('AccountingSettings');
+    return accountingSettings.companyName;
   },
-  {
-    title: _('Masters'),
-    items: [
-      {
-        label: _('Item'), route: '#/list/Item'
-      },
-      {
-        label: _('Party'), route: '#/list/Party'
-      },
-      {
-        label: _('Invoice'), route: '#/list/Invoice'
-      },
-      {
-        label: _('Tax'), route: '#/list/Tax'
-      },
-      {
-        label: _('Account'), route: '#/list/Account'
+  onTitleClick(vm) {
+    vm.$modal.show({
+      component: DatabaseSelector,
+      modalProps: {
+        title: _('Change Database File'),
+        primaryAction: {
+          label: _('Submit'),
+          handler: (vm) => {
+            vm.changeDatabase();
+          }
+        }
       }
-    ]
+    });
   },
-  {
-    title: _('Reports'),
-    items: [
-      {
-        label: _('General Ledger'), route: '#/report/general-ledger'
-      }
-    ]
-  }
-];
+  groups: [
+    {
+      items: [
+        {
+          label: _('ToDo'), route: '#/list/ToDo'
+        },
+        {
+          label: _('Event'), route: '#/list/Event'
+        }
+      ]
+    },
+    {
+      title: _('Masters'),
+      items: [
+        {
+          label: _('Item'), route: '#/list/Item'
+        },
+        {
+          label: _('Party'), route: '#/list/Party'
+        },
+        {
+          label: _('Invoice'), route: '#/list/Invoice'
+        },
+        {
+          label: _('Tax'), route: '#/list/Tax'
+        },
+        {
+          label: _('Account'), route: '#/list/Account'
+        }
+      ]
+    },
+    {
+      title: _('Reports'),
+      items: [
+        {
+          label: _('General Ledger'), route: '#/report/general-ledger'
+        }
+      ]
+    }
+  ]
+};