Skip to content

Commit 2e4076f

Browse files
jjaffeuxjjaffeux
authored
DEV: standardise toasts duration (#32741)
Toasts can now have two durations: - `short` -> 3000ms - `long` -> 5000ms For backwards compatibility integer values still work but will display a deprecation message in the browser console.
1 parent 215a129 commit 2e4076f

28 files changed

+117
-42
lines changed

‎app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/contact-information.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
6262
},
6363
});
6464
this.toasts.success({
65-
duration: 3000,
65+
duration: "short",
6666
data: {
6767
message: i18n(
6868
"admin.config_areas.about.toasts.contact_information_saved"

‎app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/extra-groups.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ export default class AdminConfigAreasAboutExtraGroups extends Component {
4545
},
4646
});
4747
this.toasts.success({
48-
duration: 30000,
48+
duration: "short",
4949
data: {
5050
message: i18n("admin.config_areas.about.toasts.extra_groups_saved"),
5151
},

‎app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/general-settings.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export default class AdminConfigAreasAboutGeneralSettings extends Component {
4444
},
4545
});
4646
this.toasts.success({
47-
duration: 3000,
47+
duration: "short",
4848
data: {
4949
message: i18n(
5050
"admin.config_areas.about.toasts.general_settings_saved"

‎app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/your-organization.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
3838
},
3939
});
4040
this.toasts.success({
41-
duration: 30000,
41+
duration: "short",
4242
data: {
4343
message: i18n(
4444
"admin.config_areas.about.toasts.your_organization_saved"

‎app/assets/javascripts/admin/addon/components/admin-config-areas/color-palette.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ export default class AdminConfigAreasColorPalette extends Component {
102102
}
103103
} catch (error) {
104104
this.toasts.error({
105-
duration: 3000,
105+
duration: "short",
106106
data: {
107107
message: extractError(error),
108108
},

‎app/assets/javascripts/admin/addon/components/admin-config-areas/components.gjs

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ export default class AdminConfigAreasComponents extends Component {
9797
theme: component.name,
9898
}),
9999
},
100-
duration: 2000,
100+
duration: "short",
101101
});
102102
this.load();
103103
}
@@ -328,7 +328,7 @@ class ComponentRow extends Component {
328328
if (data.theme.remote_theme.commits_behind > 0) {
329329
this.hasUpdates = true;
330330
this.toasts.default({
331-
duration: 5000,
331+
duration: "long",
332332
data: {
333333
message: i18n(
334334
"admin.config_areas.themes_and_components.components.new_update_for_component",
@@ -339,7 +339,7 @@ class ComponentRow extends Component {
339339
} else {
340340
this.hasUpdates = false;
341341
this.toasts.default({
342-
duration: 5000,
342+
duration: "long",
343343
data: {
344344
message: i18n(
345345
"admin.config_areas.themes_and_components.components.component_up_to_date",
@@ -361,7 +361,7 @@ class ComponentRow extends Component {
361361
await this.save({ remote_update: true });
362362
this.hasUpdates = false;
363363
this.toasts.success({
364-
duration: 5000,
364+
duration: "long",
365365
data: {
366366
message: i18n(
367367
"admin.config_areas.themes_and_components.components.updated_successfully",
@@ -387,7 +387,7 @@ class ComponentRow extends Component {
387387
type: "DELETE",
388388
});
389389
this.toasts.success({
390-
duration: 5000,
390+
duration: "long",
391391
data: {
392392
message: i18n(
393393
"admin.config_areas.themes_and_components.components.deleted_successfully",
@@ -398,7 +398,7 @@ class ComponentRow extends Component {
398398
this.args.refresh();
399399
} catch (error) {
400400
this.toasts.error({
401-
duration: 5000,
401+
duration: "long",
402402
data: {
403403
message: extractErrorInfo(error),
404404
},
@@ -418,7 +418,7 @@ class ComponentRow extends Component {
418418
});
419419
} catch (error) {
420420
this.toasts.error({
421-
duration: 5000,
421+
duration: "long",
422422
data: {
423423
message: extractErrorInfo(error),
424424
},

‎app/assets/javascripts/admin/addon/components/admin-config-areas/themes.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export default class AdminConfigAreasThemes extends Component {
4343
theme: theme.name,
4444
}),
4545
},
46-
duration: 2000,
46+
duration: "short",
4747
});
4848
this.router.refresh();
4949
}

‎app/assets/javascripts/admin/addon/components/admin-config-areas/user-fields-list.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export default class AdminConfigAreasUserFieldsList extends Component {
6262
await field.destroyRecord();
6363
this.fields.removeObject(field);
6464
this.toasts.success({
65-
duration: 3000,
65+
duration: "short",
6666
data: {
6767
message: i18n("admin.config_areas.user_fields.delete_successful"),
6868
},

‎app/assets/javascripts/admin/addon/components/admin-fonts-form.gjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ export default class AdminFontsForm extends Component {
8383
},
8484
});
8585
this.toasts.success({
86-
duration: 3000,
86+
duration: "short",
8787
data: {
8888
message: i18n("admin.config.fonts.form.saved"),
8989
},
@@ -96,7 +96,7 @@ export default class AdminFontsForm extends Component {
9696
});
9797
} catch (err) {
9898
this.toasts.error({
99-
duration: 3000,
99+
duration: "short",
100100
data: {
101101
message: err.jqXHR.responseJSON.errors[0],
102102
},

‎app/assets/javascripts/admin/addon/components/admin-logo-form.gjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,15 +77,15 @@ export default class AdminLogoForm extends Component {
7777
},
7878
});
7979
this.toasts.success({
80-
duration: 3000,
80+
duration: "short",
8181
data: {
8282
message: i18n("admin.config.logo.form.saved"),
8383
},
8484
});
8585
this.siteSettingChangeTracker.refreshPage(data);
8686
} catch (err) {
8787
this.toasts.error({
88-
duration: 3000,
88+
duration: "short",
8989
data: {
9090
message: err.jqXHR.responseJSON.errors[0],
9191
},

‎app/assets/javascripts/admin/addon/components/admin-user-exports-table.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ export default class extends Component {
6868
});
6969

7070
this.toasts.success({
71-
duration: 3000,
71+
duration: "short",
7272
data: { message: i18n("admin.user.exports.download.started") },
7373
});
7474
} catch (err) {

‎app/assets/javascripts/admin/addon/components/admin-user-fields-form.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ export default class AdminUserFieldsForm extends Component {
8585

8686
this.router.transitionTo("adminUserFields.index");
8787
this.toasts.success({
88-
duration: 3000,
88+
duration: "short",
8989
data: {
9090
message: i18n("admin.config_areas.user_fields.save_successful"),
9191
},

‎app/assets/javascripts/admin/addon/components/dashboard-new-feature-item.gjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export default class DiscourseNewFeatureItem extends Component {
2424
async toggleExperiment() {
2525
if (this.toggleExperimentDisabled) {
2626
this.toasts.error({
27-
duration: 3000,
27+
duration: "short",
2828
data: {
2929
message: i18n(
3030
"admin.dashboard.new_features.experiment_toggled_too_fast"
@@ -47,7 +47,7 @@ export default class DiscourseNewFeatureItem extends Component {
4747
},
4848
});
4949
this.toasts.success({
50-
duration: 3000,
50+
duration: "short",
5151
data: {
5252
message: this.experimentEnabled
5353
? i18n("admin.dashboard.new_features.experiment_enabled")

‎app/assets/javascripts/admin/addon/components/themes-grid-card.gjs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ export default class ThemeCard extends Component {
8181
theme: this.args.theme.name,
8282
}),
8383
},
84-
duration: 2000,
84+
duration: "short",
8585
});
8686
}
8787

@@ -102,7 +102,7 @@ export default class ThemeCard extends Component {
102102
data: {
103103
message: i18n("admin.customize.theme.setting_was_saved"),
104104
},
105-
duration: 2000,
105+
duration: "short",
106106
});
107107
}
108108

@@ -122,7 +122,7 @@ export default class ThemeCard extends Component {
122122
theme: this.args.theme.name,
123123
}),
124124
},
125-
duration: 2000,
125+
duration: "short",
126126
});
127127
})
128128
.catch(popupAjaxError)

‎app/assets/javascripts/admin/addon/controllers/admin-embedding-crawlers.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export default class AdminEmbeddingCrawlersController extends Controller {
2828
...data,
2929
});
3030
this.toasts.success({
31-
duration: 1500,
31+
duration: "short",
3232
data: { message: i18n("admin.embedding.crawler_settings_saved") },
3333
});
3434
} catch (error) {

‎app/assets/javascripts/admin/addon/controllers/admin-embedding-posts-and-topics.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default class AdminEmbeddingPostsAndTopicsController extends Controller {
3434
embed_by_username: data.embed_by_username[0],
3535
});
3636
this.toasts.success({
37-
duration: 1500,
37+
duration: "short",
3838
data: {
3939
message: i18n("admin.embedding.posts_and_topics_settings_saved"),
4040
},

‎app/assets/javascripts/admin/addon/controllers/admin-permalinks-index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export default class AdminPermalinksIndexController extends Controller {
3535
let linkElement = document.querySelector(`#admin-permalink-${pl.id}`);
3636
clipboardCopy(linkElement.textContent);
3737
this.toasts.success({
38-
duration: 3000,
38+
duration: "short",
3939
data: {
4040
message: i18n("admin.permalink.copy_success"),
4141
},

‎app/assets/javascripts/admin/addon/controllers/admin-users-list-show.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,7 @@ export default class AdminUsersListShowController extends Controller {
231231

232232
#showBulkSelectionLimitToast(event) {
233233
this.toasts.error({
234-
duration: 3000,
234+
duration: "short",
235235
data: {
236236
message: i18n("admin.users.bulk_actions.too_many_selected_users", {
237237
count: MAX_BULK_SELECT_LIMIT,

‎app/assets/javascripts/discourse/app/components/bookmark-menu.gjs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ export default class BookmarkMenu extends Component {
131131
// a bookmark, it switches to the other Edit/Delete menu.
132132
this.quicksaved = true;
133133
this.toasts.success({
134-
duration: 1500,
134+
duration: "short",
135135
views: ["mobile"],
136136
data: { message: i18n("bookmarks.bookmarked_success") },
137137
});
@@ -170,7 +170,7 @@ export default class BookmarkMenu extends Component {
170170
const response = await this.bookmarkManager.delete();
171171
this.bookmarkManager.afterDelete(response, this.existingBookmark.id);
172172
this.toasts.success({
173-
duration: 1500,
173+
duration: "short",
174174
data: {
175175
icon: "trash-can",
176176
message: i18n("bookmarks.deleted_bookmark_success"),
@@ -199,7 +199,7 @@ export default class BookmarkMenu extends Component {
199199
try {
200200
await this.bookmarkManager.save();
201201
this.toasts.success({
202-
duration: 1500,
202+
duration: "short",
203203
views: ["mobile"],
204204
data: { message: i18n("bookmarks.reminder_set_success") },
205205
});

‎app/assets/javascripts/discourse/app/components/group-smtp-email-settings.gjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ export default class GroupSmtpEmailSettings extends Component {
9292
});
9393

9494
this.toasts.success({
95-
duration: 3000,
95+
duration: "short",
9696
data: { message: i18n("groups.manage.email.smtp_settings_valid") },
9797
});
9898
})

‎app/assets/javascripts/discourse/app/services/composer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1311,7 +1311,7 @@ export default class ComposerService extends Service {
13111311

13121312
this.close();
13131313
this.toasts.success({
1314-
duration: 3000,
1314+
duration: "short",
13151315
data: {
13161316
message: i18n("post.localizations.success"),
13171317
},

‎app/assets/javascripts/discourse/tests/integration/components/float-kit/d-toast-test.gjs

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ import { getOwner } from "@ember/owner";
33
import { render, triggerEvent } from "@ember/test-helpers";
44
import { module, test } from "qunit";
55
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
6+
import {
7+
disableRaiseOnDeprecation,
8+
enableRaiseOnDeprecation,
9+
} from "discourse/tests/helpers/raise-on-deprecation";
610
import DToast from "float-kit/components/d-toast";
711
import DToastInstance from "float-kit/lib/d-toast-instance";
812

@@ -24,6 +28,14 @@ function createCustomToastInstance(owner, options, newClose) {
2428
module("Integration | Component | FloatKit | d-toast", function (hooks) {
2529
setupRenderingTest(hooks);
2630

31+
hooks.beforeEach(function () {
32+
disableRaiseOnDeprecation();
33+
});
34+
35+
hooks.afterEach(function () {
36+
enableRaiseOnDeprecation();
37+
});
38+
2739
test("swipe up to close", async function (assert) {
2840
let closing = false;
2941
this.site.mobileView = true;
@@ -52,4 +64,48 @@ module("Integration | Component | FloatKit | d-toast", function (hooks) {
5264

5365
assert.true(closing);
5466
});
67+
68+
test("duration", async function (assert) {
69+
let toast = new DToastInstance(getOwner(this), {
70+
duration: 9999,
71+
data: { message: "test" },
72+
});
73+
await render(<template><DToast @toast={{toast}} /></template>);
74+
75+
assert
76+
.dom(".fk-d-toast")
77+
.hasAttribute(
78+
"data-test-duration",
79+
"9999",
80+
"it accepts an arbitrary duration for backwards compatibility"
81+
);
82+
83+
toast = new DToastInstance(getOwner(this), {
84+
duration: "short",
85+
data: { message: "test" },
86+
});
87+
await render(<template><DToast @toast={{toast}} /></template>);
88+
89+
assert
90+
.dom(".fk-d-toast")
91+
.hasAttribute(
92+
"data-test-duration",
93+
"3000",
94+
"it `converts `short` to 3000ms"
95+
);
96+
97+
toast = new DToastInstance(getOwner(this), {
98+
duration: "long",
99+
data: { message: "test" },
100+
});
101+
await render(<template><DToast @toast={{toast}} /></template>);
102+
103+
assert
104+
.dom(".fk-d-toast")
105+
.hasAttribute(
106+
"data-test-duration",
107+
"5000",
108+
"it `converts `long` to 5000ms"
109+
);
110+
});
55111
});

0 commit comments

Comments
 (0)