Commit Graph

15 Commits

Author SHA1 Message Date
Kevin Ansfield
cb13b7de1e Added automatic open of brand settings form when no custom theme settings exist
no issue

When no custom theme settings exist it's nice to have the brand settings form automatically visible when opening the design settings menu to avoid an extra click and let users make actions immediately. We don't want that behaviour when custom theme settings exist because it would hide useful context and result in extra scroll+clicks to get to the section you're interested in.

- when first rendering the menu, set the open section to `brand` if we're on the design settings index screen
- add an event handler to the router that re-sets the open section to `brand` each time we navigate back to the design settings index screen (leaving the index screen closes all open sections)
2021-10-22 12:02:59 +01:00
Kevin Ansfield
505ae7493e Optimized loading of custom theme setting in design screens
no issue

We want to automatically show brand settings expanded in the design menu when the active theme has no custom theme settings, in order to do that without causing visual noise/jank we need to ensure that we have all the data we need up-front before the design menu is rendered.

- optimized `customThemeSettings` loading behaviour
  - `.load()` will now only perform a fetch if settings have not previously been loaded so it can be called without causing unnecessary waits
  - `.reload()` will force a clear+refetch of the settings - called by `themeManagement.activate()` after successfully changing a theme
- moved fetching of theme settings from the design menu constructor to the `settings.design` route's `model()` hook
  - means the app will wait for loading to finish before showing any of the design settings screen so we can guarantee the data we need is available
- moved update of preview html from the design menu constructor to the design settings route as it's a more appropriate place to find screen setup/loading behaviour
2021-10-22 10:49:13 +01:00
Kevin Ansfield
93768ef678 Added navigation back to design settings index after activating uploaded theme
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
2021-10-19 19:43:36 +01:00
Kevin Ansfield
eda694b69f Add close of open section when clicking "Site design" nav heading
refs https://github.com/orgs/TryGhost/projects/51

- always reset the open section when the header link is clicked to collapse any open setting groups
2021-10-18 17:37:56 +01:00
Kevin Ansfield
f4596a0add Fixed design menu re-rendering and losing input focus on first change
no issue

- `get settingGroups()` was always returning a new object which meant the template was re-rendering unexpectedly which created issues with form fields that lose their focus when re-rendered
- moved group handling into the `customThemeSettings` service as it makes more sense to keep it centralized, that gave us the ability to create a new `settingGroups` array only when the settings list changes keeping the tracked invalidation easier to reason about
2021-10-14 14:15:11 +01:00
Kevin Ansfield
a339f4d6be Fixed linting error
no issue

- removed random editor-inserted import
2021-10-13 16:13:41 +01:00
Kevin Ansfield
24507ac5cc Added preview page selector to design settings screen
closes https://github.com/TryGhost/Team/issues/1103

Custom post settings can be grouped by homepage or post, when set to `'post'` it makes sense to be able to preview a post page rather than the homepage.

- added preview type selection to `themeManagement` service
  - `.availablePreviewTypes` is useful for populating selects or other page selection elements
  - `.previewType` is set to the currently selected preview type name
  - `.setPreviewType()` is for setting the preview type and re-generating the preview html if necessary
- updated `themeManagement.updatePreviewHtmlTask` to fetch the latest published post if we don't already have a published post reference in the store, that post's `url` is then used when fetching the preview html if the preview type is set to `'post'`
- added a select element to the design index header that uses the themeManagement properties/actions to list types and update the preview on change
- updated the design nav menu to switch preview types when different sections are opened so the preview automatically switches to the post preview when making changes to the "post" custom theme settings group
2021-10-13 16:07:01 +01:00
Kevin Ansfield
d8bdd45add Added current theme display to design screen nav sidebar
no issue

- fetch themes in the background when sidebar is rendered in case they haven't been loaded so far (current screen design means the first time the nav bar is seen the themes are unlikely to have been loaded already)
- added `activeTheme` getter to grab the active theme from the live themes list
2021-10-13 10:39:23 +01:00
Kevin Ansfield
f9a2626ae4 Changed design menu to only show one open section at a time
no issue

- we want the menu to feel more like a typical navigation sidebar
2021-10-13 09:11:57 +01:00
Sanne de Vries
c721bb3b1f Updated design settings sidemenu 2021-10-12 14:30:12 +02:00
Kevin Ansfield
d3539655a0 Fixed empty setting groups showing in nav bar
refs bc5be1a808

- after removing duplication for groups in the template we were showing empty groups because the group construction wasn't considering there may be no settings for a group
2021-10-12 09:13:14 +01:00
Kevin Ansfield
bc5be1a808 Removed template duplication for custom theme setting groups
no issue

- added `settingGroups` array to the nav menu so that it can be looped over rather than having the same template duplicated for hard coded settings arrays
2021-10-12 07:54:34 +01:00
Kevin Ansfield
ddac463514 Fixed custom theme settings not showing in groups
no issue

- custom theme model was missing the `group` attr so the nav menu couldn't see it to assign to groups
- changed homepage group from `home` to `homepage` to match gscan
- added fallback to showing in the "Site-wide" group if an unknown group value is seen
2021-10-12 07:36:03 +01:00
Kevin Ansfield
1d0cd80158 Added basic reset to design preview on nav bar interaction
refs https://github.com/TryGhost/Team/issues/1130

- when opening/closing sections or interacting with the general design or custom theme settings we want to switch back to showing the preview so the sidebar acts more like typical navigation and so form changes show their effect
2021-10-11 21:09:42 +01:00
Kevin Ansfield
595018098d Switched design screen from modals to standard routes
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
2021-10-11 15:24:46 +01:00