IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-21 16:38:15 -06:00
Code Issues Packages Projects Releases Wiki Activity

DEV: Clean up mobileView/desktopView uses (#26229)

Browse Source 
Inspired by a piece of "do not do x if it's not a mobile view" code 🙃
This commit is contained in:
Jarek Radosz 2024-03-18 23:29:42 +01:00 committed by GitHub
parent 9c3ddd46f0
commit 11099434b5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
39 changed files with 85 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/app/components/basic-topic-list.js
View File

@ -81,7 +81,7 @@ export default Component.extend({
click(e) {
// Mobile basic-topic-list doesn't use the `topic-list-item` view so
// the event for the topic entrance is never wired up.
if (!this.site.mobileView) {
if (this.site.desktopView) {
return;
}

8
app/assets/javascripts/discourse/app/components/bookmark-list.hbs
View File

@ -5,7 +5,7 @@
>
<table class="topic-list bookmark-list">
<thead class="topic-list-header">
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<PluginOutlet @name="bookmark-list-table-header">
<th class="topic-list-data">{{i18n "topic.title"}}</th>
<th class="topic-list-data">&nbsp;</th>
@ -15,7 +15,7 @@
<th class="post-metadata topic-list-data">{{i18n "activity"}}</th>
<th>&nbsp;</th>
</PluginOutlet>
{{/unless}}
{{/if}}
</thead>
<tbody class="topic-list-body">
{{#each this.content as |bookmark|}}
@ -98,7 +98,7 @@
{{on "click" this.screenExcerptForExternalLink}}
>{{html-safe bookmark.excerpt}}</p>
</th>
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<td class="author-avatar topic-list-data">
{{#if bookmark.user.avatar_template}}
<a
@ -126,7 +126,7 @@
class="num post-metadata"
tagName="td"
}}
{{/unless}}
{{/if}}
<td class="topic-list-data">
<BookmarkActionsDropdown
@bookmark={{bookmark}}

18
app/assets/javascripts/discourse/app/components/composer-container.hbs
View File

@ -58,7 +58,7 @@
@outletArgs={{hash model=this.composer.model}}
/>
{{#unless this.composer.site.mobileView}}
{{#if this.site.desktopView}}
{{#if this.composer.model.unlistTopic}}
<span class="unlist">({{i18n "composer.unlist"}})</span>
{{/if}}
@ -67,7 +67,7 @@
<span class="no-bump">{{d-icon "anchor"}}</span>
{{/if}}
{{/if}}
{{/unless}}
{{/if}}
{{#if this.composer.canEdit}}
<LinkToInput
@ -264,7 +264,7 @@
@disableSubmit={{this.composer.disableSubmit}}
/>
{{#if this.composer.site.mobileView}}
{{#if this.site.mobileView}}
<a
href
{{on "click" this.composer.cancel}}
@ -286,7 +286,7 @@
>{{i18n "close"}}</a>
{{/if}}
{{#if this.composer.site.mobileView}}
{{#if this.site.mobileView}}
{{#if this.composer.whisperOrUnlistTopic}}
<span class="whisper">
{{d-icon "far-eye-slash"}}
@ -306,7 +306,7 @@
</span>
</div>
{{#if this.composer.site.mobileView}}
{{#if this.site.mobileView}}
<span>
<PluginOutlet
@name="composer-mobile-buttons-bottom"
@ -388,14 +388,14 @@
{{else}}
{{d-icon "exclamation-triangle"}}
{{/if}}
{{#unless this.composer.site.mobileView}}
{{#if this.site.desktopView}}
{{this.composer.model.draftStatus}}
{{/unless}}
{{/if}}
</span>
{{/if}}
</div>
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<DButton
@action={{this.composer.togglePreview}}
@translatedTitle={{this.composer.toggleText}}
@ -405,7 +405,7 @@
(unless this.composer.showPreview "active")
}}
/>
{{/unless}}
{{/if}}
</div>
</div>
{{else}}

2
app/assets/javascripts/discourse/app/components/composer-editor.js
View File

@ -899,7 +899,7 @@ export default Component.extend(ComposerUploadUppy, {
unshift: true,
});
if (this.allowUpload && this.uploadIcon && !this.site.mobileView) {
if (this.allowUpload && this.uploadIcon && this.site.desktopView) {
toolbar.addButton({
id: "upload",
group: "insertions",

4
app/assets/javascripts/discourse/app/components/discourse-banner.hbs
View File

@ -5,9 +5,9 @@
{{#if this.currentUser.staff}}
<a href={{this.banner.url}} class="btn btn-transparent edit-banner">
{{d-icon "pencil-alt"}}
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
{{html-safe (i18n "banner.edit")}}
{{/unless}}
{{/if}}
</a>
{{/if}}

2
app/assets/javascripts/discourse/app/components/discourse-topic.js
View File

@ -153,7 +153,7 @@ export default Component.extend(Scrolling, MobileScrollDirection, {
// On desktop the user only needs to scroll past the topic title.
return (
offset > this.dockAt &&
(!this.site.mobileView || this.mobileScrollDirection === "down")
(this.site.desktopView || this.mobileScrollDirection === "down")
);
},

6
app/assets/javascripts/discourse/app/components/glimmer-header.gjs
View File

@ -161,10 +161,9 @@ export default class GlimmerHeader extends Component {
@action
toggleBodyScrolling(bool) {
if (!this.site.mobileView) {
return;
if (this.site.mobileView) {
scrollLock(bool);
}
scrollLock(bool);
}
@action
@ -180,7 +179,6 @@ export default class GlimmerHeader extends Component {
@toggleHamburger={{this.toggleHamburger}}
@showSidebar={{@showSidebar}}
>
<span class="header-buttons">
{{#each (headerButtons.resolve) as |entry|}}
{{#if (and (eq entry.key "auth") (not this.currentUser))}}

2
app/assets/javascripts/discourse/app/components/glimmer-header/topic/info.gjs
View File

@ -129,7 +129,7 @@ export default class Info extends Component {
{{#if
(and
@topic.category.parentCategory.parentCategory
(not this.site.mobileView)
this.site.desktopView
)
}}
{{categoryLink

2
app/assets/javascripts/discourse/app/components/glimmer-site-header.gjs
View File

@ -432,7 +432,7 @@ export default class GlimmerSiteHeader extends Component {
<template>
<div
class={{concatClass
(unless this.site.mobileView "drop-down-mode")
(if this.site.desktopView "drop-down-mode")
"d-header-wrap"
}}
{{didInsert this.setupHeader}}

2
app/assets/javascripts/discourse/app/components/mobile-nav.js
View File

@ -8,7 +8,7 @@ import { on } from "discourse-common/utils/decorators";
export default Component.extend({
@on("init")
_init() {
if (!this.get("site.mobileView")) {
if (this.site.desktopView) {
let classes = this.desktopClass;
if (classes) {
classes = classes.split(" ");

1
app/assets/javascripts/discourse/app/components/modal/history.hbs
View File

@ -7,7 +7,6 @@
<ConditionalLoadingSpinner @condition={{this.initialLoad}}>
<Modal::History::Revision
@model={{this.postRevision}}
@mobileView={{this.site.mobileView}}
@wikiDisabled={{this.wikiDisabled}}
@previousCategory={{this.previousCategory}}
@currentCategory={{this.currentCategory}}

17
app/assets/javascripts/discourse/app/components/modal/history/revision.hbs
View File

@ -17,10 +17,10 @@
{{#if @model.edit_reason}}
<span class="edit-reason">{{@model.edit_reason}}</span>
{{/if}}
{{#unless @mobileView}}
{{#if this.site.desktopView}}
<span>
{{#if @model.user_changes}}
{{bound-avatar-template
@model.user_changes.previous.avatar_template
"small"
@ -33,24 +33,25 @@
}}
{{@model.user_changes.current.username}}
{{/if}}
{{#if @model.wiki_changes}}
{{#if @model.wiki_changes}}
<DisabledIcon @icon="far-edit" @disabled={{@wikiDisabled}} />
{{/if}}
{{#if @model.post_type_changes}}
{{#if @model.post_type_changes}}
<DisabledIcon @icon="shield-alt" @disabled={{@postTypeDisabled}} />
{{/if}}
{{#if @model.category_id_changes}}
{{#if @model.category_id_changes}}
{{html-safe @previousCategory}}
&rarr;
{{html-safe @currentCategory}}
{{/if}}
</span>
{{/unless}}
{{/if}}
</div>
{{#unless @mobileView}}
{{#if this.site.desktopView}}
<div id="display-modes">
<ul class="nav nav-pills">
<li>
@ -102,5 +103,5 @@
</li>
</ul>
</div>
{{/unless}}
{{/if}}
</div>

6
app/assets/javascripts/discourse/app/components/modal/history/revision.js Normal file
View File

@ -0,0 +1,6 @@
import Component from "@glimmer/component";
import { service } from "@ember/service";
export default class Revision extends Component {
@service site;
}

2
app/assets/javascripts/discourse/app/components/modal/share-topic.js
View File

@ -49,7 +49,7 @@ const ShareTopicModal = Component.extend(bufferedProperty("invite"), {
@afterRender
_selectUrl() {
const input = document.querySelector("input.invite-link");
if (input && !this.site.mobileView) {
if (input && this.site.desktopView) {
// if the input is auto-focused on mobile, iOS requires two taps of the copy button
input.setSelectionRange(0, this.url.length);
input.focus();

4
app/assets/javascripts/discourse/app/components/sidebar/section-form-link.hbs
View File

@ -14,11 +14,11 @@
role="row"
data-row-id={{@link.objectId}}
>
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<div class="draggable" data-link-name={{@link.name}}>
{{d-icon "grip-lines"}}
</div>
{{/unless}}
{{/if}}
<div class="input-group" role="cell">
<IconPicker
@name="icon"

2
app/assets/javascripts/discourse/app/components/topic-list-item.js
View File

@ -379,7 +379,7 @@ export default Component.extend({
},
_shouldFocusLastVisited() {
return !this.site.mobileView && this.focusLastVisitedTopic;
return this.site.desktopView && this.focusLastVisitedTopic;
},
_mainLinkElement() {

4
app/assets/javascripts/discourse/app/components/topic-progress.js
View File

@ -23,7 +23,7 @@ export default Component.extend({
"postStream.filteredPostsCount"
)
hideProgress(loaded, currentPost, filteredPostsCount) {
const hideOnShortStream = !this.site.mobileView && filteredPostsCount < 2;
const hideOnShortStream = this.site.desktopView && filteredPostsCount < 2;
return !loaded || !currentPost || hideOnShortStream;
},
@ -141,7 +141,7 @@ export default Component.extend({
// on desktop, pin this element to the composer
// otherwise the grid layout will change too much when toggling the composer
// and jitter when the viewport is near the topic bottom
if (!this.site.mobileView && composerH) {
if (this.site.desktopView && composerH) {
this.set("docked", false);
this.element.style.setProperty("bottom", `${composerH}px`);
return;

3
app/assets/javascripts/discourse/app/controllers/edit-category-tabs.js
View File

@ -1,5 +1,5 @@
import Controller from "@ember/controller";
import { and, readOnly } from "@ember/object/computed";
import { and } from "@ember/object/computed";
import { service } from "@ember/service";
import { underscore } from "@ember/string";
import { popupAjaxError } from "discourse/lib/ajax-error";
@ -22,7 +22,6 @@ export default Controller.extend({
showTooltip: false,
createdCategory: false,
expandedMenu: false,
mobileView: readOnly("site.mobileView"),
parentParams: null,
showDeleteReason: and("showTooltip", "model.cannot_delete_reason"),

2
app/assets/javascripts/discourse/app/controllers/review-index.js
View File

@ -36,7 +36,7 @@ export default Controller.extend({
init(...args) {
this._super(...args);
this.set("priority", this.siteSettings.reviewable_default_visibility);
this.set("filtersExpanded", !this.site.mobileView);
this.set("filtersExpanded", this.site.desktopView);
},
@discourseComputed("reviewableTypes")

2
app/assets/javascripts/discourse/app/instance-initializers/mobile-keyboard.js
View File

@ -7,7 +7,7 @@ export default {
const site = owner.lookup("service:site");
this.capabilities = owner.lookup("service:capabilities");
if (!this.capabilities.isIpadOS && !site.mobileView) {
if (!this.capabilities.isIpadOS && site.desktopView) {
return;
}

2
app/assets/javascripts/discourse/app/models/composer.js
View File

@ -410,7 +410,7 @@ export default class Composer extends RestModel {
options.label = I18n.t(`post.${action}`);
options.userAvatar = tinyAvatar(post.avatar_template);
if (!this.site.mobileView) {
if (this.site.desktopView) {
const originalUserName = post.get("reply_to_user.username");
const originalUserAvatar = post.get("reply_to_user.avatar_template");
if (originalUserName && originalUserAvatar && isEdit(action)) {

2
app/assets/javascripts/discourse/app/models/nav-item.js
View File

@ -250,7 +250,7 @@ export default class NavItem extends EmberObject {
if (
this.name === "latest" &&
(!Site.currentProp("mobileView") || this.tagId !== undefined)
(Site.currentProp("desktopView") || this.tagId !== undefined)
) {
count = 0;
}

2
app/assets/javascripts/discourse/app/models/topic-tracking-state.js
View File

@ -310,7 +310,7 @@ export default class TopicTrackingState extends EmberObject {
if (
filter === "categories" &&
data.message_type === "latest" &&
!Site.current().mobileView &&
Site.current().desktopView &&
(this.siteSettings.desktop_category_page_style ===
"categories_and_latest_topics" ||
this.siteSettings.desktop_category_page_style ===

2
app/assets/javascripts/discourse/app/routes/discovery-categories.js
View File

@ -19,7 +19,7 @@ export default class DiscoveryCategoriesRoute extends DiscourseRoute {
findCategories() {
let style =
!this.site.mobileView && this.siteSettings.desktop_category_page_style;
this.site.desktopView && this.siteSettings.desktop_category_page_style;
if (
style === "categories_and_latest_topics" ||

2
app/assets/javascripts/discourse/app/services/composer.js
View File

@ -206,7 +206,7 @@ export default class ComposerService extends Service {
@observes("showPreview")
showPreviewChanged() {
if (!this.site.mobileView) {
if (this.site.desktopView) {
this.keyValueStore.set({
key: "composer.showPreview",
value: this.showPreview,

2
app/assets/javascripts/discourse/app/services/navigation-menu.js
View File

@ -10,6 +10,6 @@ export default class NavigationMenu extends Service {
const headerDropdownMode =
this.siteSettings.navigation_menu === "header dropdown";
return !this.site.mobileView && headerDropdownMode;
return this.site.desktopView && headerDropdownMode;
}
}

18
app/assets/javascripts/discourse/app/templates/edit-category-tabs.hbs
View File

@ -12,16 +12,14 @@
/>
{{/if}}
</div>
{{#unless this.mobileView}}
{{#if this.model.id}}
<DButton
@action={{action "goBack"}}
@label="category.back"
@icon="caret-left"
class="category-back"
/>
{{/if}}
{{/unless}}
{{#if (and this.site.desktopView this.model.id)}}
<DButton
@action={{action "goBack"}}
@label="category.back"
@icon="caret-left"
class="category-back"
/>
{{/if}}
</div>
<div class="edit-category-nav">

4
app/assets/javascripts/discourse/app/templates/user-invited-show.hbs
View File

@ -25,14 +25,14 @@
/>
{{#if this.canBulkInvite}}
{{#if this.siteSettings.allow_bulk_invite}}
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<DButton
@icon="upload"
@action={{this.createInviteCsv}}
@label="user.invited.bulk_invite.text"
class="btn-default"
/>
{{/unless}}
{{/if}}
{{/if}}
{{/if}}
{{#if this.showBulkActionButtons}}

2
app/assets/javascripts/discourse/app/widgets/header-topic-info.js
View File

@ -142,7 +142,7 @@ export default createWidget("header-topic-info", {
if (parentCategory) {
if (
this.siteSettings.max_category_nesting > 2 &&
!this.site.mobileView
this.site.desktopView
) {
const grandParentCategory = parentCategory.get("parentCategory");
if (grandParentCategory) {

5
app/assets/javascripts/discourse/app/widgets/header.js
View File

@ -674,10 +674,9 @@ export default createWidget("header", {
},
toggleBodyScrolling(bool) {
if (!this.site.mobileView) {
return;
if (this.site.mobileView) {
scrollLock(bool);
}
scrollLock(bool);
},
togglePageSearch() {

2
app/assets/javascripts/discourse/app/widgets/topic-admin-menu.js
View File

@ -42,7 +42,7 @@ createWidget("topic-admin-menu-button", {
position: state.position,
topic: attrs.topic,
openUpwards: attrs.openUpwards,
rightSide: !this.site.mobileView && attrs.rightSide,
rightSide: this.site.desktopView && attrs.rightSide,
actionButtons: [],
});

4
app/assets/javascripts/select-kit/addon/components/select-kit.js
View File

@ -905,8 +905,8 @@ export default Component.extend(
{
name: "eventListeners",
options: {
resize: !this.site.mobileView,
scroll: !this.site.mobileView,
resize: this.site.desktopView,
scroll: this.site.desktopView,
},
},
{

4
app/assets/javascripts/select-kit/addon/components/select-kit/select-kit-row.js
View File

@ -38,7 +38,7 @@ export default Component.extend(UtilsMixin, {
didInsertElement() {
this._super(...arguments);
if (!this.site.mobileView) {
if (this.site.desktopView) {
this.element.addEventListener("mouseenter", this.handleMouseEnter);
this.element.addEventListener("focus", this.handleMouseEnter);
}
@ -47,7 +47,7 @@ export default Component.extend(UtilsMixin, {
willDestroyElement() {
this._super(...arguments);
if (!this.site.mobileView) {
if (this.site.desktopView) {
this.element.removeEventListener("mouseenter", this.handleMouseEnter);
this.element.removeEventListener("focus", this.handleMouseEnter);
}

3
plugins/chat/assets/javascripts/discourse/components/chat-channel-leave-btn.gjs
View File

@ -2,12 +2,13 @@ import Component from "@glimmer/component";
import { service } from "@ember/service";
import { isPresent } from "@ember/utils";
import DButton from "discourse/components/d-button";
export default class ChatChannelLeaveBtn extends Component {
@service chat;
@service site;
get shouldRender() {
return !this.site.mobileView && isPresent(this.args.channel);
return this.site.desktopView && isPresent(this.args.channel);
}
get leaveChatTitleKey() {

4
plugins/chat/assets/javascripts/discourse/components/chat/header/icon.gjs
View File

@ -40,7 +40,7 @@ export default class ChatHeaderIcon extends Component {
if (
this.chatStateManager.isFullPageActive &&
!this.chatSeparateSidebarMode.never &&
!this.site.mobileView
this.site.desktopView
) {
return I18n.t("sidebar.panels.forum.label");
}
@ -52,7 +52,7 @@ export default class ChatHeaderIcon extends Component {
if (
this.chatStateManager.isFullPageActive &&
!this.chatSeparateSidebarMode.never &&
!this.site.mobileView
this.site.desktopView
) {
return "random";
}

2
plugins/chat/assets/javascripts/discourse/components/chat/thread/header.gjs
View File

@ -20,7 +20,7 @@ export default class ChatThreadHeader extends Component {
route = "chat.channel.threads";
title = I18n.t("chat.return_to_threads_list");
models = this.channel?.routeModels;
} else if (prevPage === "chat.channel.index" && !this.site.mobileView) {
} else if (prevPage === "chat.channel.index" && this.site.desktopView) {
route = "chat.channel.threads";
title = I18n.t("chat.return_to_threads_list");
models = this.channel?.routeModels;

7
plugins/chat/assets/javascripts/discourse/services/chat-state-manager.js
View File

@ -4,7 +4,6 @@ import KeyValueStore from "discourse/lib/key-value-store";
import { withPluginApi } from "discourse/lib/plugin-api";
import { MAIN_PANEL } from "discourse/lib/sidebar/panels";
import { defaultHomepage } from "discourse/lib/utilities";
import Site from "discourse/models/site";
import getURL from "discourse-common/lib/get-url";
import { getUserChatSeparateSidebarMode } from "discourse/plugins/chat/discourse/lib/get-user-chat-separate-sidebar-mode";
@ -22,10 +21,12 @@ export function addChatDrawerStateCallback(callback) {
export function resetChatDrawerStateCallbacks() {
chatDrawerStateCallbacks = [];
}
export default class ChatStateManager extends Service {
@service chat;
@service chatHistory;
@service router;
@service site;
@tracked isSidePanelExpanded = false;
@tracked isDrawerExpanded = false;
@ -126,7 +127,7 @@ export default class ChatStateManager extends Service {
get isFullPagePreferred() {
return !!(
Site.currentProp("mobileView") ||
this.site.mobileView ||
this._store.getObject(PREFERRED_MODE_KEY) === FULL_PAGE_CHAT
);
}
@ -134,7 +135,7 @@ export default class ChatStateManager extends Service {
get isDrawerPreferred() {
return !!(
!this.isFullPagePreferred ||
(!Site.currentProp("mobileView") &&
(this.site.desktopView &&
(!this._store.getObject(PREFERRED_MODE_KEY) ||
this._store.getObject(PREFERRED_MODE_KEY) === DRAWER_CHAT))
);

6
plugins/chat/test/javascripts/components/chat-channel-leave-btn-test.js
View File

@ -3,7 +3,7 @@ import hbs from "htmlbars-inline-precompile";
import { module, test } from "qunit";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
import pretender from "discourse/tests/helpers/create-pretender";
import { exists, query } from "discourse/tests/helpers/qunit-helpers";
import { query } from "discourse/tests/helpers/qunit-helpers";
import I18n from "discourse-i18n";
import fabricators from "discourse/plugins/chat/discourse/lib/fabricators";
@ -47,11 +47,11 @@ module("Discourse Chat | Component | chat-channel-leave-btn", function (hooks) {
});
test("is not visible on mobile", async function (assert) {
this.site.mobileView = true;
this.site.desktopView = false;
this.channel = fabricators.channel();
await render(hbs`<ChatChannelLeaveBtn @channel={{this.channel}} />`);
assert.false(exists(".chat-channel-leave-btn"));
assert.dom(".chat-channel-leave-btn").doesNotExist();
});
});

4
plugins/discourse-local-dates/assets/javascripts/discourse/components/modal/local-dates-create.hbs
View File

@ -57,13 +57,13 @@
{{/if}}
</div>
{{#unless this.site.mobileView}}
{{#if this.site.desktopView}}
<TimezoneInput
@options={{hash icon="globe"}}
@value={{this.timezone}}
@onChange={{fn (mut this.timezone)}}
/>
{{/unless}}
{{/if}}
</div>
<div class="picker-panel">