2024-08-01 07:22:52 +02:00
|
|
|
// Copyright 2024, Command Line Inc.
|
|
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
|
2024-10-26 03:36:09 +02:00
|
|
|
import { BlockNodeModel } from "@/app/block/blocktypes";
|
2024-10-04 05:28:05 +02:00
|
|
|
import { getApi } from "@/app/store/global";
|
2024-10-08 02:20:18 +02:00
|
|
|
import { WebView, WebViewModel } from "@/app/view/webview/webview";
|
2024-10-09 21:42:33 +02:00
|
|
|
import { fireAndForget } from "@/util/util";
|
|
|
|
import { atom, useAtomValue } from "jotai";
|
2024-10-18 01:03:17 +02:00
|
|
|
import { useCallback } from "react";
|
2024-08-01 07:22:52 +02:00
|
|
|
import "./helpview.less";
|
|
|
|
|
2024-10-08 02:20:18 +02:00
|
|
|
class HelpViewModel extends WebViewModel {
|
2024-10-26 03:36:09 +02:00
|
|
|
constructor(blockId: string, nodeModel: BlockNodeModel) {
|
2024-10-08 02:20:18 +02:00
|
|
|
super(blockId, nodeModel);
|
|
|
|
this.getSettingsMenuItems = undefined;
|
2024-10-09 01:54:41 +02:00
|
|
|
this.viewText = atom((get) => {
|
|
|
|
// force a dependency on meta.url so we re-render the buttons when the url changes
|
|
|
|
let url = get(this.blockAtom)?.meta?.url || get(this.homepageUrl);
|
|
|
|
return [
|
|
|
|
{
|
|
|
|
elemtype: "iconbutton",
|
|
|
|
icon: "chevron-left",
|
|
|
|
click: this.handleBack.bind(this),
|
|
|
|
disabled: this.shouldDisableBackButton(),
|
|
|
|
},
|
|
|
|
{
|
|
|
|
elemtype: "iconbutton",
|
|
|
|
icon: "chevron-right",
|
|
|
|
click: this.handleForward.bind(this),
|
|
|
|
disabled: this.shouldDisableForwardButton(),
|
|
|
|
},
|
|
|
|
{
|
|
|
|
elemtype: "iconbutton",
|
|
|
|
icon: "house",
|
|
|
|
click: this.handleHome.bind(this),
|
|
|
|
disabled: this.shouldDisableHomeButton(),
|
|
|
|
},
|
|
|
|
];
|
|
|
|
});
|
2024-10-08 02:20:18 +02:00
|
|
|
this.homepageUrl = atom(getApi().getDocsiteUrl());
|
2024-09-05 06:15:39 +02:00
|
|
|
this.viewType = "help";
|
2024-10-08 02:20:18 +02:00
|
|
|
this.viewIcon = atom("circle-question");
|
|
|
|
this.viewName = atom("Help");
|
2024-09-05 06:15:39 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2024-10-26 03:36:09 +02:00
|
|
|
function makeHelpViewModel(blockId: string, nodeModel: BlockNodeModel) {
|
2024-10-08 02:20:18 +02:00
|
|
|
return new HelpViewModel(blockId, nodeModel);
|
2024-09-05 06:15:39 +02:00
|
|
|
}
|
|
|
|
|
2024-10-18 01:03:17 +02:00
|
|
|
const baseUrlRegex = /http[s]?:\/\/([^:\/])+(:\d+)?/;
|
|
|
|
|
2024-10-06 22:55:26 +02:00
|
|
|
function HelpView({ model }: { model: HelpViewModel }) {
|
2024-10-09 21:42:33 +02:00
|
|
|
const homepageUrl = useAtomValue(model.homepageUrl);
|
2024-10-18 00:38:42 +02:00
|
|
|
|
|
|
|
// Effect to update the docsite base url when the app restarts, since the webserver port is dynamic
|
2024-10-18 01:03:17 +02:00
|
|
|
const onFailLoad = useCallback(
|
|
|
|
(url: string) =>
|
2024-10-09 21:42:33 +02:00
|
|
|
fireAndForget(async () => {
|
2024-10-18 01:03:17 +02:00
|
|
|
const newDocsiteUrl = getApi().getDocsiteUrl();
|
|
|
|
|
|
|
|
// Correct the homepage URL, if necessary
|
|
|
|
if (newDocsiteUrl !== homepageUrl) {
|
|
|
|
await model.setHomepageUrl(newDocsiteUrl, "block");
|
|
|
|
}
|
|
|
|
|
|
|
|
// Correct the base URL of the current page, if necessary
|
|
|
|
const newBaseUrl = baseUrlRegex.exec(newDocsiteUrl)?.[0];
|
|
|
|
const curBaseUrl = baseUrlRegex.exec(url)?.[0];
|
|
|
|
console.log("fix-docsite-url", url, newDocsiteUrl, homepageUrl, curBaseUrl, newBaseUrl);
|
|
|
|
if (curBaseUrl && newBaseUrl && curBaseUrl !== newBaseUrl) {
|
|
|
|
model.loadUrl(url.replace(curBaseUrl, newBaseUrl), "fix-fail-load");
|
2024-10-09 21:42:33 +02:00
|
|
|
}
|
|
|
|
}),
|
2024-10-18 01:03:17 +02:00
|
|
|
[homepageUrl]
|
2024-10-09 21:42:33 +02:00
|
|
|
);
|
2024-10-04 05:28:05 +02:00
|
|
|
return (
|
|
|
|
<div className="help-view">
|
2024-10-18 01:03:17 +02:00
|
|
|
<WebView blockId={model.blockId} model={model} onFailLoad={onFailLoad} />
|
2024-10-04 05:28:05 +02:00
|
|
|
</div>
|
|
|
|
);
|
2024-08-01 07:22:52 +02:00
|
|
|
}
|
|
|
|
|
2024-09-05 06:15:39 +02:00
|
|
|
export { HelpView, HelpViewModel, makeHelpViewModel };
|