From fed90558188a03690010feb7239c0945808f384e Mon Sep 17 00:00:00 2001 From: Osama Sayegh Date: Mon, 3 Jun 2024 10:18:14 +0300 Subject: [PATCH] DEV: Remove admin-revamp and introduce foundations for admin config (#27293) This commit removes the `/admin-revamp` routes which were introduced as a part of an experiment to revamp the admin pages. We still want to improve the admin/staff experience, but we're going to do them within the existing `/admin` routes instead of introducing a completely new route. Our initial efforts to improve the Discourse admin experience is this commit which introduces the foundation for a new subroute `/admin/config` which will house various new pages for configuring Discourse. The first new page (or "config area") will be `/admin/config/about` that will house all the settings and controls for configuring the `/about` page of Discourse. Internal topic: t/128544 --- .../admin-config-area-sidebar-experiment.hbs | 46 ------- .../admin-config-area-sidebar-experiment.js | 130 ------------------ .../components/admin-config-areas/about.gjs | 15 ++ .../admin/addon/controllers/admin-revamp.js | 31 ----- .../addon/routes/admin-revamp-config-area.js | 19 --- .../admin/addon/routes/admin-revamp-config.js | 6 - .../admin/addon/routes/admin-revamp-lobby.js | 6 - .../admin/addon/routes/admin-revamp.js | 40 ------ .../admin/addon/routes/admin-route-map.js | 20 +-- .../templates/admin-revamp-config-area.hbs | 5 - .../addon/templates/admin-revamp-config.hbs | 3 - .../addon/templates/admin-revamp-lobby.hbs | 1 - .../admin/addon/templates/admin-revamp.hbs | 13 -- .../admin/addon/templates/config-about.hbs | 1 + .../app/lib/sidebar/admin-nav-map.js | 2 +- .../common/community-section/section.js | 2 - .../admin-revamp-section-link.js | 38 ----- .../stylesheets/common/admin/admin_base.scss | 4 +- .../common/admin/admin_config_area.scss | 12 ++ .../common/admin/admin_revamp.scss | 34 ----- .../admin/config/about_controller.rb | 9 ++ app/controllers/application_controller.rb | 4 +- config/routes.rb | 12 +- 23 files changed, 51 insertions(+), 402 deletions(-) delete mode 100644 app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.hbs delete mode 100644 app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.js create mode 100644 app/assets/javascripts/admin/addon/components/admin-config-areas/about.gjs delete mode 100644 app/assets/javascripts/admin/addon/controllers/admin-revamp.js delete mode 100644 app/assets/javascripts/admin/addon/routes/admin-revamp-config-area.js delete mode 100644 app/assets/javascripts/admin/addon/routes/admin-revamp-config.js delete mode 100644 app/assets/javascripts/admin/addon/routes/admin-revamp-lobby.js delete mode 100644 app/assets/javascripts/admin/addon/routes/admin-revamp.js delete mode 100644 app/assets/javascripts/admin/addon/templates/admin-revamp-config-area.hbs delete mode 100644 app/assets/javascripts/admin/addon/templates/admin-revamp-config.hbs delete mode 100644 app/assets/javascripts/admin/addon/templates/admin-revamp-lobby.hbs delete mode 100644 app/assets/javascripts/admin/addon/templates/admin-revamp.hbs create mode 100644 app/assets/javascripts/admin/addon/templates/config-about.hbs delete mode 100644 app/assets/javascripts/discourse/app/lib/sidebar/user/community-section/admin-revamp-section-link.js create mode 100644 app/assets/stylesheets/common/admin/admin_config_area.scss delete mode 100644 app/assets/stylesheets/common/admin/admin_revamp.scss create mode 100644 app/controllers/admin/config/about_controller.rb diff --git a/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.hbs b/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.hbs deleted file mode 100644 index 6aaddf69381..00000000000 --- a/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.hbs +++ /dev/null @@ -1,46 +0,0 @@ -
-

Sidebar Experiment

-

Changes you make here will be applied to the admin sidebar and persist - between reloads - on this device only. Note that in addition to the - text - and - route - options, you can also specify a - icon - or a - href, if you want to link to a specific page but don't know the - Ember route. You can also use the Ember Inspector extension to find route - names, for example for plugin routes which are not auto-generated here. -

- routeModels - is an array of values that correspond to parts of the route; for example the - topic route may be - /t/:id, so to get a link to topic with ID 123 you would do - routeModels: [123].

- -

All configuration options for a section and its links looks like this:

- - 
{{this.exampleJson}}
- - - - -
- -
-
\ No newline at end of file diff --git a/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.js b/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.js deleted file mode 100644 index 14e46c70eed..00000000000 --- a/app/assets/javascripts/admin/addon/components/admin-config-area-sidebar-experiment.js +++ /dev/null @@ -1,130 +0,0 @@ -import Component from "@glimmer/component"; -import { tracked } from "@glimmer/tracking"; -import { action } from "@ember/object"; -import { service } from "@ember/service"; -import { ADMIN_NAV_MAP } from "discourse/lib/sidebar/admin-nav-map"; -import { - buildAdminSidebar, - useAdminNavConfig, -} from "discourse/lib/sidebar/admin-sidebar"; -import { resetPanelSections } from "discourse/lib/sidebar/custom-sections"; -import { ADMIN_PANEL } from "discourse/lib/sidebar/panels"; - -// TODO (martin) (2024-02-01) Remove this experimental UI. -export default class AdminConfigAreaSidebarExperiment extends Component { - @service adminSidebarStateManager; - @service toasts; - @service router; - @tracked editedNavConfig; - - validRouteNames = new Set(); - - get defaultAdminNav() { - return JSON.stringify(ADMIN_NAV_MAP, null, 2); - } - - get exampleJson() { - return JSON.stringify( - { - name: "section-name", - text: "Section Name", - links: [ - { - name: "admin-revamp", - route: "admin-revamp", - routeModels: [123], - text: "Revamp", - href: "https://forum.site.com/t/123", - icon: "rocket", - }, - ], - }, - null, - 2 - ); - } - - @action - loadDefaultNavConfig() { - const savedConfig = this.adminSidebarStateManager.navConfig; - this.editedNavConfig = savedConfig - ? JSON.stringify(savedConfig, null, 2) - : this.defaultAdminNav; - } - - @action - resetToDefault() { - this.editedNavConfig = this.defaultAdminNav; - this.#saveConfig(ADMIN_NAV_MAP); - } - - @action - applyConfig() { - let config = null; - try { - config = JSON.parse(this.editedNavConfig); - } catch { - this.toasts.error({ - duration: 3000, - data: { - message: "There was an error, make sure the structure is valid JSON.", - }, - }); - return; - } - - let invalidRoutes = []; - config.forEach((section) => { - section.links.forEach((link) => { - if (!link.route) { - return; - } - - if (this.validRouteNames.has(link.route)) { - return; - } - - // Using the private `_routerMicrolib` is not ideal, but Ember doesn't provide - // any other way for us to easily check for route validity. - try { - // eslint-disable-next-line ember/no-private-routing-service - this.router._router._routerMicrolib.recognizer.handlersFor( - link.route - ); - this.validRouteNames.add(link.route); - } catch (err) { - // eslint-disable-next-line no-console - console.debug("[AdminSidebarExperiment]", err); - invalidRoutes.push(link.route); - } - }); - }); - - if (invalidRoutes.length) { - this.toasts.error({ - duration: 3000, - data: { - message: `There was an error with one or more of the routes provided: ${invalidRoutes.join( - ", " - )}`, - }, - }); - return; - } - - this.#saveConfig(config); - } - - #saveConfig(config) { - this.adminSidebarStateManager.navConfig = config; - resetPanelSections( - ADMIN_PANEL, - useAdminNavConfig(config), - buildAdminSidebar - ); - this.toasts.success({ - duration: 3000, - data: { message: "Sidebar navigation applied successfully!" }, - }); - } -} diff --git a/app/assets/javascripts/admin/addon/components/admin-config-areas/about.gjs b/app/assets/javascripts/admin/addon/components/admin-config-areas/about.gjs new file mode 100644 index 00000000000..c78c31c938a --- /dev/null +++ b/app/assets/javascripts/admin/addon/components/admin-config-areas/about.gjs @@ -0,0 +1,15 @@ +import Component from "@glimmer/component"; + +export default class AdminConfigAreasAbout extends Component { + cards = [1, 2, 3]; + + +} diff --git a/app/assets/javascripts/admin/addon/controllers/admin-revamp.js b/app/assets/javascripts/admin/addon/controllers/admin-revamp.js deleted file mode 100644 index 51515e1bd87..00000000000 --- a/app/assets/javascripts/admin/addon/controllers/admin-revamp.js +++ /dev/null @@ -1,31 +0,0 @@ -import Controller from "@ember/controller"; -import { service } from "@ember/service"; -import { dasherize } from "@ember/string"; -import discourseComputed from "discourse-common/utils/decorators"; - -export default class AdminRevampController extends Controller { - @service router; - - @discourseComputed("router._router.currentPath") - adminContentsClassName(currentPath) { - let cssClasses = currentPath - .split(".") - .filter((segment) => { - return ( - segment !== "index" && - segment !== "loading" && - segment !== "show" && - segment !== "admin" - ); - }) - .map(dasherize) - .join(" "); - - // this is done to avoid breaking css customizations - if (cssClasses.includes("dashboard")) { - cssClasses = `${cssClasses} dashboard-next`; - } - - return cssClasses; - } -} diff --git a/app/assets/javascripts/admin/addon/routes/admin-revamp-config-area.js b/app/assets/javascripts/admin/addon/routes/admin-revamp-config-area.js deleted file mode 100644 index 8572ff969fe..00000000000 --- a/app/assets/javascripts/admin/addon/routes/admin-revamp-config-area.js +++ /dev/null @@ -1,19 +0,0 @@ -import Route from "@ember/routing/route"; -import { service } from "@ember/service"; -import { dasherize } from "@ember/string"; -import AdminConfigAreaSidebarExperiment from "admin/components/admin-config-area-sidebar-experiment"; - -const CONFIG_AREA_COMPONENT_MAP = { - "sidebar-experiment": AdminConfigAreaSidebarExperiment, -}; - -export default class AdminRevampConfigAreaRoute extends Route { - @service router; - - async model(params) { - return { - area: params.area, - configAreaComponent: CONFIG_AREA_COMPONENT_MAP[dasherize(params.area)], - }; - } -} diff --git a/app/assets/javascripts/admin/addon/routes/admin-revamp-config.js b/app/assets/javascripts/admin/addon/routes/admin-revamp-config.js deleted file mode 100644 index 41d0d57a52f..00000000000 --- a/app/assets/javascripts/admin/addon/routes/admin-revamp-config.js +++ /dev/null @@ -1,6 +0,0 @@ -import Route from "@ember/routing/route"; -import { service } from "@ember/service"; - -export default class AdminRevampConfigRoute extends Route { - @service router; -} diff --git a/app/assets/javascripts/admin/addon/routes/admin-revamp-lobby.js b/app/assets/javascripts/admin/addon/routes/admin-revamp-lobby.js deleted file mode 100644 index 9ab826ca20b..00000000000 --- a/app/assets/javascripts/admin/addon/routes/admin-revamp-lobby.js +++ /dev/null @@ -1,6 +0,0 @@ -import Route from "@ember/routing/route"; -import { service } from "@ember/service"; - -export default class AdminRevampLobbyRoute extends Route { - @service router; -} diff --git a/app/assets/javascripts/admin/addon/routes/admin-revamp.js b/app/assets/javascripts/admin/addon/routes/admin-revamp.js deleted file mode 100644 index 3cd8811149e..00000000000 --- a/app/assets/javascripts/admin/addon/routes/admin-revamp.js +++ /dev/null @@ -1,40 +0,0 @@ -import { service } from "@ember/service"; -import { MAIN_PANEL } from "discourse/lib/sidebar/panels"; -import DiscourseURL from "discourse/lib/url"; -import DiscourseRoute from "discourse/routes/discourse"; -import I18n from "discourse-i18n"; - -// DEPRECATED: (martin) This route is deprecated and will be removed in the near future. -export default class AdminRoute extends DiscourseRoute { - @service siteSettings; - @service currentUser; - @service sidebarState; - @service adminSidebarStateManager; - - titleToken() { - return I18n.t("admin_title"); - } - - activate() { - if (!this.currentUser.use_admin_sidebar) { - return DiscourseURL.redirectTo("/admin"); - } - - this.adminSidebarStateManager.maybeForceAdminSidebar({ - onlyIfAlreadyActive: false, - }); - - this.controllerFor("application").setProperties({ - showTop: false, - }); - } - - deactivate(transition) { - this.controllerFor("application").set("showTop", true); - if (this.adminSidebarStateManager.currentUserUsingAdminSidebar) { - if (!transition?.to.name.startsWith("admin")) { - this.sidebarState.setPanel(MAIN_PANEL); - } - } - } -} diff --git a/app/assets/javascripts/admin/addon/routes/admin-route-map.js b/app/assets/javascripts/admin/addon/routes/admin-route-map.js index 4691fbe0b4d..c53b940cb35 100644 --- a/app/assets/javascripts/admin/addon/routes/admin-route-map.js +++ b/app/assets/javascripts/admin/addon/routes/admin-route-map.js @@ -210,10 +210,14 @@ export default function () { ); this.route( - "adminConfigFlags", - { path: "/config/flags", resetNamespace: true }, + "adminConfig", + { path: "/config", resetNamespace: true }, function () { - this.route("index", { path: "/" }); + this.route("flags", function () { + this.route("index", { path: "/" }); + }); + + this.route("about"); } ); @@ -233,14 +237,4 @@ export default function () { resetNamespace: true, }); }); - - // EXPERIMENTAL: These admin routes are hidden behind an `admin_sidebar_enabled_groups` - // site setting and are subject to constant change. - this.route("admin-revamp", { resetNamespace: true }, function () { - this.route("lobby", { path: "/" }, function () {}); - - this.route("config", function () { - this.route("area", { path: "/:area" }); - }); - }); } diff --git a/app/assets/javascripts/admin/addon/templates/admin-revamp-config-area.hbs b/app/assets/javascripts/admin/addon/templates/admin-revamp-config-area.hbs deleted file mode 100644 index 71b3e7a52ca..00000000000 --- a/app/assets/javascripts/admin/addon/templates/admin-revamp-config-area.hbs +++ /dev/null @@ -1,5 +0,0 @@ -
- {{#if @model.configAreaComponent}} - <@model.configAreaComponent /> - {{/if}} -
\ No newline at end of file diff --git a/app/assets/javascripts/admin/addon/templates/admin-revamp-config.hbs b/app/assets/javascripts/admin/addon/templates/admin-revamp-config.hbs deleted file mode 100644 index 8f90c9441ca..00000000000 --- a/app/assets/javascripts/admin/addon/templates/admin-revamp-config.hbs +++ /dev/null @@ -1,3 +0,0 @@ -
- {{outlet}} -
\ No newline at end of file diff --git a/app/assets/javascripts/admin/addon/templates/admin-revamp-lobby.hbs b/app/assets/javascripts/admin/addon/templates/admin-revamp-lobby.hbs deleted file mode 100644 index 57d2c28438f..00000000000 --- a/app/assets/javascripts/admin/addon/templates/admin-revamp-lobby.hbs +++ /dev/null @@ -1 +0,0 @@ -Admin Revamp Lobby \ No newline at end of file diff --git a/app/assets/javascripts/admin/addon/templates/admin-revamp.hbs b/app/assets/javascripts/admin/addon/templates/admin-revamp.hbs deleted file mode 100644 index 0c2000916c7..00000000000 --- a/app/assets/javascripts/admin/addon/templates/admin-revamp.hbs +++ /dev/null @@ -1,13 +0,0 @@ -{{hide-application-footer}} -{{html-class "admin-area"}} -{{body-class "admin-interface"}} - -
-
-
-
- {{outlet}} -
-
-
-
\ No newline at end of file diff --git a/app/assets/javascripts/admin/addon/templates/config-about.hbs b/app/assets/javascripts/admin/addon/templates/config-about.hbs new file mode 100644 index 00000000000..c0c9365d60e --- /dev/null +++ b/app/assets/javascripts/admin/addon/templates/config-about.hbs @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/javascripts/discourse/app/lib/sidebar/admin-nav-map.js b/app/assets/javascripts/discourse/app/lib/sidebar/admin-nav-map.js index c78cdd5854a..4a041aafe28 100644 --- a/app/assets/javascripts/discourse/app/lib/sidebar/admin-nav-map.js +++ b/app/assets/javascripts/discourse/app/lib/sidebar/admin-nav-map.js @@ -112,7 +112,7 @@ export const ADMIN_NAV_MAP = [ }, { name: "admin_moderation_flags", - route: "adminConfigFlags", + route: "adminConfig.flags", label: "admin.community.sidebar_link.moderation_flags", icon: "flag", }, diff --git a/app/assets/javascripts/discourse/app/lib/sidebar/common/community-section/section.js b/app/assets/javascripts/discourse/app/lib/sidebar/common/community-section/section.js index 113c887ea89..6ffc86d6fe0 100644 --- a/app/assets/javascripts/discourse/app/lib/sidebar/common/community-section/section.js +++ b/app/assets/javascripts/discourse/app/lib/sidebar/common/community-section/section.js @@ -12,7 +12,6 @@ import { secondaryCustomSectionLinks, } from "discourse/lib/sidebar/custom-community-section-links"; import SectionLink from "discourse/lib/sidebar/section-link"; -import AdminRevampSectionLink from "discourse/lib/sidebar/user/community-section/admin-revamp-section-link"; import AdminSectionLink from "discourse/lib/sidebar/user/community-section/admin-section-link"; import MyPostsSectionLink from "discourse/lib/sidebar/user/community-section/my-posts-section-link"; import ReviewSectionLink from "discourse/lib/sidebar/user/community-section/review-section-link"; @@ -26,7 +25,6 @@ const SPECIAL_LINKS_MAP = { "/review": ReviewSectionLink, "/badges": BadgesSectionLink, "/admin": AdminSectionLink, - "/admin-revamp": AdminRevampSectionLink, "/g": GroupsSectionLink, }; diff --git a/app/assets/javascripts/discourse/app/lib/sidebar/user/community-section/admin-revamp-section-link.js b/app/assets/javascripts/discourse/app/lib/sidebar/user/community-section/admin-revamp-section-link.js deleted file mode 100644 index e68e4f1f13b..00000000000 --- a/app/assets/javascripts/discourse/app/lib/sidebar/user/community-section/admin-revamp-section-link.js +++ /dev/null @@ -1,38 +0,0 @@ -import { service } from "@ember/service"; -import BaseSectionLink from "discourse/lib/sidebar/base-community-section-link"; -import I18n from "discourse-i18n"; - -export default class AdminRevampSectionLink extends BaseSectionLink { - @service siteSettings; - - get name() { - return "admin-revamp"; - } - - get route() { - return "admin-revamp"; - } - - get title() { - return I18n.t("sidebar.sections.community.links.admin.content"); - } - - get text() { - return I18n.t( - `sidebar.sections.community.links.${this.overridenName.toLowerCase()}.content`, - { defaultValue: this.overridenName } - ); - } - - get shouldDisplay() { - if (!this.currentUser) { - return false; - } - - return this.currentUser.use_admin_sidebar; - } - - get defaultPrefixValue() { - return "star"; - } -} diff --git a/app/assets/stylesheets/common/admin/admin_base.scss b/app/assets/stylesheets/common/admin/admin_base.scss index f1498ef60d3..08b0dcfbf15 100644 --- a/app/assets/stylesheets/common/admin/admin_base.scss +++ b/app/assets/stylesheets/common/admin/admin_base.scss @@ -1065,6 +1065,7 @@ a.inline-editable-field { @import "common/admin/api"; @import "common/admin/backups"; @import "common/admin/plugins"; +@import "common/admin/admin_config_area"; @import "common/admin/admin_reports"; @import "common/admin/admin_report"; @import "common/admin/admin_report_counters"; @@ -1078,6 +1079,3 @@ a.inline-editable-field { @import "common/admin/mini_profiler"; @import "common/admin/schema_theme_setting_editor"; @import "common/admin/customize_themes_show_schema"; - -// EXPERIMENTAL: Revamped admin styles, probably can be split up later down the line. -@import "common/admin/admin_revamp"; diff --git a/app/assets/stylesheets/common/admin/admin_config_area.scss b/app/assets/stylesheets/common/admin/admin_config_area.scss new file mode 100644 index 00000000000..1715cd3bf1a --- /dev/null +++ b/app/assets/stylesheets/common/admin/admin_config_area.scss @@ -0,0 +1,12 @@ +.admin-config-area { + display: grid; + grid-template-columns: 2fr 1fr; + column-gap: 1em; + + &__primary-content { + background: red; + } + &__help-inset { + background: green; + } +} diff --git a/app/assets/stylesheets/common/admin/admin_revamp.scss b/app/assets/stylesheets/common/admin/admin_revamp.scss deleted file mode 100644 index f4e9028b056..00000000000 --- a/app/assets/stylesheets/common/admin/admin_revamp.scss +++ /dev/null @@ -1,34 +0,0 @@ -.admin-revamp { - &__config-area { - padding: 1em; - margin: 1em 0; - background-color: var(--primary-very-low); - } -} - -.admin-config-area-sidebar-experiment { - &__editor { - margin-top: 1em; - - .ace-wrapper { - position: relative; - width: 100%; - height: calc(100vh); - min-height: 500px; - .ace_editor { - position: absolute; - left: 0; - right: 0; - top: 0; - bottom: 0; - } - } - } -} - -.admin-area .sidebar-wrapper .admin-panel { - background-color: var(--d-sidebar-admin-background); - .sidebar-section-header-text { - font-weight: bold; - } -} diff --git a/app/controllers/admin/config/about_controller.rb b/app/controllers/admin/config/about_controller.rb new file mode 100644 index 00000000000..94c1764a02c --- /dev/null +++ b/app/controllers/admin/config/about_controller.rb @@ -0,0 +1,9 @@ +# frozen_string_literal: true + +class Admin::Config::AboutController < Admin::AdminController + def index + end + + def update + end +end diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb index 4767cdd11fe..d44e28105ae 100644 --- a/app/controllers/application_controller.rb +++ b/app/controllers/application_controller.rb @@ -803,9 +803,7 @@ class ApplicationController < ActionController::Base def check_xhr # bypass xhr check on PUT / POST / DELETE provided api key is there, otherwise calling api is annoying return if !request.get? && (is_api? || is_user_api?) - unless ((request.format && request.format.json?) || request.xhr?) - raise ApplicationController::RenderEmpty.new - end + raise ApplicationController::RenderEmpty.new if !request.format&.json? && !request.xhr? end def apply_cdn_headers diff --git a/config/routes.rb b/config/routes.rb index dcfd3f54b85..3bd79656827 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -98,14 +98,6 @@ Discourse::Application.routes.draw do get "wizard/steps/:id" => "wizard#index" put "wizard/steps/:id" => "steps#update" - namespace :admin_revamp, - path: "admin-revamp", - module: "admin", - constraints: StaffConstraint.new do - get "" => "admin#index" - get "config/:area" => "admin#index" - end - namespace :admin, constraints: StaffConstraint.new do get "" => "admin#index" @@ -397,6 +389,10 @@ Discourse::Application.routes.draw do resources :flags, only: %i[index] do put "toggle" end + + resources :about, constraints: AdminConstraint.new, only: %i[index] do + collection { put "/" => "about#update" } + end end end # admin namespace