feat(ui): recent projects in top bar dropdown

vuejs · Jul 5, 2018 · ceccfbf · ceccfbf
1 parent d5a2407
commit ceccfbf
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 0 deletions.
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
 }