diff --git a/app/common/types.ts b/app/common/types.ts
index b38b6fe9..def623e1 100644
--- a/app/common/types.ts
+++ b/app/common/types.ts
@@ -20,9 +20,11 @@ export type ServerConfig = {
};
export type TabRole = "server" | "function";
+export type TabPage = "Settings" | "About";
export type TabData = {
role: TabRole;
- name: string;
+ page?: TabPage;
+ label: string;
index: number;
};
diff --git a/app/main/index.ts b/app/main/index.ts
index 5edc3ae7..eb5f18c9 100644
--- a/app/main/index.ts
+++ b/app/main/index.ts
@@ -428,7 +428,7 @@ ${error}`,
AppMenu.setMenu(properties);
if (properties.activeTabIndex !== undefined) {
const activeTab = properties.tabs[properties.activeTabIndex];
- mainWindow.setTitle(`Zulip - ${activeTab.name}`);
+ mainWindow.setTitle(`Zulip - ${activeTab.label}`);
}
});
diff --git a/app/main/menu.ts b/app/main/menu.ts
index 0052074a..93ca3d98 100644
--- a/app/main/menu.ts
+++ b/app/main/menu.ts
@@ -318,12 +318,12 @@ function getWindowSubmenu(
if (tab === undefined) continue;
// Do not add functional tab settings to list of windows in menu bar
- if (tab.role === "function" && tab.name === "Settings") {
+ if (tab.role === "function" && tab.page === "Settings") {
continue;
}
initialSubmenu.push({
- label: tab.name,
+ label: tab.label,
accelerator:
tab.role === "function" ? "" : `${shortcutKey} + ${tab.index + 1}`,
checked: tab.index === activeTabIndex,
diff --git a/app/renderer/js/components/functional-tab.ts b/app/renderer/js/components/functional-tab.ts
index 061e5ed1..e3da71cd 100644
--- a/app/renderer/js/components/functional-tab.ts
+++ b/app/renderer/js/components/functional-tab.ts
@@ -1,10 +1,12 @@
import {type Html, html} from "../../../common/html.js";
+import type {TabPage} from "../../../common/types.js";
import {generateNodeFromHtml} from "./base.js";
import Tab, {type TabProperties} from "./tab.js";
export type FunctionalTabProperties = {
$view: Element;
+ page: TabPage;
} & TabProperties;
export default class FunctionalTab extends Tab {
@@ -17,7 +19,7 @@ export default class FunctionalTab extends Tab {
this.$view = $view;
this.$el = generateNodeFromHtml(this.templateHtml());
- if (this.properties.name !== "Settings") {
+ if (properties.page !== "Settings") {
this.properties.$root.append(this.$el);
this.$closeButton = this.$el.querySelector(".server-tab-badge")!;
this.registerListeners();
diff --git a/app/renderer/js/components/server-tab.ts b/app/renderer/js/components/server-tab.ts
index d56ede3e..e3d79cf8 100644
--- a/app/renderer/js/components/server-tab.ts
+++ b/app/renderer/js/components/server-tab.ts
@@ -49,7 +49,7 @@ export default class ServerTab extends Tab {
return html`
- ${this.properties.name}
+ ${this.properties.label}
@@ -60,9 +60,9 @@ export default class ServerTab extends Tab {
`;
}
- setName(name: string): void {
- this.properties.name = name;
- this.$name.textContent = name;
+ setLabel(label: string): void {
+ this.properties.label = label;
+ this.$name.textContent = label;
}
setIcon(icon: string): void {
diff --git a/app/renderer/js/components/tab.ts b/app/renderer/js/components/tab.ts
index 166e6444..556061fa 100644
--- a/app/renderer/js/components/tab.ts
+++ b/app/renderer/js/components/tab.ts
@@ -1,9 +1,10 @@
-import type {TabRole} from "../../../common/types.js";
+import type {TabPage, TabRole} from "../../../common/types.js";
export type TabProperties = {
role: TabRole;
+ page?: TabPage;
icon?: string;
- name: string;
+ label: string;
$root: Element;
onClick: () => void;
index: number;
diff --git a/app/renderer/js/main.ts b/app/renderer/js/main.ts
index 7c693ee5..ab59e211 100644
--- a/app/renderer/js/main.ts
+++ b/app/renderer/js/main.ts
@@ -20,6 +20,7 @@ import type {
NavigationItem,
ServerConfig,
TabData,
+ TabPage,
} from "../../common/types.js";
import defaultIcon from "../img/icon.png";
@@ -81,7 +82,7 @@ export class ServerManagerView {
loading: Set;
activeTabIndex: number;
tabs: ServerOrFunctionalTab[];
- functionalTabs: Map;
+ functionalTabs: Map;
tabIndex: number;
presetOrgs: string[];
preferenceView?: PreferenceView;
@@ -333,7 +334,7 @@ export class ServerManagerView {
server.url,
i,
);
- tab.setName(serverConfig.alias);
+ tab.setLabel(serverConfig.alias);
tab.setIcon(DomainUtil.iconAsUrl(serverConfig.icon));
(await tab.webview).setUnsupportedMessage(
DomainUtil.getUnsupportedMessage(serverConfig),
@@ -376,7 +377,7 @@ export class ServerManagerView {
const tab = new ServerTab({
role: "server",
icon: DomainUtil.iconAsUrl(server.icon),
- name: server.alias,
+ label: server.alias,
$root: this.$tabsContainer,
onClick: this.activateLastTab.bind(this, index),
index,
@@ -558,18 +559,19 @@ export class ServerManagerView {
}
async openFunctionalTab(tabProperties: {
- name: string;
+ label: string;
+ page: TabPage;
materialIcon: string;
makeView: () => Promise;
destroyView: () => void;
}): Promise {
- if (this.functionalTabs.has(tabProperties.name)) {
- await this.activateTab(this.functionalTabs.get(tabProperties.name)!);
+ if (this.functionalTabs.has(tabProperties.page)) {
+ await this.activateTab(this.functionalTabs.get(tabProperties.page)!);
return;
}
const index = this.tabs.length;
- this.functionalTabs.set(tabProperties.name, index);
+ this.functionalTabs.set(tabProperties.page, index);
const tabIndex = this.getTabIndex();
const $view = await tabProperties.makeView();
@@ -579,13 +581,14 @@ export class ServerManagerView {
new FunctionalTab({
role: "function",
materialIcon: tabProperties.materialIcon,
- name: tabProperties.name,
+ label: tabProperties.label,
+ page: tabProperties.page,
$root: this.$tabsContainer,
index,
tabIndex,
onClick: this.activateTab.bind(this, index),
onDestroy: async () => {
- await this.destroyTab(tabProperties.name, index);
+ await this.destroyFunctionalTab(tabProperties.page, index);
tabProperties.destroyView();
},
$view,
@@ -596,14 +599,15 @@ export class ServerManagerView {
// closed when the functional tab DOM is ready, handled in webview.js
this.$webviewsContainer.classList.remove("loaded");
- await this.activateTab(this.functionalTabs.get(tabProperties.name)!);
+ await this.activateTab(this.functionalTabs.get(tabProperties.page)!);
}
async openSettings(
navigationItem: NavigationItem = "General",
): Promise {
await this.openFunctionalTab({
- name: "Settings",
+ page: "Settings",
+ label: "Settings",
materialIcon: "settings",
makeView: async () => {
this.preferenceView = await PreferenceView.create();
@@ -622,7 +626,8 @@ export class ServerManagerView {
async openAbout(): Promise {
let aboutView: AboutView;
await this.openFunctionalTab({
- name: "About",
+ page: "About",
+ label: "About",
materialIcon: "sentiment_very_satisfied",
async makeView() {
aboutView = await AboutView.create();
@@ -660,7 +665,8 @@ export class ServerManagerView {
get tabsForIpc(): TabData[] {
return this.tabs.map((tab) => ({
role: tab.properties.role,
- name: tab.properties.name,
+ page: tab.properties.page,
+ label: tab.properties.label,
index: tab.properties.index,
}));
}
@@ -680,7 +686,7 @@ export class ServerManagerView {
// If old tab is functional tab Settings, remove focus from the settings icon at sidebar bottom
if (
this.tabs[this.activeTabIndex].properties.role === "function" &&
- this.tabs[this.activeTabIndex].properties.name === "Settings"
+ this.tabs[this.activeTabIndex].properties.page === "Settings"
) {
this.$settingsButton.classList.remove("active");
}
@@ -722,7 +728,7 @@ export class ServerManagerView {
this.$loadingIndicator.classList.toggle("hidden", !loading);
}
- async destroyTab(name: string, index: number): Promise {
+ async destroyFunctionalTab(page: TabPage, index: number): Promise {
const tab = this.tabs[index];
if (tab instanceof ServerTab && (await tab.webview).loading) {
return;
@@ -731,7 +737,7 @@ export class ServerManagerView {
await tab.destroy();
delete this.tabs[index]; // eslint-disable-line @typescript-eslint/no-array-delete
- this.functionalTabs.delete(name);
+ this.functionalTabs.delete(page);
// Issue #188: If the functional tab was not focused, do not activate another tab.
if (this.activeTabIndex === index) {
@@ -1053,7 +1059,7 @@ export class ServerManagerView {
for (const [index, domain] of DomainUtil.getDomains().entries()) {
if (domain.url === serverURL) {
const tab = this.tabs[index];
- if (tab instanceof ServerTab) tab.setName(realmName);
+ if (tab instanceof ServerTab) tab.setLabel(realmName);
domain.alias = realmName;
DomainUtil.updateDomain(index, domain);
// Update the realm name also on the Window menu