Skip to content

Commit

Permalink
DEV: Modernise csv-uploader component
Browse files Browse the repository at this point in the history
- remove uppy mixin
- native class
- glimmer component
- gjs file format
  • Loading branch information
davidtaylorhq committed Oct 24, 2024
1 parent b7858ef commit a7d6841
Show file tree
Hide file tree
Showing 4 changed files with 66 additions and 56 deletions.
66 changes: 66 additions & 0 deletions assets/javascripts/discourse/components/csv-uploader.gjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
import Component from "@glimmer/component";
import { getOwner } from "@ember/owner";
import didInsert from "@ember/render-modifiers/modifiers/did-insert";
import { inject as service } from "@ember/service";
import { or } from "truth-helpers";
import UppyUpload from "discourse/lib/uppy/uppy-upload";
import icon from "discourse-common/helpers/d-icon";
import i18n from "discourse-common/helpers/i18n";

export default class CsvUploader extends Component {
@service dialog;

uppyUpload = new UppyUpload(getOwner(this), {
type: "csv",
id: "discourse-post-event-csv-uploader",
autoStartUploads: false,
uploadUrl: this.args.uploadUrl,
uppyReady: () => {
this.uppyUpload.uppyWrapper.uppyInstance.on("file-added", () => {
this.dialog.confirm({
message: i18n(`${this.args.i18nPrefix}.confirmation_message`),
didConfirm: () => this.uppyUpload.startUpload(),
didCancel: () => this.uppyUpload.reset(),
});
});
},
uploadDone: () => {
this.dialog.alert(i18n(`${this.args.i18nPrefix}.success`));
},
validateUploadedFilesOptions: {
csvOnly: true,
},
});

get uploadButtonText() {
return this.uppyUpload.uploading
? i18n("uploading")
: i18n(`${this.args.i18nPrefix}.text`);
}

get uploadButtonDisabled() {
// https://github.com/emberjs/ember.js/issues/10976#issuecomment-132417731
return this.uppyUpload.uploading || this.uppyUpload.processing
? true
: null;
}

<template>
<span>
<label class="btn" disabled={{this.uploadButtonDisabled}}>
{{icon "upload"}}&nbsp;{{this.uploadButtonText}}
<input
{{didInsert this.uppyUpload.setup}}
class="hidden-upload-field"
disabled={{this.uppyUpload.uploading}}
type="file"
accept=".csv"
/>
</label>
{{#if (or this.uppyUpload.uploading this.uppyUpload.processing)}}
<span>{{i18n "upload_selector.uploading"}}
{{this.uppyUpload.uploadProgress}}%</span>
{{/if}}
</span>
</template>
}
12 changes: 0 additions & 12 deletions assets/javascripts/discourse/components/csv-uploader.hbs

This file was deleted.

43 changes: 0 additions & 43 deletions assets/javascripts/discourse/components/csv-uploader.js

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,6 @@
<BulkInviteSampleCsvFile />

<CsvUploader
@id="discourse-post-event-csv-uploader"
@uploadUrl={{concat
"/discourse-post-event/events/"
@model.event.id
Expand Down

0 comments on commit a7d6841

Please sign in to comment.