From 696a4c53d1c4eeed4ffbc5a90896fc14604b88a8 Mon Sep 17 00:00:00 2001 From: dyzulk <66510723+dyzulk@users.noreply.github.com> Date: Thu, 8 Jan 2026 16:00:16 +0700 Subject: [PATCH] docs: impl dynamic installation guide component --- components/DynamicInstallationGuide.tsx | 212 ++++++++++++++++++ .../guide/getting-started/install-root-ca.mdx | 75 +------ 2 files changed, 216 insertions(+), 71 deletions(-) create mode 100644 components/DynamicInstallationGuide.tsx diff --git a/components/DynamicInstallationGuide.tsx b/components/DynamicInstallationGuide.tsx new file mode 100644 index 0000000..6542626 --- /dev/null +++ b/components/DynamicInstallationGuide.tsx @@ -0,0 +1,212 @@ +import useSWR from 'swr' +import axios from 'axios' +import { Tab } from '@headlessui/react' // Nextra uses headlessui usually, or we can build simple tabs +import { useState } from 'react' + +// Interface matching the API response +interface CaCertificate { + name: string; + type: string; + serial: string; + family_id?: string | null; + expires_at: string; + cdn_url?: string | null; + linux_cdn_url?: string | null; + der_cdn_url?: string | null; + bat_cdn_url?: string | null; + mac_cdn_url?: string | null; +} + +const fetcher = (url: string) => axios.get(url).then(res => res.data.data) + +export function DynamicInstallationGuide() { + const { data: certificates, error, isLoading } = useSWR('https://api.trustlab.dyzulk.com/api/public/ca-certificates', fetcher) + const [selectedIndex, setSelectedIndex] = useState(0) + + if (error) return
Failed to load live certificates. CLI: curl -sL https://cdn.trustlab.dyzulk.com/ca/bundles/trustlab-all.sh | sudo bash
+ if (isLoading || !certificates) return
Loading dynamic installer links...
+ + const root = certificates.find(c => c.type === 'root') + const intermediates = certificates.filter(c => c.type !== 'root') + + // Helper to format the table rows + const renderTable = (os: 'windows' | 'mac' | 'linux' | 'android') => { + return ( +
+ + + + + + + + + + {/* ROOT CA */} + {root && ( + + + + + + )} + + {/* INTERMEDIATES */} + {intermediates.map(cert => ( + + + + + + ))} + +
CertificateRaw File + {os === 'windows' ? 'Auto-Installer Script' : + os === 'mac' ? 'Configuration Profile' : + os === 'linux' ? 'One-Liner Installer' : 'Alternative Format'} +
+ Root CA + {root.name} + + + Download .crt + + + {os === 'windows' && root.bat_cdn_url && ( + Download .bat + )} + {os === 'mac' && root.mac_cdn_url && ( + Download .mobileconfig + )} + {os === 'android' && root.der_cdn_url && ( + Download .der + )} + {os === 'linux' && root.linux_cdn_url && ( + + curl -sL {root.linux_cdn_url} | sudo bash + + )} +
+ Intermediate + {cert.name} + + + Download .crt + + + {os === 'windows' && cert.bat_cdn_url && ( + Download .bat + )} + {os === 'mac' && cert.mac_cdn_url && ( + Download .mobileconfig + )} + {os === 'linux' && cert.linux_cdn_url && ( + + curl -sL {cert.linux_cdn_url} | sudo bash + + )} + {os === 'android' && cert.der_cdn_url && ( + Download .der + )} +
+
+ ) + } + + const tabs = [ + { id: 'windows', label: 'Windows' }, + { id: 'mac', label: 'macOS' }, + { id: 'android', label: 'Android' }, + { id: 'linux', label: 'Linux (CLI)' }, + ] + + return ( +
+
+ {tabs.map((tab, idx) => ( + + ))} +
+ +
+ {/* Windows Tab */} + {selectedIndex === 0 && ( +
+ {renderTable('windows')} +
+

Installation Steps (Raw File)

+
    +
  1. Double-click the downloaded .crt file.
    2. +
  2. Click Install Certificate.
    3. +
  3. Select Local Machine (requires Admin).
    4. +
  4. Choose "Place all certificates in the following store".
    5. +
  5. Select Trusted Root Certification Authorities (for Root) or Intermediate Certification Authorities (for Intermediates).
    6. +
  6. FInish.
    7. +
+

*Note: Using the Auto-Installer Script (.bat) handles all of this automatically.*

+
+
+ )} + + {/* macOS Tab */} + {selectedIndex === 1 && ( +
+ {renderTable('mac')} +
+

Installation Steps

+
    +
  • Option 1 (Profile): Download .mobileconfig, go to System Settings > Privacy & Security > Profiles to install.
    • +
  • Option 2 (Raw): Download .crt, open in Keychain Access, then set Trust settings to Always Trust.
    • +
+
+
+ )} + + {/* Android Tab */} + {selectedIndex === 2 && ( +
+ {renderTable('android')} +
+

Installation Steps

+
    +
  1. Download the .crt (or .der if required by your device).
    2. +
  2. Go to Settings > Security > Encryption & Credentials.
    3. +
  3. Tap Install a certificate > CA Certificate.
    4. +
  4. Select "Install anyway" and choose the file.
    5. +
+
+
+ )} + + {/* Linux Tab */} + {selectedIndex === 3 && ( +
+ {renderTable('linux')} +
+

Manual Installation (If not using One-Liner)

+ 
+                                
+{`# Copy certificates
+sudo cp *.crt /usr/local/share/ca-certificates/
+
+# Update Store
+sudo update-ca-certificates`}
+                                
+
+
+
+ )} +
+
+ ) +} diff --git a/pages/guide/getting-started/install-root-ca.mdx b/pages/guide/getting-started/install-root-ca.mdx index ba61b34..74b8db6 100644 --- a/pages/guide/getting-started/install-root-ca.mdx +++ b/pages/guide/getting-started/install-root-ca.mdx @@ -42,77 +42,10 @@ Select your distribution to get the optimized installation command: --- +import { DynamicInstallationGuide } from '../../../components/DynamicInstallationGuide' + ## Individual Certificate Installation -If you need to install specific certificates individually (e.g. only Root, or specific Intermediate), use the options below. +If you need to install specific certificates individually (e.g. only Root, or specific Intermediate), use the live guide below. - - - - ### Download Certificate - Choose the format that works best for you: - - | Certificate | Raw File | Auto-Installer Script | - | :--- | :--- | :--- | - | **Root CA** | **[dydev-its-true.crt](https://cdn.trustlab.dyzulk.com/ca/dydev-its-true.crt)** | **[Installer (.bat)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-dydev-its-true.bat)** | - | **Intermediate (4096)** | [trustlab-intermediate-ca-4096.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-4096.crt) | [Installer (.bat)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-4096.bat) | - | **Intermediate (2048)** | [trustlab-intermediate-ca-2048.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-2048.crt) | [Installer (.bat)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-2048.bat) | - - *For Scripts: Right-click the `.bat` file and select "Run as Administrator".* - - ### Manual Install (Raw File) - 1. Double-click the `.crt` file -> **Install Certificate**. - 2. Select **Local Machine**. - 3. For Root: Place in **Trusted Root Certification Authorities**. - 4. For Intermediate: Place in **Intermediate Certification Authorities**. - - - - - ### Download - - | Certificate | Raw File | Profile | - | :--- | :--- | :--- | - | **Root CA** | **[dydev-its-true.crt](https://cdn.trustlab.dyzulk.com/ca/dydev-its-true.crt)** | **[Profile (.mobileconfig)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-dydev-its-true.mobileconfig)** | - | **Intermediate (4096)** | [4096.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-4096.crt) | [Profile (.mobileconfig)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-4096.mobileconfig) | - | **Intermediate (2048)** | [2048.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-2048.crt) | [Profile (.mobileconfig)](https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-2048.mobileconfig) | - - ### Install - * **Profile**: Double-click `.mobileconfig` -> Go to System Settings -> Privacy & Security -> Profiles -> Install. - * **Raw**: Double-click `.crt` -> Keychain Access -> System -> **Always Trust**. - - - - - ### Download - - | Certificate | Raw File | DER Format | - | :--- | :--- | :--- | - | **Root CA** | **[dydev-its-true.crt](https://cdn.trustlab.dyzulk.com/ca/dydev-its-true.crt)** | **[dydev-its-true.der](https://cdn.trustlab.dyzulk.com/ca/dydev-its-true.der)** | - | **Intermediate (4096)** | [4096.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-4096.crt) | [4096.der](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-4096.der) | - | **Intermediate (2048)** | [2048.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-2048.crt) | [2048.der](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-2048.der) | - - ### Install - Settings -> Security -> Encryption & Credentials -> Install a certificate -> CA Certificate. - - - - - ### Download & Install (CLI) - You can download the raw file or run the installer script directly: - - | Certificate | Raw File | One-Liner Installer | - | :--- | :--- | :--- | - | **Root CA** | [dydev-its-true.crt](https://cdn.trustlab.dyzulk.com/ca/dydev-its-true.crt) | `curl -sL https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-dydev-its-true.sh | sudo bash` | - | **Intermediate (4096)** | [4096.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-4096.crt) | `curl -sL https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-4096.sh | sudo bash` | - | **Intermediate (2048)** | [2048.crt](https://cdn.trustlab.dyzulk.com/ca/trustlab-intermediate-ca-2048.crt) | `curl -sL https://cdn.trustlab.dyzulk.com/ca/installers/trustlab-trustlab-intermediate-ca-2048.sh | sudo bash` | - - ### Manual Place - If using raw file: - ```bash - sudo cp *.crt /usr/local/share/ca-certificates/ - sudo update-ca-certificates - ``` - - - +