closes: https://github.com/TryGhost/Ghost/issues/15505
When starting Ghost with a missing active theme, the design settings screen and change theme screen both end up in a broken state with the user unable to select a new theme as the active one.
The design screen has no default (or blank) slate, and so shows a preview of an empty theme.
- First added a new default screen to serve as a placeholder for when the state contains no active theme.
- Added a check for when there was no active theme, then redirects the user to the default screen .
The change theme screen wants to set an active property on the theme that should be active in the theme list.
- Added a check to see whether there is an active theme set.
- If there isn't one, don't bother trying to add the active property.
no issue
The `settings` service has been a source of confusion when writing with modern Ember patterns because it's use of the deprecated `ProxyMixin` forced all property access/setting to go via `.get()` and `.set()` whereas the rest of the system has mostly (there are a few other uses of ProxyObjects remaining) eliminated the use of the non-native get/set methods.
- removed use of `ProxyMixin` in the `settings` service by grabbing the attributes off the setting model after fetching and using `Object.defineProperty()` to add native getters/setters that pass through to the model's getters/setters. Ember's autotracking automatically works across the native getters/setters so we can then use the service as if it was any other native object
- updated all code to use `settings.{attrName}` directly for getting/setting instead of `.get()` and `.set()`
- removed use of observer in the `customViews` service because it was being set up before the native properties had been added on the settings service meaning autotracking wasn't able to set up properly
no issue
- since `ember-concurrency@2.0` it's possible to use the standard imports as decorators removing the need for the extra `ember-concurrency-decorators` dependency and imports
no issue
The marketplace still uses the `/settings/theme/install` route but that was removed as part of the redesign for design settings.
- added `settings.design.change-theme.install` route that uses the newer theme install modal
- requires backing controller for query param support despite no template being rendered
- uses the `change-theme` controller's official theme list to fetch theme details based on query param `ref`
- added `settings.change-theme` route that lives on the old `/settings/theme/install` path and redirects to the new install route
- commented out the old theme settings routes ready for full cleanup/removal
refs https://github.com/TryGhost/Team/issues/1149
- uses `willTransition` action rather than `deactivate` hook because we also want to close the table when navigating to the theme demo child routes
refs https://github.com/TryGhost/Team/issues/1149
- added a `@data.onActivationSuccess` option to the upload-theme modal that if present is called when activation of a theme is completed as part of the upload process
- added a `startThemeUpload()` action to the `change-theme` controller so that we can pass in an `onActivationSuccess` which transitions to the `design.settings.index` screen
- removed unnecessary `@tracked` decorators on class properties that have `store.peekAll('theme')` assigned to them
refs https://github.com/TryGhost/Team/issues/1149
- use ember-keyboard's `{{on-key}}` modifier to attach keyboard event listener when the design settings index screen is shown - ensures that ctrl/cmd+s on the change-theme screen won't trigger an unexpected save
- blur active element when saving so the preview is updated and reflects what has just been saved (text fields only update preview on blur)
refs https://github.com/TryGhost/Team/issues/1149
If you were part way scrolled through the themes list and you clicked the "Advanced" button, the installed themes list was displayed at the top of the scrollable element but the browser kept the scroll position so it looked like nothing happened.
- updated `toggleAdvanced()` action to scroll the main container to the top so that the installed themes list is immediately viewable when you use the button to open/navigate to it
refs https://github.com/TryGhost/Team/issues/1149
- added Casper to the hardcoded official themes list with a ref of `'default'` so that the install theme process knows to process it differently
- updated the install-theme modal
- removed the `willOverwriteDefault` getter because it's a path that can't be reached and is now handled differently
- changed `installThemeTask` to only perform an activation when a default theme is passed in
no issue
- added details to the `marketplaceThemes` array in the `change-theme` controller
- added theme images obtained from https://ghost.org/themes/
no issue
- ensured that we're only swapping classes on existing elements or inserting/removing elements around the iframe to avoid re-rendering and the associated loading+layout flash
refs https://github.com/TryGhost/Team/issues/1130
- when moving the design settings screen from a modal to normal routes the save process was misplaced and the template not updated
- moved all the design settings behaviour over to the index controller where it belongs and updated the template to use `this.saveTask` rather than `@data.saveTask` as was used in the modal
refs https://github.com/TryGhost/Team/issues/1130
- added new route for viewing themes so back/forward buttons can be used
- takes theme name as a parameter
- opens a fullscreen modal with an iframe containing the theme demo
- changed installable themes list to link to new route
- swapped `previewUrl` in theme data to point at the real demo rather than the ghost.org demo page
refs https://github.com/TryGhost/Team/issues/1130
- match latest design where the theme table is under an "advanced" toggle on the change-theme screen rather than a completely separate screen
refs https://github.com/TryGhost/Team/issues/1130
- copied theme upload modal to new modals system and refactored for Octane syntax
- updated to use `themeManagement` service rather than passed in actions so the modal-based process can be opened from any screen
- added default `beforeClose()` for the modal to the modals service so it won't close if an upload is in-progress (defaults were moved directly into the class so it had access to services)
- added `themeManagement.upload` action for triggering the upload modal and providing a central place for limit checks
- added upload-triggering buttons to change-theme and advanced design screens
refs https://github.com/TryGhost/Team/issues/1130
- added link to design sidebar
- dropped change-theme modal and associated route behaviour
- copied basic themes marketplace list into the change-theme controller/template
refs https://github.com/TryGhost/Team/issues/1130
- added `ui.contextualNavMenu` property that when set will switch the main nav menu between components, if it's not set then it will show the default "main" menu component
- added `design` menu sub-component of `gh-nav-menu` ready for use via `contextualNavMenu`
- moved sidebar contents from the design modal into this component
- updated design route to set/reset `ui.contextualNavMenu` to `design` on entering/leaving the route
- all other design routes are sub-routes so this works across all other design screens
- moved base design modal preview into the `settings/design/index` controller/template
- using index means that it's the default screen for `/settings/design` but will be automatically replaced by any other `design.x` routes
- moved `design/advanced` modal content into the `settings.design.advanced` controller/template and removed the modal handling from the route
refs https://github.com/TryGhost/Team/issues/1111
refs https://github.com/TryGhost/Team/issues/1103
- moved customize modal from a link on the design screen to the main design screen
- changed modal design to be a full-screen overlay with side bar that emulates standard Admin design
- added toggled groups of settings in sidebar
- added `{{set-has}}` helper for use in conditionals matching when a Set contains an object
- added grouping of theme settings
- dropped unfinished advanced/change theme modals
refs https://github.com/TryGhost/Team/issues/1070
- split select form component into it's own component so it's cleaner when we get to additional setting types
- added change handler that updates the setting record's value when a new option is selected
- added `.isDirty` to the custom-theme-settings service so we can warn of unsaved changes and revert any changed values when needed
- added save of custom theme settings to the customize design modal's save routine
- added missing `notifications` service import to customize design controller
refs https://github.com/TryGhost/Team/issues/1045
- added tabs to the the customise design modal's sidebar for general settings and theme settings
- copied settings from the existing branding modal plus site description from general settings screen into the general settings tab
- theme settings tab left blank ready for static design
- `saveTask` put on the controller so that we can access it from the route, allowing us to pause modal closing when navigating away (implementation left for later)
