aboutsummaryrefslogtreecommitdiffstats
path: root/packages/meshbay-hub/src/meshbay_hub/static/apps.js
blob: 6e62a42f0354b0ca6ca271d02a7d4ae2af702a11 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import { ChatPanel } from './chat-app.js';
import { FilesPanel } from './files-app.js';
import { VideoApp } from './video-app.js';
import { MusicApp } from './music-app.js';
import { PhotosApp } from './photos-app.js';
import { ChatSettings } from './chat-app-settings.js';
import { VideoSettings } from './video-app-settings.js';
import { MusicSettings } from './music-app-settings.js';
import { PhotoSettings } from './photos-app-settings.js';

/**
 * Every group "application", in tab order.
 *
 * Adding one means a new file exporting a component, an optional second file
 * exporting its settings pane, and one entry here. Nothing in `group-page.js`
 * or `group-settings.js` changes: every registered component receives the same
 * shared context (see `commonProps`) and renders itself into the active tab,
 * and every registered `Settings` gets its own collapsible section with a
 * toggle, rendered by a loop that names no app.
 *
 * `key` doubles as the identifier the node's `apps_enabled` setting and its
 * `app_directories` op use, so it must match `ALLOWED_APPS` in the node's
 * webrtc_server.py. It is also the key an app's directories are stored under
 * (`<key>_directories`) — one identifier per app, everywhere.
 *
 * Fields:
 *   key            the identifier, shared with the node
 *   icon, labelKey the tab
 *   Component      the app itself
 *   Settings       its operator settings pane, if it has any (optional)
 *   alwaysEnabled  cannot be turned off, and is not offered as a toggle
 */
const APPS = [
  { key: 'chat', icon: 'chat', labelKey: 'group.tab_chat',
    Component: ChatPanel, Settings: ChatSettings },
  // Files has no settings of its own: it works over every shared directory by
  // definition, which is what the shared-directories table already configures.
  { key: 'files', icon: 'folder', labelKey: 'group.tab_files',
    Component: FilesPanel, alwaysEnabled: true },
  { key: 'video', icon: 'video', labelKey: 'group.tab_video',
    Component: VideoApp, Settings: VideoSettings },
  { key: 'music', icon: 'music', labelKey: 'group.tab_music',
    Component: MusicApp, Settings: MusicSettings },
  { key: 'photo', icon: 'image', labelKey: 'group.tab_photos',
    Component: PhotosApp, Settings: PhotoSettings },
];

/** The registry filtered to what this group has enabled, in registry order. */
function visibleApps(enabledKeys) {
  const enabled = new Set(
    enabledKeys && enabledKeys.length ? enabledKeys : APPS.map(a => a.key));
  return APPS.filter(a => a.alwaysEnabled || enabled.has(a.key));
}

/** The apps the Settings page offers a section for, in registry order. */
function configurableApps() {
  return APPS.filter(a => !a.alwaysEnabled && a.Settings);
}

export { APPS, visibleApps, configurableApps };