From bdd1c2d8f88a796904bce0c05d875e967a72ed27 Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 13:58:24 +0800
Subject: [PATCH 1/6] feat(dashboard): add order to ViewTabsTabModel

---
 .../model/meta-model/dashboard/content/view/widgets/tabs.ts   | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
index e3c56aace..b2afbb829 100644
--- a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
+++ b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
@@ -9,6 +9,7 @@ const TabModel = types
     name: types.string,
     view_id: types.string,
     color: types.optional(types.string, ''),
+    order: types.optional(types.number, 0),
   })
   .views((self) => ({
     get json() {
@@ -31,6 +32,9 @@ const TabModel = types
     setColor(v: string) {
       self.color = v;
     },
+    setOrder(v: number) {
+      self.order = v;
+    },
   }));
 
 export type TabModelInstance = Instance<typeof TabModel>;

From 466196f8b4c55a5f5d16bf58f2e86a54e5f9f33c Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 13:58:43 +0800
Subject: [PATCH 2/6] feat(dashboard): editor field for order of tab

---
 .../view/view-component/preview/tabs.tsx       | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/dashboard/src/components/view/view-component/preview/tabs.tsx b/dashboard/src/components/view/view-component/preview/tabs.tsx
index 55f76b147..909465c43 100644
--- a/dashboard/src/components/view/view-component/preview/tabs.tsx
+++ b/dashboard/src/components/view/view-component/preview/tabs.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, ColorInput, Overlay, Select, Stack, Sx, Tabs, TextInput } from '@mantine/core';
+import { Box, Button, ColorInput, NumberInput, Overlay, Select, Stack, Sx, Tabs, TextInput } from '@mantine/core';
 import { useModals } from '@mantine/modals';
 import { IconArrowsLeftRight, IconTrash } from '@tabler/icons-react';
 import { observer } from 'mobx-react-lite';
