docs: refine static demo experience

2026-05-28 00:55:11 +03:00
parent 2b8bcd10b8
commit 62e950f5c4
6 changed files with 87 additions and 42 deletions
@@ -11,6 +11,8 @@ const templatesDir = path.join(repoRoot, 'backend', 'bot', 'app', 'web', 'templa
 const themesDir = path.join(repoRoot, 'backend', 'bot', 'app', 'web', 'themes');
 const localesDir = path.join(repoRoot, 'locales');
 const runtimeBase = '/demo/runtime';
+const installGuidesConfigUrl =
+  'https://raw.githubusercontent.com/legiz-ru/my-remnawave/main/sub-page/subpage-config/multiapp.json';
 const isWindows = process.platform === 'win32';
 const npmExecPath = process.env.npm_execpath || '';

@@ -102,6 +104,19 @@ async function demoI18nPayload() {
  return jsonScriptPayload({ ru: JSON.parse(ru), en: JSON.parse(en) });
 }

+async function installGuidesConfigPayload() {
+  const response = await fetch(installGuidesConfigUrl, {
+    headers: { accept: 'application/json' },
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Unable to download demo install guides config (${response.status} ${response.statusText})`,
+    );
+  }
+  const config = await response.json();
+  return `${JSON.stringify(config, null, 2)}\n`;
+}
+
 async function appHtml() {
  const i18n = await demoI18nPayload();
  return `<!doctype html>
@@ -144,6 +159,9 @@ await Promise.all([
  copyDirectory(path.join(templatesDir, 'default-brand'), path.join(runtimeDir, 'default-brand')),
  copyDirectory(themesDir, path.join(runtimeDir, 'themes'), copyThemeFile),
  writeFile(path.join(runtimeDir, 'app.html'), html, 'utf8'),
+  installGuidesConfigPayload().then((payload) =>
+    writeFile(path.join(runtimeDir, 'subscription-guides-config.json'), payload, 'utf8'),
+  ),
 ]);

 console.log(`Built static docs demo runtime at ${path.relative(repoRoot, runtimeDir)}`);
@@ -52,9 +52,6 @@ function navIcon(href: string) {
  return undefined
 }

-function isDemoHref(href: string) {
-  return href === '/demo/' || href === '/demo'
-}
 ---

 <div class="box-border flex h-full items-center gap-2">
@@ -74,14 +71,12 @@ function isDemoHref(href: string) {
        const href = getI18nText(item.href, route)
        const label = getI18nText(item.label, route)
        const icon = navIcon(href)
-        const demo = isDemoHref(href)

        return (
          <a
            class:list={[
              '-m-1.5 rounded-md p-1.5 text-(--sl-color-gray-3) no-underline hover:text-(--sl-color-white) focus-visible:outline-offset-0',
              icon && 'minishop-header-link inline-flex items-center',
-              demo && 'minishop-demo-nav-link',
            ]}
            href={href}
          >
@@ -30,17 +30,6 @@
    flex-shrink: 0;
  }

-  .minishop-demo-nav-link {
-    border: 1px solid rgb(0 254 122 / 38%);
-    color: var(--sl-color-white);
-    background: rgb(0 254 122 / 8%);
-  }
-
-  .minishop-demo-nav-link:hover {
-    border-color: #00fe7a;
-    color: #00fe7a;
-  }
-
  .hero {
    gap: clamp(2rem, 6vw, 5rem);
    padding-block: clamp(3.5rem, 10vw, 6.5rem);