Ghost/ghost/admin/app/components/settings/form-fields/publication-icon.js
Kevin Ansfield 14c0c5ff65 Refactored general design settings form components
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`
2022-02-04 16:04:58 +00:00

28 lines
651 B
JavaScript

import Component from '@glimmer/component';
import {
ICON_EXTENSIONS,
ICON_MIME_TYPES
} from 'ghost-admin/components/gh-image-uploader';
import {action} from '@ember/object';
import {inject as service} from '@ember/service';
export default class PublicationIconFormField extends Component {
@service settings;
iconExtensions = ICON_EXTENSIONS;
iconMimeTypes = ICON_MIME_TYPES;
@action
imageUploaded(results) {
if (results[0]) {
this.update(results[0].url);
}
}
@action
update(value) {
this.settings.set('icon', value);
this.args.didUpdate('icon', value);
}
}