feat(ui): recent projects in top bar dropdown

Guillaume Chau · Guillaume Chau · commit ceccfbfbf6c0 · 2018-07-05T11:26:58.000+02:00
diff --git a/packages/@vue/cli-ui/apollo-server/connectors/projects.js b/packages/@vue/cli-ui/apollo-server/connectors/projects.js
@@ -383,6 +383,11 @@ async function open (id, context) {
   // Load plugins
   plugins.list(project.path, context)
 
+  // Date
+  context.db.get('projects').find({ id }).assign({
+    openDate: Date.now()
+  }).write()
+
   // Save for next time
   context.db.set('config.lastOpenProject', id).write()
 
diff --git a/packages/@vue/cli-ui/apollo-server/schema/project.js b/packages/@vue/cli-ui/apollo-server/schema/project.js
@@ -33,6 +33,7 @@ type Project {
   plugins: [Plugin]
   tasks: [Task]
   homepage: String
+  openDate: JSON
 }
 
 enum ProjectType {
diff --git a/packages/@vue/cli-ui/locales/en.json b/packages/@vue/cli-ui/locales/en.json
@@ -163,6 +163,7 @@
         "top-bar": {
           "no-favorites": "No favorite projects",
           "favorite-projects": "Favorite projects",
+          "recent-projects": "Recent projects",
           "homepage": "Home page"
         },
         "view-badge": {
diff --git a/packages/@vue/cli-ui/src/components/TopBar.vue b/packages/@vue/cli-ui/src/components/TopBar.vue
@@ -7,6 +7,8 @@
       icon-right="arrow_drop_down"
       button-class="flat round"
     >
+      <!-- Current project options -->
+
       <template v-if="projectCurrent">
         <VueSwitch
           :value="projectCurrent.favorite"
@@ -34,6 +36,8 @@
 
       <div class="dropdown-separator"/>
 
+      <!-- Favorites -->
+
       <div v-if="!favoriteProjects.length" class="vue-ui-empty">{{ $t('org.vue.components.top-bar.no-favorites') }}</div>
 
       <template v-else>
@@ -50,6 +54,24 @@
         />
       </template>
 
+      <!-- Recents -->
+
+      <template v-if="recentProjects.length">
+        <div class="dropdown-separator"/>
+
+        <div class="section-title">
+          {{ $t('org.vue.components.top-bar.recent-projects') }}
+        </div>
+
+        <VueDropdownButton
+          v-for="project of recentProjects"
+          :key="project.id"
+          :label="project.name"
+          icon-left="restore"
+          @click="openProject(project)"
+        />
+      </template>
+
       <div class="dropdown-separator"/>
 
       <VueDropdownButton
@@ -92,6 +114,13 @@ export default {
       return this.projects.filter(
         p => p.favorite && (!this.projectCurrent || this.projectCurrent.id !== p.id)
       )
+    },
+
+    recentProjects () {
+      if (!this.projects) return []
+      return this.projects.filter(
+        p => !p.favorite && (!this.projectCurrent || this.projectCurrent.id !== p.id)
+      ).sort((a, b) => b.openDate - a.openDate).slice(0, 3)
     }
   },
 
diff --git a/packages/@vue/cli-ui/src/graphql/projectFragment.gql b/packages/@vue/cli-ui/src/graphql/projectFragment.gql
@@ -5,4 +5,5 @@ fragment project on Project {
   path
   favorite
   homepage
+  openDate
 }

Original file line number	Diff line number	Diff line change
`@@ -33,6 +33,7 @@ type Project {`
`33`	`33`	`plugins: [Plugin]`
`34`	`34`	`tasks: [Task]`
`35`	`35`	`homepage: String`
	`36`	`+ openDate: JSON`
`36`	`37`	`}`
`37`	`38`
`38`	`39`	`enum ProjectType {`
Original file line number	Diff line number	Diff line change
`@@ -5,4 +5,5 @@ fragment project on Project {`
`5`	`5`	`path`
`6`	`6`	`favorite`
`7`	`7`	`homepage`
	`8`	`+ openDate`
`8`	`9`	`}`