sort projects by name

jsawo · Nov 14, 2022 · bd98547 · bd98547
1 parent da0fa13
commit bd98547
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 5 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -7,7 +7,7 @@
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build",
     "preview": "vite preview",
-    "tsc": "npx vue-tsc --noEmit"
+    "tsc": "vue-tsc --noEmit"
   },
   "dependencies": {
     "@guolao/vue-monaco-editor": "^0.0.5",

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
@@ -57,7 +57,7 @@ const clearMessages = () => data.messages = []
 const currentProject = computed<Project>(function () {
   return data.appConfig.Projects
     ? data.appConfig.Projects[data.appConfig.Currentproject]
-    : {}
+    : {} as Project
 })
 
 const currentColor = computed<string>(function() {

diff --git a/frontend/src/components/pages/ProjectSettings.vue b/frontend/src/components/pages/ProjectSettings.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { reactive } from 'vue'
+import { reactive, computed } from 'vue'
 import Button from 'primevue/button'
 import InputText from 'primevue/inputtext'
 import Dropdown from 'primevue/dropdown'
@@ -53,6 +53,22 @@ data.commandPresets = [...new Set(data.commandPresets)]
 
 setFormDefaults()
 
+const sortedProjects = computed(function () {
+  const keys = Object.keys(props.appConfig.Projects).sort((a, b) => {
+    return props.appConfig.Projects[a].Name.localeCompare(props.appConfig.Projects[b].Name)
+  })
+
+  const sorted: Record<string, Project> = {}
+
+  keys.forEach(key => {
+    sorted[key] = props.appConfig.Projects[key]
+  })
+
+  return sorted
+})
+
+console.log(props.appConfig.Projects)
+
 const setCurrentProject = (id: string) => {
   SetCurrentProject(id).then(() => setFormDefaults())
 }
@@ -104,7 +120,7 @@ const commandPresetSelected = (event) => {
         <div class="text-right">
           <Button label="New" class="p-button-sm" icon="pi pi-plus" @click="createProject" />
         </div>
-        <div v-for="project in appConfig.Projects"
+        <div v-for="project in sortedProjects"
              class="project" :class="currentProject?.Id === project.Id ? 'active' : ''"
              @click="() => setCurrentProject(project.Id)"
              :key="project.Id"

diff --git a/frontend/src/types/app.d.ts b/frontend/src/types/app.d.ts
@@ -1,6 +1,6 @@
 interface AppConfig {
   Currentproject: string,
-  Projects: Array<Project>,
+  Projects: Record<string, Project>,
   Tags: Array<Tag>,
 }