@celljs/ta-web 0.0.0-stage → 4.6.1

package/src/browser/hooks.ts

@@ -0,0 +1,102 @@
+import { useInject } from '@celljs/react';
+import type { SessionState, SessionStore } from '@celljs/ta-client';
+import * as React from 'react';
+import { TaWebExtensions, type WebExtensionsState } from './extension/web-extension-protocol';
+import { type LinksState, TaLinks } from './links/links-protocol';
+import { type NoticesState, TaNotices } from './notices/notices-protocol';
+import { type PwaState, TaPwa } from './pwa/pwa-protocol';
+import { type SettingsState, TaSettings } from './settings/settings-protocol';
+import { type StateSpec, TaState } from './state/state-protocol';
+import { FrameUtil } from './util/frame';
+import type { LinkTarget } from './util/link';
+import { TaWorkbench, type WorkbenchState } from './workbench-protocol';
+
+export function useWorkbench(): [WorkbenchState, TaWorkbench] {
+    const workbench = useInject<TaWorkbench>(TaWorkbench);
+    const state = React.useSyncExternalStore(
+        listener => workbench.subscribe(listener),
+        () => workbench.state,
+    );
+    return [state, workbench];
+}
+
+export function useSettings(): [SettingsState, TaSettings] {
+    const settings = useInject<TaSettings>(TaSettings);
+    const state = React.useSyncExternalStore(
+        listener => settings.subscribe(listener),
+        () => settings.state,
+    );
+    return [state, settings];
+}
+
+export function usePwa(): [PwaState, TaPwa] {
+    const pwa = useInject<TaPwa>(TaPwa);
+    const state = React.useSyncExternalStore(
+        listener => pwa.subscribe(listener),
+        () => pwa.state,
+    );
+    return [state, pwa];
+}
+
+export function useNotices(): [NoticesState, TaNotices] {
+    const notices = useInject<TaNotices>(TaNotices);
+    const state = React.useSyncExternalStore(
+        listener => notices.subscribe(listener),
+        () => notices.state,
+    );
+    return [state, notices];
+}
+
+export function useLinks(): [LinksState, TaLinks] {
+    const links = useInject<TaLinks>(TaLinks);
+    const state = React.useSyncExternalStore(
+        listener => links.subscribe(listener),
+        () => links.state,
+    );
+    return [state, links];
+}
+
+/** Opens a link of a reply in the directory `cwd`, for OpenLink. */
+export function useOpenLink(cwd: string | undefined): (target: LinkTarget, external: boolean) => void {
+    const links = useInject<TaLinks>(TaLinks);
+    return React.useCallback((target: LinkTarget, external: boolean) => void links.open(target, { cwd, external }), [links, cwd]);
+}
+
+export function useWebExtensions(): [WebExtensionsState, TaWebExtensions] {
+    const extensions = useInject<TaWebExtensions>(TaWebExtensions);
+    const state = React.useSyncExternalStore(
+        listener => extensions.subscribe(listener),
+        () => extensions.state,
+    );
+    return [state, extensions];
+}
+
+/** A value of the page kept at its tier (TaState), and how to change it. `spec` should be one object for the value, not made again each render. */
+export function usePersisted<T>(spec: StateSpec<T>): [T, (value: T | ((previous: T) => T)) => void] {
+    const state = useInject<TaState>(TaState);
+    const value = React.useSyncExternalStore(
+        listener => state.subscribe(listener),
+        () => state.get(spec),
+    );
+    const set = React.useCallback(
+        (next: T | ((previous: T) => T)) => state.set(spec, typeof next === 'function' ? (next as (previous: T) => T)(state.get(spec)) : next),
+        [state, spec],
+    );
+    return [value, set];
+}
+
+/** The state of a session, drawn at most once a frame while a model streams. */
+export function useSessionState(store: SessionStore): SessionState {
+    const subscribe = React.useCallback(
+        (listener: () => void) => {
+            const frame = FrameUtil.coalesce(listener);
+            const stop = store.subscribe(() => frame.call());
+            return () => {
+                frame.cancel();
+                stop();
+            };
+        },
+        [store],
+    );
+    return React.useSyncExternalStore(subscribe, () => store.state);
+}

package/src/browser/i18n/locales.ts

@@ -0,0 +1,20 @@
+import { Component } from '@celljs/core';
+import { Locale } from '@celljs/widget';
+import { EN_MESSAGES, ZH_MESSAGES } from './messages';
+
+/** English is first: languages without messages get it. */
+@Component(Locale)
+export class TaEnglishLocale implements Locale {
+    readonly lang = 'en-US';
+    readonly label = 'English';
+    readonly priority = 600;
+    readonly messages = EN_MESSAGES;
+}
+
+@Component(Locale)
+export class TaChineseLocale implements Locale {
+    readonly lang = 'zh-CN';
+    readonly label = '简体中文';
+    readonly priority = 500;
+    readonly messages = ZH_MESSAGES;
+}