refs https://github.com/TryGhost/Team/issues/1542
- added `willPublish` and `willEmail` convenience getters to `PublishOptions`
- added confirmation step that is switched to when clicking the Continue button in the publish flow
- separated options and confirmation steps into discrete components used by the `publish-flow` modal
refs https://github.com/TryGhost/Team/issues/1542
- assigning the result of `peekAll('newsletter').filter()` to `newsletters` doesn't work because the live peekAll array gets transformed to a static array so it was always blank
- assigned result of `peekAll('newsletter')` to `allNewsletters` and replaced `newsletters` property with a getter that uses `allNewsletters` to return an array of filtered and sorted newsletters
- fixed incorrect sort order for `defaultNewsletter`
- assigned default newsletter to tracked `newsletter` property as part of setup once newsletters have been fetched
- updated publish-flow template to show a real count and newsletter name
refs https://github.com/TryGhost/Toolbox/issues/308
- this endpoint is being switched to return a 204 with no body upon success
- if we don't change this code, the button will get stuck in a red Retry
state because it reads the `undefined` body and thinks it's an error
- this commit makes sure we return true if the POST is successful
refs https://github.com/TryGhost/Toolbox/issues/308
- we have a pattern of using plurals for endpoints but `email_preview`
was implemented without it
- in v5, we're fixing that so we need to update Admin to take that into
account
refs https://github.com/TryGhost/Team/issues/1477
- Very basic test only
- Includes some extra test attributes in the components
- Commented out a test that was not yet fininished
refs https://github.com/TryGhost/Team/issues/1542
- moved publish-flow modal into `components/editor-labs/modals/publish-flow` as we have enough editor-related components to keep them in one place
- updated publish flow design to use expanding blocks in place of dropdowns
- added `openSection` property in publish-flow modal and associated action for toggling sections
- moved "publish at" option into a separate component to keep publish-flow modal cleaner (keeps option-specific actions out of the main modal component)
- used `{{liquid-if}}` to animate the expanding blocks
- added schedule time properties to `PublishOptions`
- kept "is scheduled" and "scheduled at" separate so it's possible to keep the selected schedule time across selecting/deselecting the option to schedule
- ensures schedule date is kept to the minimum 5-minute in the future across option changes
- updated publish-management to reset the scheduled option to "Right now" when the publish-flow modal is opened if a schedule time was previously set but is now in the past
refs: https://github.com/TryGhost/Team/issues/1531
- charts now have basic working loading states, could be improved though
- trying out staff picks description and layout tweaks
- lots of small design tweaks based on feedback
refs https://github.com/TryGhost/Team/issues/1512
Adds the new endpoint `/stats/subscriptions/` which provides data for
the paid mix and paid breakdown charts.
Made the filledMissingDates function more generic by passing in a
`copyData` function which is used to populate a date from the previous
days data, if the data for that date is missing.
refs: https://github.com/TryGhost/Team/issues/1531
- investigated how to make the layout not break on resize
- using a width 99% hack to make chartjs react properly
- redid the markup for the minicharts for more stable loading
- added in a subtle gradient for the mrr minichart
no issue
If you scheduled a post to a specific newsletter it was no longer visible in the scheduled state of the publish menu making it difficult to know the behaviour when coming back to a scheduled post.
- duplicated the newsletter dropdown from the draft to the scheduled state components and disabled it the same as the other recipient options
- added temporary workaround for missing newsletter embed for the posts endpoint in the API
- adds `newsletterId` attribute to the post model
- uses `post.newsletterId` to find the matching newsletter model from the available newsletters list
no issue
The full edit newsletter form with all the settings, design options, and preview felt quite overwhelming when the only piece of data that's required to create a newsletter is the name.
- re-organised the newsletter modal components by renaming `modals/edit-newlsetter` to `modals/newsletters` to better represent the full suite of modals that are used in newsletter management
- added a `modals/newsletters/new` component containing a minimal form with name/description/opt-in-existing fields
- switched the `new-newsletter` route to open the new modal rather than the previous dual-purpose edit modal
- moved message about newsletter creation into the create modal and dropped the separate create confirmation modal
- dropped unnecessary unsaved-changes confirmation
- removed the now-unused opt-in-existing behaviour from the edit newsletter modal
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
refs https://github.com/TryGhost/Team/issues/1469
- default newsletters were set for new members added on members list except "add yourself" feature
- updates default newsletters for new member added via "Add yourself" button
- without the multiple newsletter UI flag, a site can have only one newsletter
- updates the heading for newsletter management UI to singular in that case
refs https://github.com/TryGhost/Team/issues/1554
With multiple newsletters, the subscribed property on a member is replaced by newsletter(s) [] which defines member's subscription instead. This change -
- updates the existing subscription toggle for member on detail screen to work with new backend
- shows the new multiple newsletter subscription UI only if site has more than 1 newsletters
no issue
Also moves some reused test methods to the test helpers folder (wasn't able to move it to the fixtures because too many tests were failing):
- enableNewsletters helper
- enableStripe helper
- enableMailgun helper
refs: https://github.com/TryGhost/Team/issues/1556
- working implementation of all the parts of the dashboard
- now includes the what's new section again
- has dynamic, yet basic, newsletters
refs https://github.com/TryGhost/Team/issues/1542
- adds a `PublishOptions` class
- an instance of this class provides everything the UI needs to display and set the publish options relevant to the current post object and overall system state
- the `publish-flow` modal is passed a `PublishOptions` instance when it opens
- as part of the constructor it triggers a background load of any additional data it requires to control available options such as member counts, email limits, and newsletters
- adds a `{{publish-options}}` resource
- sets up and returns `PublishOptions` instance
- passes through service dependencies which are not available directly in the `PublishOptions` class as it's a custom native class outside of Ember's DI management
- used to ensure we can get a clean `PublishOptions` instance any time the passed in `post` object is replaced meaning we don't have to rely on observers and manual teardown/setup
- updated `<PublishManagement>` component
- sets up `publishOptions` property using `@use` and the `{{publish-options}}` resource so reactivity for changing post objects is handled automatically
- uses the `publishOptions.isLoading` property to disable the publish flow trigger button until all of the data required to manage the flow is available
- updated `publish-flow` modal to use some of the initially available `publishOptions` data
refs: https://github.com/TryGhost/Team/issues/1548
- this moves from a secondary dropdown to it being the main title one
- includes a few style fixes including fixing resources box in dark mode
refs: https://github.com/TryGhost/Team/issues/1531
- css grid was good when the layout was more complex but it's less needed now
- tried out some subtle gradients for the resource box
- tidied and cleaned up some css that wasn't needed anymore
refs: https://github.com/TryGhost/Team/issues/1547
- moved to horizontal bar chart
- made the tooltips work differently for this
- added in a simple legend for the cadence chart
- style issues remain but wanted to get functionality in there first
* Subtle tweaks to the recent posts
refs: https://github.com/TryGhost/Team/issues/1531
* Combining Recent Posts and Members Activity together and other layout tweaks
refs: https://github.com/TryGhost/Team/issues/1531
- attempting to combine recent posts and members activity together
- various layout tweaks to make this work better
- tons of tiny style tweaks
Enables splitting of multiple newsletters backend and ability to add newsletters behind different flags. This allows release and testing of all the new backend behavior for multiple newsletters to work with the default newsletter, and later allow sites to create multiple newsletters.
no issue
- depending on when the newsletter settings route is accessed we would sometimes show an empty newsletter list
- the problem stems from the use of a non-reactive fixed list of displayed newsletters where we manually update the list when we know the list should change. On initial load we were using `await store.findAll('newsletter')` then updating the displayed list, however the default behaviour for `store.findAll()` is to immediately return a live array - this doesn't work for our use-case because we'd then potentially update our displayed list from incomplete data
- added the `{reload: true}` option to the `findAll()` call to force a wait for the API request to finish before updating the displayed list of newsletters
refs https://github.com/TryGhost/Team/issues/1542
With the old publish menu flow the `Ctrl/Cmd+Shift+P` would immediately publish without showing any of the publish options which isn't ideal. For the redesign we'd like to try showing the publish flow modal instead.
- added key handler for the shortcut to the publish-flow triggering button
- added `ignoreBackdropClick` option to the publish flow modal and support for it in our modal backdrop click handler
- the shortcut simulates a click on the button which when the modal is open equates to a backdrop click meaning repeated presses of the Cmd+Shift+P shortcut resulted in glitchy modal open/close behaviour
refs https://github.com/TryGhost/Team/issues/1542
- adds `<EditorLabs::PublishManagement>` component that displays the relevant button for triggering publishing flows and will eventually store publish options for the editing session duration and manage the saving flow
- displays a "Publish" button that triggers the publish flow modal
- adds `editor-labs/publish-flow` full-screen modal containing a static mockup of the desired sentence-structure publish options design
refs https://github.com/TryGhost/Team/issues/1532
- added `showHeaderName` attribute to newsletter model
- added attribute toggle to the newsletter design settings form
- updated newsletter preview behaviour
- if both title and name are on, show name as a subtitle
- if title is off but name is on, show name as main title
- adjusted higher-level "show header" and "show header title" conditionals to account for the new setting
refs: https://github.com/TryGhost/Team/issues/1531
- broke apart the combined chart
- added back in the paid mix chart
- separated out the mini charts into separate components
- made top chart work with total, paid and free
- added in an overview section back at the top for total, paid, free
- made metric labels and values larger and easier to parse
Co-authored-by: Simon Backx <simon@ghost.org>
refs 50c762e222
- the count should only include members that are subscribed to active newsletters
- the filter change was accidentally included in a previous commit (50c762e222)
- removed the unnecessary `{{concat}}` usage
closes https://github.com/TryGhost/Team/issues/1537
- added conditional around the create confirmation modal display so it's only shown when attempting to save a new newsletter record
closes https://github.com/TryGhost/Team/issues/1530
- added confirmation modal that uses passed in archive task when confirming to provide feedback on progress
- switched archive link from immediately triggering the archive task to an action that launches the confirm modal
no issue
When multiple newsletters existed, the actions dropdown menus were all rendered on top of each other but hidden with CSS. This resulted in clicks that you expected to open an actions menu immediately triggering actions on a newsletter higher up in the list.
- switched from `<GhDropdown>` to `<GhBasicDropdown>` which adds/removes the dropdown content elements rather than rendering everything and hiding with CSS
- updated styling to match previous implementation
- added `.anim-fade-in-scale` classes for use with `{{css-transition}}` so we can keep the open/close animation
- `ember-basic-dropdown` does have support for transitioning in/out CSS classes but they are only triggered on the first open/close for each menu which resulted in oddly inconsistent behaviour with multiple menus in a list
- close animation doesn't actually work because the outer elements are removed by `ember-basic-dropdown` preventing `css-transitions` from performing it's animation
refs https://github.com/TryGhost/Team/issues/1528
- used the already-loaded newsletters list to pass the slugs of active newsletters to the confirm modal, this allows use of the `{{members-count-fetcher}}` resource with the query `/members/?filter=newsletters:[...slugs]` to fetch a member and full count metadata
- added inclusion of `{{join}}` helper from `ember-composable-helpers` addon
refs 8e120a74d6
- we use `data-test-state` inside of some modals which also use `<GhTaskButton>` which caused unrelated tests to start failing due to a change in matching element counts
refs 502fcaba3c
- the conditional for `isFailure` was wrong meaning we were showing the idle state unintentionally
- fixed the conditional so it checks for the return value rather than a `null` error
- updated the template with test selectors so it's easier to determine state where class names are not sufficient to differentiate
refs https://github.com/TryGhost/Team/issues/1528
- adds "opt-in existing" toggle to newsletter modal that's only shown when creating a newsletter
- defaults to true
- updated newsletter save flow to show confirmation before creation
- alters message to reflect auto-subscribe selection
- count of existing subscribed members is not implemented as it's not yet supported by the API
- updated newsletter adapter and save flow to use auto opt-in selection
- when option is checked the save URL is changed to `POST /members/?opt_in_existing=true`
- modified task button component to ignore a task return value of `canceled` so when it's received the buttons returns to the idle state instead of showing a saved or failed state
- used by save routine when the "Back to edit" button is clicked in the create confirmation modal
no issue
- member records are not re-fetched when navigating from the members list to the member details screen, instead the already loaded member object is passed through to the route directly to provide a faster navigation experience
- however, the objects used in the member list are proxy objects in order to support the lazy-loading infinite scroll. Proxy objects require the use of `get()` so errors were thrown when the newsletter subscription toggles were used
refs https://github.com/TryGhost/Ghost/pull/14491
- API endpoint used when completing verification of a newsletter email change has moved to `PUT /newsletters/verifications/` to follow our API patterns
refs https://github.com/TryGhost/Team/issues/1513
- `sender_name` is now nullable with a fallback to the site title
- updated new-newsletter route
- removed default setting of site title in `senderName` of the new newsletter instance
- removed extra checks when showing unsaved changes modal as we no longer need to compare the `senderName` attribute against the site title
- updated newsletter preview so the sender name falls back to the site title
- updated sender name input placeholder to show the site title
- removed not-empty validation
- fixed the switch to "multiple newsletter" state in the background of the new-newsletter modal
- problem was `displayingDefault` getter was looking at all active newsletters rather than just the filtered ones so it was counting the new-but-unsaved newsletter even though it wasn't displayed in the list
- fixes layout glitch when the new-newsletter modal animates out after cancelling creation
refs https://github.com/TryGhost/Team/issues/1492
We have a dedicated newsletter preference section with multiple newsletters in member detail screen, so the generic subscribed toggle can be removed.
refs https://github.com/TryGhost/Team/issues/1521
- Formatted the number correctly in the tooltip
- Correctly get the currency that is used in the MRR stats and show that symbol instead of a hardcoded $
refs https://github.com/TryGhost/Team/issues/1492
Allows site owners to manage member's newsletter preference directly in Admin.
- also adds `visibility` property for newsletter model
- updates members test model to include `visibility`
refs: https://github.com/TryGhost/Team/issues/1462
- moved the delta graph into the revenue graph of the main combined graph
- made the secondary dropdown work again
- updated some chart titles
- tidied up the code and styles to make it work well
no issue
The close button in the unsaved changes modal used the `@close` action directly compared to the "Stay" button which used `(fn @close false)`. The close button version without explicit arguments resulted in the first argument being a `PointerEvent` instance which if checked as a modal return value as `if (shouldClose)` would evaluate as truthy therefore matching the "Leave" behaviour instead of the "Stay" behaviour.
- changed modal to explicitly call `(fn @close false)` when the close button is clicked
- updated design settings route to have an explicit `shouldLeave === true` check so default behaviour is always "Stay"
refs https://github.com/TryGhost/Team/issues/584
refs https://github.com/TryGhost/Team/issues/1498
- updated newsletter save routine in `edit-newsletter` modal to open an email confirmation modal if the API indicates one was sent
- modal indicates that the previously set or default email will continue to be used until verified
- response from API when saving looks like `{newsletters: [{...}], meta: {sent_email_verification: ['sender_name]}}`
- added custom newsletter serializer and updated model so that the `meta` property returned in the response when saving posts is exposed
- Ember Data only exposes meta on array-response find/query methods
- https://github.com/emberjs/data/issues/2905
- added `/settings/members-email-labs/?verifyEmail=xyz` query param handling
- opens email verification modal if param is set and instantly clears the query param to avoid problems with sticky params
- when the modal opens it makes a `PUT /newsletters/verify-email/` request with the token in the body params, on the API side this works the same as a newsletter update request returning the fully updated newsletter record which is then pushed into the store
- removed unused from/reply address code from `<Settings::MembersEmailLabs>` component and controller
- setting the values now handled per-newsletter in the edit-newsletter modal
- verifying email change is handled in the members-email-labs controller
- fixed mirage not outputting pluralized root for "singular" endpoints such as POST/PUT requests to better match our API behaviour
refs: https://github.com/TryGhost/Team/issues/1462
- added back in the main title to the top chart
- brought back the main metric background and centered buttons
- adjusted lots of spacing
- made the chart ticks for main graph dynamic
- improved the look of the breakdown graph
refs https://github.com/TryGhost/Team/issues/1510
- Fixes site status not loading (https://github.com/TryGhost/Team/issues/1510) for mocked data because of tasks were already pending (reloadAll now cancels them first)
- Reload no longer required when switching anchor chart type
- Removed paidOptionSelected (fixes bug when swiching)
- Moved did-insert of anchor chart to topmost element
- Renamed chartDisplay values
refs https://github.com/TryGhost/Team/issues/1302
* Tweaked the getIcon() function to better support the new event data variable for cancelled
* Added back in info for events across all activity lists
Co-authored-by: James Morris <moreofmorris@users.noreply.github.com>
refs: https://github.com/TryGhost/Team/issues/1462
- added in dynamic dark mode grid lines for the charts
- added in some subtle other dark mode tweaks for borders
- limited the recent posts to 3 instead of 5
refs: https://github.com/TryGhost/Team/issues/1507
- changed the layout over to use css grids instead of the random flex and divs
- cleaned up the based dashboard-v5 file so its rendering much cleaner components
- refactored and took out a ton of old css that wasn't needed anymore
- moved the dashboard-v5 css into it's own css file to keep things cleaner
- includes a few stylistic changes along the way
refs https://github.com/TryGhost/Team/issues/1500
- `senderEmail` is now nullable with a fallback to `noreply@{site domain}`
- `senderName` is not nullable and has no fallback
- updated preview and input placeholder to match real-world behaviour
- inserted site title as the default value when creating a new newsletter to avoid friction with the sender name needing to be filled in when saving
- switched `senderReplyTo` input field to a select with "newsletter" and "support" options
- added basic `<Inputs::Select>` component as `<OneWaySelect>` had re-rendering issues causing loss of selected value when the label of the newsletter email changed to reflect a custom newsletter email value
no issue
- when displaying only the default newsletter there's no option to drag/re-order but the border was still moving on hover as it does when displaying the drag handle
- updated the class name to take `displayingDefault` into account when adding the draggable class
closes https://github.com/TryGhost/Team/issues/1483
- updated newsletters list to use `<SortableObjects>` and `<DraggableObject>`
- swapped the `filteredNewsletters` reactive getter for a tracked property because `<SortableObjects>` replaces the value with a new array when re-ordering which isn't compatible with a getter
- required explicit update of the list any time the list should change through filter swap, archive, unarchive
- required explicit update of the list via router event when leaving the "new newsletter" route so any newly added newsletter can be displayed
- added action for handling update of `sort_order` properties when a re-order occurs
- updates every newsletter setting `sort_order` of the active newsletters first based on the new order, followed by all archived newsletters following their existing order
- disabled sorting of newsletters in the archived newsletters list
- hides the grab handle and disables the resize on hover
- allowing re-order of archived newsletters would complicate the re-order+save algorithm and re-ordering archived newsletters doesn't have a use-case
refs https://github.com/TryGhost/Team/issues/1487
- Fetches the staff picks from the RSS feed
- Shows the first 5 staff picks (amount is adjustable)
- Adds utm_source=ghost to external links
- Includes a temporary CSS class to keep it a bit orderly
refs https://github.com/TryGhost/Team/issues/1488
- Includes a new component that fetches the latest X newsletters.
- Displays these newsletters using design from old dashboard.
- Currently shows 10 newsletters, but we'll want to change that later.
- Temporary CSS class added.
* Trying out a tooltip alternative for combined graph in new dashboard
refs: https://github.com/TryGhost/Team/issues/1467
* Trying out a different type of interaction with the combined graph for the new dashboard that includes different style
refs: https://github.com/TryGhost/Team/issues/1467
* Working through the interface and code to majorly clean up for the new Dashboard
refs: https://github.com/TryGhost/Team/issues/1462
- lots of moving around css
- trying out some different layouts
- refactoring lots of code
- known bug: paid graphs don't work
- known bug: without newsletters, layout breaks
* Finishing up the basic styling of the new dashboard to be more presentable
refs: https://github.com/TryGhost/Team/issues/1462
- add an animation between the top metrics on combined graph
- ensure all graphs are responsive to parent container
- refactor many of the components and tidy up the styles
- tighten up spacing, headers, chart heights and more
- make the tooltip hovers a little more presentable
- balance the colors to be more muted, for the moment
- a million other tiny tweaks
refs https://github.com/TryGhost/Team/issues/1486
Includes a new component that correctly fetches the changelog and displays them in the old format (still requires some design changes).
closes https://github.com/TryGhost/Team/issues/1476
- added dropdown for switching between active and archived newsletters
- modified the "default" newsletter display so it's only activated when a single active newsletter is shown
- added ability to un-archive a newsletter with a switch between "archive" and "un-archive" actions based on newsletter status
- if all archived newsletters are un-archived, automatically switches to "active" filter so you're not left with an empty list
closes https://github.com/TryGhost/Team/issues/1479
- updated post adapter to append `?newsletter_id=xyz` when passed a `newsletterId` adapterOption
- updated editor save task to pass `options.newsletterId` through as `adapterOptions.newsletterId`
- set up `post.newsletter` relationship ready for handling embedded newsletter association from the API
- explicitly deleted when serializing back to the API as it doesn't yet ignore the attribute
- updated `<GhPublishmenu>` for newsletter support
- fetches newsletters on first render so they are available in the dropdown
- sets "default" (first in the ordered list) newsletter as the initially selected newsletter
- adds newsletter dropdown to draft publish menu
- passes `newsletterId` option to editor save task when it's set
This is a minimal implementation for testing. Not included:
- correct free/paid member counts based on selected newsletter
- correct member count in confirmation modal
- indication of selected newsletter for scheduled post
refs https://github.com/TryGhost/Team/issues/1441
- switched "leave settings" confirmation modal on members email settings screen over to modern modal pattern
- removed unused `showEmailDesignSettings` property and `closeEmailDesignSettings()` action on `<Settings::MembersEmailLabs>` component
- the used property and action live on the controller, looks like it was a copy/paste hangover when functionality was moved to a component
- added newsletter model
- includes design-related attributes which are not yet supported by the API but are due to be added
- includes `default` attribute but there is no setting for it, due to be removed from the API but it's needed for save not to error for now
- set up basic mirage model and endpoints
- added validation for main settings to match API validation
- added `EditNewsletter` modal
- separate tabs for general newsletter settings and design-related settings
- used for both creating and editing newsletters
- added `/settings/members-email/newsletters/new` and `/settings/members-email/newsletters/:id` routes
- both display the `EditNewsletter` modal on top of the members-email settings screen with the appropriate newsletter model
- updated `<Settings::MembersEmailLabs::NewsletterManagement>` component to work with real newsletter model instances and the new add/edit routes
- removed now-unused `newsletter` service that was providing mocked data for earlier design iteration
refs https://github.com/TryGhost/Team/issues/1441
- pulls newsletter-related functionality into one place to keep higher-level components from knowing about too many concepts and becoming bloated
- updated temporary newsletters service to have fully tracked objects so the `active/archivedNewsletters` properties can be closer to how they will work with full models
* Basic work to combine the three line graphs for the new dashboard
refs: https://github.com/TryGhost/Team/issues/1467
- combined three line graphs into one main one at the top
- still working on this, so some code is a little rough
* Tidying up a few bits of consolidated graph in new dashboard
refs: https://github.com/TryGhost/Team/issues/1467
* Updated chart anchor component for removed member counts
no issue
* Updated chart paid members to not reload on days change
no refs
* Moved did-insert to top element in chart-anchor
* Fixed chart anchor to use filled member data
* Replaced chart anchor divs with buttons
* Tweaking up the paid graphs below anchor to improve visuals
refs: https://github.com/TryGhost/Team/issues/1467
* Fixed missing type attributes on buttons in chart anchor
* Updated MMR to MRR for the new consolidated graph
refs: https://github.com/TryGhost/Team/issues/1467
* Added real MRR to chart anchor
* Added open rate percentage data to chart email
Co-authored-by: Simon Backx <simon@ghost.org>
no issue
- bumped version of our `ember-promise-modals` fork containing a workaround for modal promises missing their return values
- upstream issue: https://github.com/simplabs/ember-promise-modals/issues/565
- switched from a GitHub ref to a proper published package to avoid issues with yarn not bumping versions of the fork for developers who installed an earlier version
refs https://github.com/TryGhost/Team/issues/1468
- Implemented loadSiteStatus with real data
- Replaced unused stripeEnabled with hasMultipleTiers
- hasMultipleTiers=false hides the tiers paid mix chart
- Improved loading and updating fake state
- Removed deprecated loadMembersCounts method in dashboard stats service
closes https://github.com/TryGhost/Ghost/issues/14354
When setting/cleaning up the publish menu state we were incorrectly reverting to the default "publish & send" state when a post was already set to be email-only. This resulted in an unexpected and non-obvious switch to "publish & send" when re-scheduling a scheduled email-only post.
- updated the publish menu setup and cleanup routines to account for scheduled, email-only posts
- fixed the header in the publish menu to say "sent" rather than "published" when an email-only post is scheduled
refs https://github.com/TryGhost/Team/issues/1443
- Includes support for 'all' data in member count charts
- Fixed reloading of MRR data when switching between days
- Loading data now always returns a 'promise' instead of just dropping it
- Tiers and cadence paid mix chart added
- Defaults to mocked data = off (required to prevent loading paid mix tiers on page load)
- Note that there is still some discussion about the correctness of the tiers paid mix data, refs Slack https://ghost.slack.com/archives/C02G9E68C/p1648717224956659
refs a4ca693871
- label's "for" was removed to enable more direct use of the checkbox enabling keyboard usage but the test was not updated to reflect the change
refs https://github.com/TryGhost/Team/issues/1441
- duplicated route/controller/template and component to `-labs` versions so larger changes and refactors can be made without affecting the GA code
- added redirect for `/settings/members-email -> /settings/members-email-labs` when `multipleNewsletters` flag is enabled
- cleaned up multiple-newsletters related code from the non-labs component
refs: https://github.com/TryGhost/Team/issues/1462
- remove dummy percentages where not necessary
- trying out a narrower width for the dashboard
- added in a basic layout for the various charts
- added more specific styles to each of the graphs
- tried out a different way of displaying metrics
- different way to show headers for each module
- made the grid and flex layouts a little more flexible
- there are some bits to still clean up with code
refs https://github.com/TryGhost/Team/issues/1443
- Fetch member counts from 30 days ago
- Added Percentage component to show +1%, -1% or = changes
- Fixed: emails sent number was not formatted
- Fixed: wrong dates were used for some stats
refs https://github.com/TryGhost/Team/issues/1443
- Now fetches email models instead of posts
- Fetches up to 8 emails
- Autofills missing emails, so we always have 8 emails
- Changed data structure of emailOpenRateStats variable in dashboard stats service
refs: https://github.com/TryGhost/Team/issues/1445
- threw in some static generic resources modules based off offers styling
- these will be dynamic but adding them to pad out prototype
refs https://github.com/TryGhost/Team/issues/1443
- Also moved loading of charts outside of constructors to avoid infinite update loops in Ember
- Random loading delay when using fake states
refs https://github.com/TryGhost/Team/issues/1444
- Moved control panel to separate component
- Moved storage of amount of graph days to load to dashboard stats service
- Moved storage of engagement filtered status to dashboard stats service
- Dropdown state selector
- Save state in localstorage
- SiteStatus object and loadStatus methods in dashboard stats service and mock service
refs https://github.com/TryGhost/Team/issues/1447
- Added a few newsletter methods (browse, add, archive/un-archive)
- This temporary code helps the frontend implementation to be done quicker
- And helps getting a better understanding of the backend implementation (schema + api routes)
Refs https://github.com/TryGhost/Team/issues/1441
- Rearranged the page: publish-menu preview is removed because the publish flow will change.
- Email addresses setting removed because it will be set on an individual newsletter level
refs https://github.com/TryGhost/Team/issues/1432
- All mocking logic is moved to the dashboard-mocks service
- Added @days property support and loading to first dashboard 4 graphs.
- 2 years state button added
refs https://github.com/TryGhost/Team/issues/1432
- Added very basic state selection at the bottom of dashboard 5.0
- Added a dashboard stats service, who is responsible for fetching and returning stats data
- Added POC for days dropdown with communication and reload between ember components
- Added proper automatic number and plural formatting for member counts
refs: https://github.com/TryGhost/Team/issues/1436
- added in lots of demo graphs using EmberChart
- renamed some files in v5 folder for better conventions
- put each graph for new dashboard into separate components
refs https://github.com/TryGhost/Team/issues/1435
refs a47b61c1d4
A recent change for showing all subscriptions of a member on detail screen introduced a circular json structure with subscription -> tiers -> subscriptions, which throws an error on saving any member with paid subscription on member detail screen.
refs https://github.com/TryGhost/Team/issues/1141
Showing canceled subscriptions provide a more complete picture of the activity of a member.
- Given there is no `member.product` object when a subscription is canceled, use the `member.subscriptions.price.product` objects instead of `member.products`.
- applied boy-scout rule for linter errors and and code formatting
- removed `multipleTiers` flag conditionals as it's now GA
- set up subscriptions as a separate mirage resource so they are easier to work with
- updated `PUT /members/:id/` endpoint to match real API's complimentary subscription behaviour
- modified mirage member serializer to match API output
Co-authored-by: Kevin Ansfield <kevin@lookingsideways.co.uk>
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
refs https://github.com/TryGhost/Team/issues/559
refs 054a5f15f5
- with the update of `ember-promise-modals` we started to get deprecation warnings when using `modals.open('modal-component-name')`
- upcoming Ember build updates will introduce tree shaking but using run-time lookup of modal components by name works against that because it's not statically analysable
- switched to importing components and passing the component class directly, eg. `modals.open(ModalComponent)`
- standardized modal component class names with a `MyModal` style to get better behaviour in code editors when it auto generates imports
- dropped the modal defaults from the modals service because we can now use a static `modalOptions` property on the modal components themselves when we want to override the defaults
no issue
- dropped `id` attribute added to `<GhBenefitItem>` because it was only using the index resulting in multiple `id="1"` on the page which is invalid HTML and caused Glimmer to complain
- added a check for `portalPreviewIframe` existence when the portal message listener in the offer controller is fired because it was occurring out of sync with the tests and throwing async errors that were picked up in random later tests
no issue
- removed the count task state from the `disableEmailOption` getter so it doesn't get used to show the "Add members" notification before the count request has finished
no issue
- fixed duplicate `id` attribute on the specific people checkbox
- switched toggle behaviour from a click event on the surrounding div to a change event on the checkbox
- the surrounding `<label>` has appropriate `for` attribute so it acts as the click-to-change target
- added `aria-label` attributes to the checkboxes because the label element we're using does not surround any content that labels the checkbox
closes https://github.com/TryGhost/Team/issues/1399
- the publish/schedule save type was not being reset when closing the publish menu, even though the underlying post publish date _was_ reset leading to the publish menu and the post state being out of sync
- added a reset of the save type when closing the menu, this means "schedule" will need to be re-selected when re-opening the menu but that follows the same behaviour as the reset of the publish menu options
refs: https://github.com/TryGhost/Team/issues/1373
- Simplify the member details link on single member activity
- Adjust all the activity scrolling to work better at all sizes
- Make the header work properly with truncating at narrower viewports
- Remove unnecessary CSS and classes
- Remove the top line from the member detail box
- Move the member detail box so it stays when scrolling
- Make the empty state work with new member detail box position
- Better scrolling full width whilst not having full width like members
- Fix the subscriptions event icon which was a white box in dark mode
- Adjustments to global gh-list-scrolling styles at narrower viewports
- Test fully on narrower viewports and major browsers
refs: https://github.com/TryGhost/Team/issues/1373
- reduced from 10 to 5 to keep things visually simpler
- sneaked in a little colour tweak to link on activity member detail header
refs: https://github.com/TryGhost/Team/issues/1373
- changed searched name clear to say Clear Member as there was duplicates across the screen
- tried to tidy up the Member Detail link when filtered by members in Activity
- few tiny CSS tweaks
refs https://github.com/TryGhost/Team/issues/1408
- "Name" is the first filter in the list and has a basic value type so it makes sense to make it the default compared to label
The segment select UI for restricting post access to specific tier also showed a member count for selected tiers, which was not needed as that count is dynamic and not relevant for setting access level.
refs https://github.com/TryGhost/Team/issues/1035
- provides context on member's tier/status on default index table
- removes extra membership tier column as information is captured in status column
The tier visibility is now handled by visibility property on object, this change ensures portal preview is updated on a tier archive to show the correct Portal UI.
refs https://github.com/TryGhost/Team/issues/1408
- switched to `@tryghost/nql` packages to get access to latest releases
- updated `GET /members` mirage endpoint with a try/catch and explicit logging to make any errors from NQL more visible
- added "Name" filter option
- has `is`, `contains`, `does not contain`, `starts with`, `ends with` operators
- uses a plain text field for the input value
- added support for `~`, `-~`, `~^`, and `~$` operators when generating NQL queries from filter definitions
refs https://github.com/TryGhost/Team/issues/1418
- adds "Last seen" option to members filtering that lets you filter by date a member last logged in or opened an email with `before`, `on or before`, `on or after`, and `after` options
- adds "Last seen on x" data to the member details screen
refs https://github.com/TryGhost/Team/issues/1418
- drops the block usage of `<GhDatePicker>` for the "Last seen" input that added shortcut buttons
- not a full revert of https://github.com/TryGhost/Admin/pull/2291 as allowing block usage of the component is still useful for other component customisation
- removes CSS related to the calendar-with-shortcut buttons as we don't have any other use-cases for it at the moment
no issue
- `settings.get('timezone')` had a typo in the "on or before" nql filter generation meaning the date wasn't correctly converted to the site timezone when applying the filter
refs https://github.com/TryGhost/Team/issues/1419
- the `filterType` argument was never used and if it is needed the full filter instance is passed around which has the `.type` property on it anyway
- dropped the `setFilterValue` action inside `<Members::FilterValue>` component as it was only calling the passed-in action with the same arguments
- makes the code a little less noisy and easier to follow
refs https://github.com/TryGhost/Team/issues/1419
- continued cleanup of filtering code
- added `array` as a `valueType` for member filters removing the need for duplicated NQL generation code between `label` and `product` filters
- cleaned up duplicated relation string/operator handling
refs https://github.com/TryGhost/Team/issues/1419
- the `id` property isn't necessary for any of our use-cases and adds extra complexity to the code as we need to keep track of it and apply+increment it manually each time we work with filter instances
- dropped the property
- switched actions to pass the Filter instance rather than just the id so we can do direct compares when working on the filters array and modify properties on the Filter instance directly
- part of cleanup to reduce the amount of code/complexity in filtering so we can more easily refactor
refs https://github.com/TryGhost/Team/issues/1387
This will allow us to move from the portal_products and portal_plans settings to using the visibility property on tiers to determine whether or not a tier should be visible in Portal. This updates admin to handle tier visibility property based on changes in settings. Old portal settings update is temporarily kept in though will not be used for determining visibility going forward. Also removes default product visibility being set on stripe connect.
refs https://github.com/TryGhost/Team/issues/1406
- added fetch of a single member to the dashboard initialisation if we don't already have some members loaded in memory
- added `showMembersGraphs` getter used in the conditional for rendering the members graphs block component
- if `improvedOnboarding` flag is disabled, return `showMemberData` so existing functionality is retained
- will return `false` if until the single-member fetch has completed if we don't already have any members in memory
- returns `true` if any members exist or the "get started" dashboard resources block has been dismissed
refs https://github.com/TryGhost/Team/issues/1406
- separates concerns from the Dashboard controller so it's easier to refactor and change behaviour
- pre-req for introducing optional display of the graphs based on wider system status in a clean way
refs https://github.com/TryGhost/Team/issues/1410
- added block invocation support to `<GhDatePicker>` that exposes the calendar components used inside the datepicker dropdown allowing for customisation of the dropdown content
- updated "last seen" datepicker to use the block invocation support to add buttons that select typical "time ago" dates
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
no issue
- members having multiple subscriptions is not really expected but if it does happen then the most recently updated subscription is most likely to be the one that we're interested in showing the details of in the members table
- added `{{most-recently-updated arr}}` helper+function that will return the item in the array argument with the most recent "updated at" value
- uses `updatedAtUTC` or `updatedAt` or `updated_at` values so it will work against any of our models or un-transformed API response objects
- updated `<GhMembersListItemColumn>` to use a `mostRecentSubscription` getter when showing subscription data rather than assuming the first object in the subscriptions array should be displayed
refs https://github.com/TryGhost/Team/issues/1188
- The api throws a validation error when we try to add benefits with an empty name
- Before saving, we remove benefits with an empty name
- Added test for empty benefit names
refs https://github.com/TryGhost/Team/issues/1410
- we have problems translating an "x days ago" NQL filter back to the UI component so as a temporary measure we're switching to a datepicker input as we have a working solution for that
- a later iteration will add shortcut buttons for selecting typical "x days ago" dates in the datepicker
refs https://github.com/TryGhost/Toolbox/issues/222
- Admin API has the latest version alliased without a verion to prepare to the switch in Ghost v5. As we completely control Ghost Admin it makes sense to dogfood our latest changes
- Starting with Ghost v5 there will be no API versioning in the URL, this is groundwork for those new realities
no issue
- shortened invalid date format error message in `<GhDatePicker>` to "Date must be YYYY-MM-DD" so it's less likely to wrap
- added `@maxDateError` and `@minDateError` arguments to `<GhDatePicker>` allowing override of the default "Must be on or before xxxx-xx-xx" message shown when the inputted date is outside of the allowed range
- updated `<GhDatePicker>` usage in the "Created" member filter to use "Must be in the past" error message when a future date is selected
closes https://github.com/TryGhost/Team/issues/1319
Due to how JS implements numbers, it's possible that when we multiple a number with 2 decimal places by 100 that we do not end up with an integer e.g. 9.95 * 100 = 994.999...
This is not a valid price for the API and so we must round it to the nearest integer. We round off prices both at source as well as in ties serializer to make sure we never send non integer prices to API.
no issue
- added datepicker based filter for the next billing date of paid subscriptions
- updated table to add "Next billing date" column when filtered, showing the paid subscription's current period end date
no issue
- if `<option>` elements are re-rendered without the parent `<select>` being re-rendered, Firefox does not pick up the new `selected` option
- we were seeing this behaviour when the options in an operator select get updated after changing the filter type, Firefox was always selecting the first option rather than the "selected" option
- switched the `filters` array from an EmberArray instance over to a tracked built in Array instance and changed the "edit" behaviour when changing a filter type so we fully replace a `Filter` instance in the filters array with a new instance which causes an overall re-render of that filter row avoiding the Firefox issue
no issue
- added datepicker based filter for the start date of paid subscriptions
- updated table to add "Start date" column when filtered, showing the paid subscription's start date
no issue
- prevents automatically filtering out all of today's members as soon as a "Created" filter is added as happened when the default was "before"
no issue
- updated default date filter values so they match the date in the site timezone rather than local timezone
- fixes problems such as defaulting to 2022-03-01 when you're in UTC@4AM but the current date in the site timezone of UTC-5 at that time is 2022-02-28
no issue
- updated NQL generation to adjust dates in filter string so they are the UTC equivalent
- eg, in UTC-5 "created on or after 2022-02-22" becomes `created_at:>='2022-02-22 05:00:00'`
- updated NQL parsing to take a UTC date filter, convert to a date in the site timezone, then convert to a local date in a way that the datepicker input value matches the respective site timezone date
- eg, in UTC-5 `created_at:<='2022-02-22 04:59:59` becomes "created on or before 2022-02-21"
closes https://github.com/TryGhost/Ghost/issues/13611
- added `{{moment-site-tz}}` helper for transforming any date into the selected site's timezone
- allows for use on any date in the system
- keeps transformation a display-level concern
- updated members table to use `{{moment-site-tz}}` to transform the date before display
refs https://github.com/TryGhost/Admin/pull/2274
- every time the filters UI was opened we were fetching the products list from the API which seemed wasteful and was also causing the filter type select to re-render after it had initially rendered with a selected value
- Firefox appears to have a bug where if a select's `<options>` list is re-rendered and that list contains `<optgroup>` elements then it loses the previous select value, reverting to the first `<option>` in the list
- switched to only fetching the products list once when the overall filter component is first rendered and used `peekAll('product')` so we always have a live count of the number of products in Ember Data's store without having to fetch anything
refs https://github.com/TryGhost/Team/issues/1390
- added `membersTimeFilters` feature flag and labs toggle
- added `<GhDatePicker>` component that lifts functionality from the `<GhDateTimePicker>` component
- `<GhDateTimePicker>` has not yet been refactored to use the new component internally as there are some odd/complex interactions with error handling with it's existing use-cases and they are in critical publishing paths so the refactor doesn't belong as part of this change
- added "Created at" filter type to members filters
- uses new date picker component for input value
- has "before", "on or before", "after", "on or after" operators
- "on" and "not on" operators were skipped as they require two NQL statements to represent, breaking the current 1:1 statement:filter approach used in the NQL-based query param parsing
No issue
- Changed the Member details page to be more scalable and flexible, depending on whether creators are using subscriptions, emails, and stats.
* Hidden email stats on member detail page when subscriptions are off
* Hid subscription box on member details page when Stripe is not connected
* Updated copy and layout of member details page
* Updated old activity feed styles on member page
* Fixed padding issue for empty activity feed
* Fixed current and new activity feed
* Added Last seen to member details page behind feature flag
* Updated lint todo file
* Fixed spacing issue in member details
no issue
- a new member has no `id` but we were passing the empty value through to the members event fetcher resulting in a query that fetches all events
- extracted the empty state of the member activity feed to a separate component so we could use it in multiple places
- added a conditional around the main activity feed template to shortcut it when a new member is passed in
closes https://github.com/TryGhost/Team/issues/1029
- allows site owner to filter members on specific tier
- needs tiers beta flag enabled and site should have more than 1 paid tiers.
no issue
- updated the selection of available filter properties to remove any with the "Email" group when the default email recipients setting is set to "disabled"
closes https://github.com/TryGhost/Team/issues/1388
- added `lastSeenAtUTC` property to member model
- added `last_seen_at` filter column handling to `<GhMembersListItemColumn>`
- uses same format as the "Created" column showing the date only and a "days ago" string
closes https://github.com/TryGhost/Team/issues/1384
- when setting the filter type, change the filter's relation/operator to match the filter type's first operator so the filter string and the UI are in sync
closes https://github.com/TryGhost/Team/issues/1307
- adds "Last seen more/less than x days ago" option to members filtering UI
- re-ordered a few related objects/arrays so they are consistent
closes https://github.com/TryGhost/Team/issues/1381
refs 21b4b15a1c
- when the email newsletter settings was refactored, the `emailTrackOpens: reads('settings.emailTrackOpens')` was removed as it's a confusing redirection but it's usage in the toggle action was missed
refs https://github.com/TryGhost/Team/issues/1358
- added acceptance tests for members settings screen
- subscription access management
- default post access management
- free tier management
- fixed `enableLabsFlag()` test helper overwriting existing flag settings when enabling another one
- updated API mocks and fixtures
- matched product fixtures to default tiers-enabled products
- updated product API mocks to include benefit handling
closes https://github.com/TryGhost/Team/issues/1309
closes https://github.com/TryGhost/Team/issues/1336
- the error occurred because the `<Members::FilterValue>` component detaches it's value from the passed in value it was initialized with. Due to the detached handling, after changing the filter type away from the default label filter to a text input based filter, the internal value stayed as `[]` even though the filter type's value was changed. When the blur event was triggered in that state the internal `[]` value was used to update the filter resulting in an invalid filter string
- added a quick-fix of assigning the input's value in the blur event handler meaning we get the expected `''` value
- allows for passing tests to be created ready for a deeper fix/refactor later
- added `nql` dependency and used it in the `GET /members` API mock to match members against the filter param so behaviour matches the real API
- tested increase in code size - dev build increased by ~180KB, no difference in prod
- added acceptance tests for all current filters and search
refs: https://github.com/TryGhost/Team/issues/1373
- added some additional styles to dropdown to better handle names and emails together
- widened the search box to better fit names and emails
closes https://github.com/TryGhost/Team/issues/1320
- added `@allowEdit` argument to `<GhMemberLabelInput>` and changed the dropdown to only show the edit label when `@allowEdit` is truthy
- updated usage in the filter UI and members detail screens to allow editing
refs https://github.com/TryGhost/Team/issues/1320
- added a tracked `labels` property in `<ModalImportMembers::CsvFileMapping>` and passed it through to `<GhMembersLabelInput>` so that it has a list of labels that can be added to
- fixed error from sorting labels if one doesn't have a name
- added acceptance test for selecting labels in the members import flow
refs https://github.com/TryGhost/Team/issues/1320
- fixed event handling in `gh-file-input` for test-initiated uploads
- added `POST /members/upload/` API mock that emulates uploading a single member
- it's enough for this particular test and can be expanded as needed
- added acceptance test that does a simple 1-member, no Stripe, CSV upload with no mapping changes
refs https://github.com/TryGhost/Team/issues/1320
- start of acceptance tests ready for more detailed testing
- added ignore of `no-duplicate-landmark-elements` lint rule in import modal template
- the rule was a false flag because the conditionals only allow one `<header>` element to be rendered at a time
No ref
- When memberships are set up but no members are present, we would display the email sending UI in a disabled state. We're now notifying the user why they can't send emails and how to start sending
Refs 72d3d6debc
- Fixed PSM error by moving the action on to the button and change the styling so the button is the main styled element that fills the whole area
- Hid the post-list-item error, which will warn in 30 and error in 60 days
refs 8052166cbe
- when migrating the bulk delete logic to a new modal the `isTesting` property was missed meaning test runs were triggering actual downloads, littering your downloads folder with repeated CSV files
refs https://github.com/TryGhost/Team/issues/559
Members controller was becoming bloated and difficult to follow due to catering for many different concerns.
- converted old modal to newer promise-modal style
- pulled full bulk unsubscribing logic out of the members controller and into the modal so logic is contained in one place
refs https://github.com/TryGhost/Team/issues/559
Members controller was becoming bloated and difficult to follow due to catering for many different concerns.
- converted old modal to newer promise-modal style
- pulled full label-removing logic out of the members controller and into the modal so logic is contained in one place
refs https://github.com/TryGhost/Team/issues/559
Members controller was becoming bloated and difficult to follow due to catering for many different concerns.
- converted old modal to newer promise-modal style
- pulled full label-removing logic out of the members controller and into the modal so logic is contained in one place
refs https://github.com/TryGhost/Team/issues/559
Members controller was becoming bloated and difficult to follow due to catering for many different concerns.
- converted old modal to newer promise-modal style
- pulled full label-adding logic out of the members controller and into the modal so logic is contained in one place
- added `{{members-count-fetcher}}` resource that allows for member counts to be fetched directly from templates avoiding duplicated code
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
refs https://github.com/TryGhost/Team/issues/1309
General cleanup to switch to more modern idioms.
- removed unnecessary assignment of properties in component's `constructor`
- dropped use of `EmberObject`, use an explicitly defined `Filter` class instead
- marked properties that change as `@tracked`
- switched to direct property setting with `=` instead of `.set()`
refs https://github.com/TryGhost/Ghost/issues/14101
- dropped use of unnecessary `<GhTextInput>` component
- switched action calls over to standard `{{on "event"}}` rather than the sometimes error-prone overriding of EmberObject component event handlers
no issue
- currently the components are screen-specific rather than generalised so shouldn't have the `gh-` prefix
- fixed linter error for confusing `{{#unless}}...{{else}}` usage
no issue
- the members filtering is out of labs, we don't need to keep the labs component naming around
- renamed `-labs` components/classes to non-labs naming, replacing old and unused non-labs components where necessary
refs https://github.com/TryGhost/Ghost/issues/14101
- extracted the ratio zoom handling to a `{{ratio-zoom}}` modifier to clean up the component and avoid needing lifecycle hooks that don't exist in Glimmer components
- disabled `no-nested-interactive` linting in the template - not ideal but we'd need a much bigger design refactor to eliminate the nested links
refs https://github.com/TryGhost/Ghost/issues/14101
- swapped use of `<LiquidWormhole>` to `{{#in-element}}` because we weren't animating anything
- we can now use `{{css-transition}}` instead if we want to animate in the future
- swapped use of `ShortcutsMixin` for ember-keyboard's `{{on-key}}` modifier
- added `{{query-selector}}` helper so we can grab an element from inside the template rather than requiring a backing component function (used to pass the wormhole element to `{{#in-element}}`)
- added `{{on-resize}}` modifier so the `resizeDetector` service can be used directly from the template rather than requiring a backing component to wait for render and use query selectors to grab an element
no issue
- shows an unsplash button when no image is present, opening the full unsplash selector when clicked
- behind the `improvedOnboarding` labs flag
closes https://github.com/TryGhost/Team/issues/1294
- ensures latest member activity is shown when improvedOnboarding feature is enabled no matter what the `editorIsLaunchComplete` value is to better show what the dashboard will look like when the launch wizard is removed
refs https://github.com/TryGhost/Team/issues/1310
We want to use parts of the "Brand setting" form in a separate streamlined settings screen after site setup but that wasn't possible without a lot of duplication.
- extracted individual form fields into separate components for re-use
- included minor refactors like using `uploader.registerFileInput` and `uploader.triggerFileDialog` instead of continually duplicating the same file input trigger method
- fixed accessibility issues
- changed input titles from `<div>` to `<label>` and associated with the component's input fields
- changed `<img {{on "click" upload}}>` to `<input type="image">` so they act as proper buttons and are linked to the label (required a styling change so `img` and `input[type="image"]` are treated equally)
- finished cleanup of `.description-container-labs` by renaming to `.description-container`
