Update UI for wizard themes further reading step (#7669)

Update UI for wizard themes further reading step (#7669)

diff --git a/app/assets/javascripts/admin/controllers/modals/admin-install-theme.js.es6 b/app/assets/javascripts/admin/controllers/modals/admin-install-theme.js.es6
index 15688a1..a81e8ca 100644
--- a/app/assets/javascripts/admin/controllers/modals/admin-install-theme.js.es6
+++ b/app/assets/javascripts/admin/controllers/modals/admin-install-theme.js.es6
@@ -6,104 +6,10 @@ import {
   observes
 } from "ember-addons/ember-computed-decorators";
 import { THEMES, COMPONENTS } from "admin/models/theme";
+import { POPULAR_THEMES } from "discourse-common/helpers/popular-themes";
 
 const MIN_NAME_LENGTH = 4;
 
-// TODO: use a central repository for themes/components
-const POPULAR_THEMES = [
-  {
-    name: "Graceful",
-    value: "https://github.com/discourse/graceful",
-    preview: "https://theme-creator.discourse.org/theme/awesomerobot/graceful",
-    description: "A light and graceful theme for Discourse.",
-    meta_url:
-      "https://meta.discourse.org/t/a-graceful-theme-for-discourse/93040"
-  },
-  {
-    name: "Material Design Theme",
-    value: "https://github.com/discourse/material-design-stock-theme",
-    preview: "https://newmaterial.trydiscourse.com",
-    description:
-      "Inspired by Material Design, this theme comes with several color palettes (incl. a dark one).",
-    meta_url: "https://meta.discourse.org/t/material-design-stock-theme/47142"
-  },
-  {
-    name: "Minima",
-    value: "https://github.com/discourse/minima",
-    preview: "https://theme-creator.discourse.org/theme/awesomerobot/minima",
-    description: "A minimal theme with reduced UI elements and focus on text.",
-    meta_url:
-      "https://meta.discourse.org/t/minima-a-minimal-theme-for-discourse/108178"
-  },
-  {
-    name: "Sam's Simple Theme",
-    value: "https://github.com/discourse/discourse-simple-theme",
-    preview: "https://theme-creator.discourse.org/theme/sam/simple",
-    description:
-      "Simplified front page design with classic colors and typography.",
-    meta_url:
-      "https://meta.discourse.org/t/sams-personal-minimal-topic-list-design/23552"
-  },
-  {
-    name: "Vincent",
-    value: "https://github.com/discourse/discourse-vincent-theme",
-    preview: "https://theme-creator.discourse.org/theme/awesomerobot/vincent",
-    description: "An elegant dark theme with a few color palettes.",
-    meta_url: "https://meta.discourse.org/t/discourse-vincent-theme/76662"
-  },
-  {
-    name: "Alternative Logos",
-    value: "https://github.com/discourse/discourse-alt-logo",
-    description: "Add alternative logos for dark / light themes.",
-    meta_url:
-      "https://meta.discourse.org/t/alternative-logo-for-dark-themes/88502",
-    component: true
-  },
-  {
-    name: "Brand Header Theme Component",
-    value: "https://github.com/discourse/discourse-brand-header",
-    description:
-      "Add an extra top header with your logo, navigation links and social icons.",
-    meta_url: "https://meta.discourse.org/t/brand-header-theme-component/77977",
-    component: true
-  },
-  {
-    name: "Custom Header Links",
-    value: "https://github.com/discourse/discourse-custom-header-links",
-    preview:
-      "https://theme-creator.discourse.org/theme/Johani/custom-header-links",
-    description: "Easily add custom text-based links to the header.",
-    meta_url: "https://meta.discourse.org/t/custom-header-links/90588",
-    component: true
-  },
-  {
-    name: "Category Banners",
-    value: "https://github.com/discourse/discourse-category-banners",
-    preview:
-      "https://theme-creator.discourse.org/theme/awesomerobot/discourse-category-banners",
-    description:
-      "Show banners on category pages using your existing category details.",
-    meta_url: "https://meta.discourse.org/t/discourse-category-banners/86241",
-    component: true
-  },
-  {
-    name: "Hamburger Theme Selector",
-    value: "https://github.com/discourse/discourse-hamburger-theme-selector",
-    description:
-      "Displays a theme selector in the hamburger menu provided there is more than one user-selectable theme.",
-    meta_url: "https://meta.discourse.org/t/hamburger-theme-selector/61210",
-    component: true
-  },
-  {
-    name: "Header submenus",
-    value: "https://github.com/discourse/discourse-header-submenus",
-    preview: "https://theme-creator.discourse.org/theme/Johani/header-submenus",
-    description: "Lets you build a header menu with submenus (dropdowns).",
-    meta_url: "https://meta.discourse.org/t/header-submenus/94584",
-    component: true
-  }
-];
-
 export default Ember.Controller.extend(ModalFunctionality, {
   popular: Ember.computed.equal("selection", "popular"),
   local: Ember.computed.equal("selection", "local"),
diff --git a/app/assets/javascripts/discourse-common/helpers/popular-themes.js.es6 b/app/assets/javascripts/discourse-common/helpers/popular-themes.js.es6
new file mode 100644
index 0000000..e9f838a
--- /dev/null
+++ b/app/assets/javascripts/discourse-common/helpers/popular-themes.js.es6
@@ -0,0 +1,119 @@
+export const POPULAR_THEMES = [
+  {
+    name: "Graceful",
+    value: "https://github.com/discourse/graceful",
+    preview: "https://theme-creator.discourse.org/theme/awesomerobot/graceful",
+    description: "A light and graceful theme for Discourse.",
+    meta_url:
+      "https://meta.discourse.org/t/a-graceful-theme-for-discourse/93040"
+  },
+  {
+    name: "Material Design Theme",
+    value: "https://github.com/discourse/material-design-stock-theme",
+    preview: "https://newmaterial.trydiscourse.com",
+    description:
+      "Inspired by Material Design, this theme comes with several color palettes (incl. a dark one).",
+    meta_url: "https://meta.discourse.org/t/material-design-stock-theme/47142"
+  },
+  {
+    name: "Minima",
+    value: "https://github.com/discourse/minima",
+    preview: "https://theme-creator.discourse.org/theme/awesomerobot/minima",
+    description: "A minimal theme with reduced UI elements and focus on text.",
+    meta_url:
+      "https://meta.discourse.org/t/minima-a-minimal-theme-for-discourse/108178"
+  },
+  {
+    name: "Sam's Simple Theme",
+    value: "https://github.com/discourse/discourse-simple-theme",
+    preview: "https://theme-creator.discourse.org/theme/sam/simple",
+    description:
+      "Simplified front page design with classic colors and typography.",
+    meta_url:
+      "https://meta.discourse.org/t/sams-personal-minimal-topic-list-design/23552"
+  },
+  {
+    name: "Vincent",
+    value: "https://github.com/discourse/discourse-vincent-theme",
+    preview: "https://theme-creator.discourse.org/theme/awesomerobot/vincent",
+    description: "An elegant dark theme with a few color palettes.",
+    meta_url: "https://meta.discourse.org/t/discourse-vincent-theme/76662"
+  },
+  {
+    name: "Brand Header",
+    value: "https://github.com/discourse/discourse-brand-header",
+    description:
+      "Add an extra top header with your logo, navigation links and social icons.",
+    meta_url: "https://meta.discourse.org/t/brand-header-theme-component/77977",
+    component: true
+  },
+  {
+    name: "Custom Header Links",
+    value: "https://github.com/discourse/discourse-custom-header-links",
+    preview:
+      "https://theme-creator.discourse.org/theme/Johani/custom-header-links",
+    description: "Easily add custom text-based links to the header.",
+    meta_url: "https://meta.discourse.org/t/custom-header-links/90588",
+    component: true
+  },
+  {
+    name: "Category Banners",
+    value: "https://github.com/discourse/discourse-category-banners",
+    preview:
+      "https://theme-creator.discourse.org/theme/awesomerobot/discourse-category-banners",
+    description:
+      "Show banners on category pages using your existing category details.",
+    meta_url: "https://meta.discourse.org/t/discourse-category-banners/86241",
+    component: true
+  },
+  {
+    name: "Kanban Board",
+    value: "https://github.com/discourse/discourse-kanban-theme",

[... diff too long, it was truncated ...]

GitHub sha: 16982d2a

1 Like