@@ -94,8 +94,22 @@ export const PreviewViewTabs = observer(({ view }: { view: ViewRenderModelInstan
               <Overlay opacity={0.8} color="#FFF" blur={10} zIndex={100} />
 
               <Stack mx="auto" mt={100} sx={{ width: '300px', position: 'relative', zIndex: 200 }}>
-                <TextInput label="Tab Name" value={t.name} onChange={(e) => t.setName(e.currentTarget.value)} />
+                <TextInput
+                  label="Tab Name"
+                  required
+                  value={t.name}
+                  onChange={(e) => t.setName(e.currentTarget.value)}
+                />
                 <Select label="View" value={t.view_id} onChange={t.setViewID} data={options} />
+                <NumberInput
+                  label="Placement Order"
+                  required
+                  value={t.order}
+                  onChange={(v) => t.setOrder(v ? v : 0)}
+                  min={0}
+                  max={1000}
+                  step={1}
+                />
                 <ColorInput
                   label="Color"
                   value={t.color}

From 7f351b99f738d65d718e8b0896b8ec733a579ac1 Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 14:02:40 +0800
Subject: [PATCH 3/6] feat(dashboard): render tabs in order

---
 dashboard/src/components/view/view-component/preview/tabs.tsx | 4 ++--
 dashboard/src/components/view/view-component/render/tabs.tsx  | 4 ++--
 dashboard/src/interactions/interactions-viewer/data/nodes.ts  | 2 +-
 .../model/meta-model/dashboard/content/view/widgets/tabs.ts   | 4 ++++
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/dashboard/src/components/view/view-component/preview/tabs.tsx b/dashboard/src/components/view/view-component/preview/tabs.tsx
index 909465c43..ddd06b76f 100644
--- a/dashboard/src/components/view/view-component/preview/tabs.tsx
+++ b/dashboard/src/components/view/view-component/preview/tabs.tsx
@@ -77,7 +77,7 @@ export const PreviewViewTabs = observer(({ view }: { view: ViewRenderModelInstan
       styles={getStyles(config)}
     >
       <Tabs.List grow={config.grow}>
-        {config.tabs.map((t) => (
+        {config.tabsInOrder.map((t) => (
           <Tabs.Tab key={t.id} value={t.id} sx={getTabSX(t)}>
             {t.name ?? t.id}
           </Tabs.Tab>
@@ -86,7 +86,7 @@ export const PreviewViewTabs = observer(({ view }: { view: ViewRenderModelInstan
           <Plus size={18} color="#228be6" />
         </Tabs.Tab>
       </Tabs.List>
-      {config.tabs.map((t, i) => {
+      {config.tabsInOrder.map((t, i) => {
         const tabView = model.views.findByID(t.view_id);
         return (
           <Tabs.Panel key={t.id} value={t.id} sx={{ position: 'relative' }}>
diff --git a/dashboard/src/components/view/view-component/render/tabs.tsx b/dashboard/src/components/view/view-component/render/tabs.tsx
index c91b773e8..6eff55a57 100644
--- a/dashboard/src/components/view/view-component/render/tabs.tsx
+++ b/dashboard/src/components/view/view-component/render/tabs.tsx
@@ -35,13 +35,13 @@ export const RenderViewTabs = observer(({ view }: { view: ViewRenderModelInstanc
       keepMounted={false}
     >
       <Tabs.List grow={config.grow}>
-        {config.tabs.map((t) => (
+        {config.tabsInOrder.map((t) => (
           <Tabs.Tab key={t.id} value={t.id} sx={getTabSX(t)} disabled={!t.view_id}>
             {t.name ?? t.id}
           </Tabs.Tab>
         ))}
       </Tabs.List>
-      {config.tabs.map((t) => {
+      {config.tabsInOrder.map((t) => {
         const tabView = model.views.findByID(t.view_id);
         if (!tabView) {
           return null;
diff --git a/dashboard/src/interactions/interactions-viewer/data/nodes.ts b/dashboard/src/interactions/interactions-viewer/data/nodes.ts
index d530f9148..6228ed119 100644
--- a/dashboard/src/interactions/interactions-viewer/data/nodes.ts
+++ b/dashboard/src/interactions/interactions-viewer/data/nodes.ts
@@ -73,7 +73,7 @@ function makeViewNodes(views: ViewsRenderModelInstance) {
     let _tab_view_ids: string[] = [];
     if (v.type === EViewComponentType.Tabs) {
       const config = v.config as ViewTabsConfigInstance;
-      _tab_view_ids = config.tabs.map((t) => t.view_id);
+      _tab_view_ids = config.tabsInOrder.map((t) => t.view_id);
     }
     return {
       id: v.id,
diff --git a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
index b2afbb829..e2543c19a 100644
--- a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
+++ b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
@@ -2,6 +2,7 @@ import { TabsOrientation, TabsVariant } from '@mantine/core';
 import { randomId } from '@mantine/hooks';
 import { cast, Instance, SnapshotIn, types } from 'mobx-state-tree';
 import { EViewComponentType } from '../types';
+import _ from 'lodash';
 
 const TabModel = types
   .model('ViewTabsTabModel', {
@@ -62,6 +63,9 @@ export const ViewTabsConfig = types
         orientation,
       };
     },
+    get tabsInOrder() {
+      return _.sortBy(self.tabs, 'order');
+    },
   }))
   .actions((self) => ({
     setVariant(v: TabsVariant) {

From a4f326cc7f0a6919ee62b0939c9ed3e9eb9af000 Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 14:03:00 +0800
Subject: [PATCH 4/6] chore: publish v11.5.0

---
 api/package.json           | 2 +-
 dashboard/package.json     | 2 +-
 package.json               | 2 +-
 settings-form/package.json | 2 +-
 website/package.json       | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/api/package.json b/api/package.json
index cd2d34b62..e1ecd249c 100644
--- a/api/package.json
+++ b/api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/api",
-  "version": "11.4.0",
+  "version": "11.5.0",
   "description": "",
   "main": "index.js",
   "scripts": {
diff --git a/dashboard/package.json b/dashboard/package.json
index c45f8925e..c8f3e3650 100644
--- a/dashboard/package.json
+++ b/dashboard/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "11.4.0",
+  "version": "11.5.0",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",
diff --git a/package.json b/package.json
index ccf4aec7b..7d37e8782 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/root",
-  "version": "11.4.0",
+  "version": "11.5.0",
   "private": true,
   "workspaces": [
     "api",
diff --git a/settings-form/package.json b/settings-form/package.json
index 0f39e9b20..a2d431266 100644
--- a/settings-form/package.json
+++ b/settings-form/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/settings-form",
-  "version": "11.4.0",
+  "version": "11.5.0",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",
diff --git a/website/package.json b/website/package.json
index 9ee6d37e2..e546fc974 100644
--- a/website/package.json
+++ b/website/package.json
@@ -2,7 +2,7 @@
   "name": "@devtable/website",
   "private": true,
   "license": "Apache-2.0",
-  "version": "11.4.0",
+  "version": "11.5.0",
   "scripts": {
     "dev": "vite",
     "preview": "vite preview"

From 424c0943a88cadef4fb838b8e81ced247348a0a2 Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 14:05:59 +0800
Subject: [PATCH 5/6] fix(dashboard): tab.order is not saved

---
 .../model/meta-model/dashboard/content/view/widgets/tabs.ts    | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
index e2543c19a..d34d590c9 100644
--- a/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
+++ b/dashboard/src/model/meta-model/dashboard/content/view/widgets/tabs.ts
@@ -14,11 +14,12 @@ const TabModel = types
   })
   .views((self) => ({
     get json() {
-      const { id, name, view_id, color } = self;
+      const { id, name, view_id, color, order } = self;
       return {
         id,
         name,
         color,
+        order,
         view_id,
       };
     },

From 9d7362e0db58ca3c38a9fab8b77ed62dafeda0d7 Mon Sep 17 00:00:00 2001
From: Leto <gerile.tu@merico.dev>
Date: Thu, 28 Dec 2023 14:06:17 +0800
Subject: [PATCH 6/6] chore: publish v11.5.1

---
 api/package.json           | 2 +-
 dashboard/package.json     | 2 +-
 package.json               | 2 +-
 settings-form/package.json | 2 +-
 website/package.json       | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/api/package.json b/api/package.json
index e1ecd249c..988f0991f 100644
--- a/api/package.json
+++ b/api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/api",
-  "version": "11.5.0",
+  "version": "11.5.1",
   "description": "",
   "main": "index.js",
   "scripts": {
diff --git a/dashboard/package.json b/dashboard/package.json
index c8f3e3650..344283fc4 100644
--- a/dashboard/package.json
+++ b/dashboard/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "11.5.0",
+  "version": "11.5.1",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",
diff --git a/package.json b/package.json
index 7d37e8782..923a54296 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/root",
-  "version": "11.5.0",
+  "version": "11.5.1",
   "private": true,
   "workspaces": [
     "api",
diff --git a/settings-form/package.json b/settings-form/package.json
index a2d431266..e252db57f 100644
--- a/settings-form/package.json
+++ b/settings-form/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/settings-form",
-  "version": "11.5.0",
+  "version": "11.5.1",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",
diff --git a/website/package.json b/website/package.json
index e546fc974..ab4fdbee5 100644
--- a/website/package.json
+++ b/website/package.json
@@ -2,7 +2,7 @@
   "name": "@devtable/website",
   "private": true,
   "license": "Apache-2.0",
-  "version": "11.5.0",
+  "version": "11.5.1",
   "scripts": {
     "dev": "vite",
     "preview": "vite preview"