feat: Compatibility table (#2742)

package.json

@@ -12,13 +12,14 @@
     "dev": "astro dev",
     "format": "prettier -w --cache --plugin prettier-plugin-astro .",
     "format:check": "prettier -c --cache --plugin prettier-plugin-astro .",
+    "build:compatibility-table": "pnpm --filter compatibility-table run build",
     "build:references": "pnpm --filter js-api-generator run build",
     "build:releases": "pnpm --filter releases-generator run build",
     "build:config": "pnpm --filter config-generator run build",
     "build:cli": "pnpm --filter cli-generator run build",
     "build:astro": "astro build",
     "build:i18n": "pnpm --filter docs-i18n-tracker run build",
-    "build": "pnpm dev:setup && pnpm build:references && pnpm build:config && pnpm build:cli && pnpm build:releases && pnpm build:astro && pnpm build:i18n",
+    "build": "pnpm dev:setup && pnpm build:references && pnpm build:config && pnpm build:cli && pnpm build:releases && pnpm build:compatibility-table && pnpm build:astro && pnpm build:i18n",
     "preview": "astro preview"
   },
   "dependencies": {

packages/compatibility-table/build.ts

@@ -0,0 +1,45 @@
+import { readdir, readFile } from 'fs/promises';
+import { writeFileSync } from 'node:fs';
+import TOML from '@iarna/toml';
+import path from 'path';
+
+// todo: resolve dir
+const baseDir = '../plugins-workspace';
+const pluginDir = '../plugins-workspace/plugins';
+
+async function main() {
+  const plugins = await readdir(pluginDir);
+
+  const workspaceCargo = TOML.parse(await readFile(path.join(baseDir, 'Cargo.toml'), 'utf-8'));
+  const baseRustVersion = workspaceCargo.workspace.package['rust-version'];
+
+  const tables: Record<string, any> = {};
+  for (const plugin of plugins) {
+    // using Record<string, any> but it's not reaaaally safe, might as well use any
+    const pluginPath = path.join(pluginDir, plugin, 'Cargo.toml');
+    try {
+      const data = TOML.parse(await readFile(pluginPath, 'utf-8'));
+      const pkg = data.package as Record<string, any>;
+
+      const hasSpecificRustVersion = pkg['rust-version'] && !pkg['rust-version'].workspace;
+      const platformsSupport: Record<string, any> = pkg.metadata.platforms.support;
+
+      //  todo: fix platforms case iOS, Windows...
+      const support = Object.entries(platformsSupport).map(([platform, supportInfo]) => ({
+        platform,
+        ...supportInfo,
+      }));
+
+      tables[plugin] = {
+        rustVersion: hasSpecificRustVersion ? pkg['rust-version'] : baseRustVersion,
+        support,
+      };
+    } catch (error) {
+      continue;
+    }
+  }
+
+  writeFileSync('../../src/components/plugins/_tableContent.json', JSON.stringify(tables, null, 2));
+}
+
+main();

packages/compatibility-table/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "compatibility-table",
+  "version": "1.0.0",
+  "private": "true",
+  "description": "",
+  "main": "index.js",
+  "type": "module",
+  "scripts": {
+    "build": "tsm ./build.ts"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@iarna/toml": "^2.2.5",
+    "@types/node": "^20.11.20",
+    "tsm": "^2.3.0",
+    "typescript": "^5.3.3"
+  }
+}

packages/compatibility-table/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "compilerOptions": {
+    "esModuleInterop": true,
+    "strict": true,
+    "skipLibCheck": true
+  }
+}

pnpm-lock.yaml

@@ -89,6 +89,21 @@ importers:
         specifier: ^5.3.3
         version: 5.6.2
 
+  packages/compatibility-table:
+    dependencies:
+      '@iarna/toml':
+        specifier: ^2.2.5
+        version: 2.2.5
+      '@types/node':
+        specifier: ^20.11.20
+        version: 20.16.10
+      tsm:
+        specifier: ^2.3.0
+        version: 2.3.0
+      typescript:
+        specifier: ^5.3.3
+        version: 5.6.2
+
   packages/config-generator:
     dependencies:
       '@types/json-schema':
@@ -970,6 +985,9 @@ packages:
   '@feelback/js@0.3.4':
     resolution: {integrity: sha512-xr7gTqSJcVUYQlELs1TntYovCBjMcYUr/hGKTnDoF64/lig5CbX4bOmqLoF50IImCy5q3oIwg9w+TSFvtBwsIA==}
 
+  '@iarna/toml@2.2.5':
+    resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
+
   '@img/sharp-darwin-arm64@0.33.5':
     resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
@@ -4799,6 +4817,8 @@ snapshots:
 
   '@feelback/js@0.3.4': {}
 
+  '@iarna/toml@2.2.5': {}
+
   '@img/sharp-darwin-arm64@0.33.5':
     optionalDependencies:
       '@img/sharp-libvips-darwin-arm64': 1.0.4

pnpm-workspace.yaml

@@ -5,3 +5,4 @@ packages:
   - 'packages/cli-generator'
   - 'packages/tauri-typedoc-theme'
   - 'packages/releases-generator'
+  - 'packages/compatibility-table'

src/components/list/Directory.astro

@@ -4,9 +4,12 @@ import {
   stripLeadingAndTrailingSlashes,
   ensureTrailingSlash,
 } from 'node_modules/@astrojs/starlight/utils/path';
-import { LinkCard, CardGrid } from '@astrojs/starlight/components';
+import { CardGrid } from '@astrojs/starlight/components';
 import { routes, type Route } from 'node_modules/@astrojs/starlight/utils/routing';
 
+// custom component copied from starlight/components/LinkCard
+import CustomLinkCard from '@components/plugins/CustomLinkCard.astro';
+
 interface Props {
   /**
    * Slug relative to /src - e.g "/zh-cn/features"
@@ -28,6 +31,11 @@ interface Props {
    * Use this to ignore sidebar order
    */
   sortAlphabetically?: boolean;
+
+  /*
+   * specifically to support compatibility footer in CustomLink card
+   */
+  callback?: Function;
 }
 
 function hasSidebarOrder(page: Route): number | undefined {
@@ -43,7 +51,12 @@ function compareOrder(a: Route, b: Route): boolean {
 }
 
 let { slug } = Astro.props;
-const { filterOutByTitle = [], filterOutByFileName = [], sortAlphabetically = false } = Astro.props;
+const {
+  filterOutByTitle = [],
+  filterOutByFileName = [],
+  sortAlphabetically = false,
+  callback,
+} = Astro.props;
 
 const defaultLocale = config.defaultLocale.lang || 'en';
 const localesList = config.isMultilingual ? Object.keys(config.locales) : [defaultLocale];
@@ -137,22 +150,26 @@ if (!sortAlphabetically) {
 
 <CardGrid>
   {
-    mainList.map((item) => (
-      <LinkCard
-        title={item.entry.data.title}
-        href={`/${item.slug}`}
-        description={item.entry.data.description}
-      />
-    ))
+    mainList.map((item) => {
+      return (
+        <CustomLinkCard
+          title={item.entry.data.title}
+          href={`/${item.slug}/`}
+          description={item.entry.data.description}
+          footer={callback instanceof Function && callback(item.slug)}
+        />
+      );
+    })
   }
   {
     locale !== defaultLocale &&
       fallbackList.map((item) => (
-        <LinkCard
+        <CustomLinkCard
           class="fallback-badge"
           title={item.entry.data.title}
-          href={`/${item.slug}`}
+          href={`/${item.slug}/`}
           description={item.entry.data.description}
+          footer={callback instanceof Function && callback(item.slug)}
         />
       ))
   }

src/components/list/Features.astro

@@ -1,5 +1,36 @@
 ---
 import Directory from './Directory.astro';
+
+import { type PluginData, getPlatformSupportIcon } from 'src/components/plugins/_helpers';
+import data from 'src/components/plugins/_tableContent.json';
+
+const fallBackNames: Record<string, string> = {
+  clipboard: 'clipboard-manager',
+  'deep-linking': 'deep-link',
+  dialog: 'dialog',
+  'file-system': 'fs',
+  'http-client': 'http',
+  localhost: 'localhost',
+  logging: 'log',
+  nfc: 'nfc',
+  'os-info': 'os',
+};
+
+function fetchData(pluginSlug: string) {
+  // assuming slug is "locale?/plugin/{pluginName}"
+  const plugin = pluginSlug.split('plugin/')[1];
+  let pluginData: PluginData = data[plugin];
+  if (!pluginData) {
+    pluginData = data[fallBackNames[plugin]];
+    if (!pluginData) {
+      console.log(
+        `[Plugin Support] '${plugin}' data is missing or it's name doesn't match any existing plugin`
+      );
+      return '';
+    }
+  }
+  return pluginData.support.map((plat) => getPlatformSupportIcon(plat.level, plat.platform));
+}
 ---
 
-<Directory slug="features" />
+<Directory slug="plugin" callback={fetchData} />

src/components/plugins/.gitignore

@@ -0,0 +1 @@
+_tableContent.json

src/components/plugins/Compatibility.astro

@@ -0,0 +1,66 @@
+---
+import { type PluginData, getSupportIcon, getSupportText } from './_helpers';
+import data from './_tableContent.json';
+import { createMarkdownProcessor } from '@astrojs/markdown-remark';
+
+const { plugin } = Astro.props;
+
+interface Props {
+  plugin: string;
+}
+const md = await createMarkdownProcessor();
+
+const pluginData: PluginData = data[plugin];
+
+const versionText = await md.render(
+  `_This plugin requires a Rust version of at least **${pluginData.rustVersion}**_`
+);
+---
+
+<div set:html={versionText.code} />
+
+<table>
+  <thead>
+    <tr>
+      <th>Platform</th>
+      <th>Level</th>
+      <th>Notes</th>
+    </tr>
+  </thead>
+  <tbody>
+    {
+      pluginData.support.map(async (t) => {
+        const { platform, notes, level } = t;
+        const parsedNotes = await md.render(notes || '');
+        const icon = getSupportIcon(level);
+        const title = getSupportText(level);
+        return (
+          <tr>
+            <td>{platform}</td>
+            <td>
+              <div title={title} class="icon" set:html={icon} />
+            </td>
+            <td>
+              <div set:html={parsedNotes.code} />
+            </td>
+          </tr>
+        );
+      })
+    }
+  </tbody>
+</table>
+
+<style>
+  .icon {
+    width: 1rem;
+  }
+  table {
+    width: 100%;
+  }
+  table td {
+    width: 1px;
+  }
+  table td:last-child {
+    width: 100%;
+  }
+</style>

src/components/plugins/CustomLinkCard.astro

@@ -0,0 +1,91 @@
+---
+// copied from LinkCard.Astro
+// removed icon
+// added a footer field to place the supported platform icons
+
+import type { HTMLAttributes } from 'astro/types';
+
+interface Props extends Omit<HTMLAttributes<'a'>, 'title'> {
+  title: string;
+  description?: string;
+  footer?: string;
+}
+
+const { title, description, footer, ...attributes } = Astro.props;
+---
+
+<div class="sl-link-card">
+  <span class="sl-flex stack">
+    <a {...attributes}>
+      <span class="title" set:html={title} />
+    </a>
+    {description && <p class="description" set:html={description} />}
+    {footer && <div style="pointer-events:none" class="footer" set:html={footer} />}
+  </span>
+</div>
+
+<style>
+  .footer {
+    display: inline-flex;
+    align-items: end;
+    flex-direction: row;
+    position: absolute;
+    bottom: 1em;
+    left: 1em;
+  }
+
+  .sl-link-card {
+    display: grid;
+    grid-template-columns: 1fr auto;
+    gap: 0.5rem;
+    border: 1px solid var(--sl-color-gray-5);
+    border-radius: 0.5rem;
+    padding: 1rem;
+    box-shadow: var(--sl-shadow-sm);
+    position: relative;
+    /* space for icons */
+    padding-bottom: 5em;
+  }
+
+  a {
+    text-decoration: none;
+    line-height: var(--sl-line-height-headings);
+  }
+
+  /* a11y fix for https://github.com/withastro/starlight/issues/487 */
+  a::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+  }
+
+  .stack {
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+
+  .title {
+    color: var(--sl-color-white);
+    font-weight: 600;
+    font-size: var(--sl-text-lg);
+  }
+
+  .description {
+    color: var(--sl-color-gray-3);
+    line-height: 1.5;
+  }
+
+  .icon {
+    color: var(--sl-color-gray-3);
+  }
+
+  /* Hover state */
+  .sl-link-card:hover {
+    background: var(--sl-color-gray-7, var(--sl-color-gray-6));
+    border-color: var(--sl-color-gray-2);
+  }
+
+  .sl-link-card:hover .icon {
+    color: var(--sl-color-white);
+  }
+</style>

src/components/plugins/TableCompatibility.astro

@@ -0,0 +1,90 @@
+---
+import { getSupportText, getSupportIcon, type PluginData } from './_helpers';
+// table generated by build:compatibility-table command
+import data from './_tableContent.json';
+import { createMarkdownProcessor } from '@astrojs/markdown-remark';
+
+const md = await createMarkdownProcessor();
+
+const pluginData: Record<string, PluginData> = data;
+
+const platforms = Array.from(
+  new Set(Object.values(pluginData).flatMap((info) => info.support.map((s) => s.platform)))
+).sort();
+
+function getTableData(data: Record<string, PluginData>) {
+  return Object.entries(data).map(([plugin, info]) => {
+    const row: Record<string, any> = { plugin, rustVersion: info.rustVersion };
+    info.support.forEach((support) => {
+      row[support.platform] = {
+        level: support.level,
+        levelIcon: getSupportIcon(support.level),
+        notes: support.notes,
+      };
+    });
+    return row;
+  });
+}
+// TODO: support markdown on notes: have to change the table structure because as of now the notes are a tooltip
+
+const tableData = getTableData(pluginData);
+---
+
+<table>
+  <thead>
+    <tr>
+      <th>Plugin</th>
+      <th>Rust Version</th>
+      {platforms.map((platform) => <th>{platform}</th>)}
+    </tr>
+  </thead>
+  <tbody>
+    {
+      tableData.map((row) => {
+        const { plugin, rustVersion } = row;
+        return (
+          <tr>
+            <td>{plugin}</td>
+            <td>{rustVersion}</td>
+            {platforms.map((platform) => {
+              const { notes, level, levelIcon } = row[platform];
+              let title = getSupportText(level);
+
+              if (notes) {
+                title = `${title}:  ${notes}`;
+              }
+              return (
+                <td>
+                  {platform && (
+                    <div class="support" title={title}>
+                      <div class="icon" set:html={levelIcon} />
+                      {notes && '*'}
+                    </div>
+                  )}
+                </td>
+              );
+            })}
+          </tr>
+        );
+      })
+    }
+  </tbody>
+</table>
+
+<style>
+  table {
+    width: 100%;
+  }
+
+  .support {
+    cursor: help;
+  }
+  .icon {
+    width: 1rem;
+    display: inline-block;
+  }
+  .notes {
+    margin-left: 0.5rem;
+    font-size: 0.8em;
+  }
+</style>

src/components/plugins/_helpers.ts

@@ -0,0 +1,96 @@
+export interface PluginSupport {
+  platform: string;
+  level: string;
+  // possible markdown
+  notes?: string;
+}
+
+export interface PluginData {
+  rustVersion: string;
+  support: PluginSupport[];
+}
+
+type Platform = 'windows' | 'linux' | 'ios' | 'macos' | 'android';
+
+// ids from /public/assets/platforms.svg sprite
+type IconId =
+  | 'material-symbols-android'
+  | 'simple-icons-ios'
+  | 'simple-icons-macos'
+  | 'cib-linux'
+  | 'bi-windows';
+
+export function getSupportText(supportLevel: string) {
+  switch (supportLevel) {
+    case 'full':
+      return 'Full support';
+    case 'partial':
+      return 'Partial support';
+    case 'none':
+      return 'No support';
+    default:
+      return `Support: ${supportLevel}`;
+  }
+}
+
+export function getSupportIcon(supportLevel: string) {
+  const supportLabel = getSupportText(supportLevel);
+  switch (supportLevel) {
+    case 'full':
+      return `<svg aria-label="${supportLabel}" alt="${supportLabel}" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"
+  ><path
+    fill="currentColor"
+    d="m10.562 15.908l6.396-6.396l-.708-.708l-5.688 5.688l-2.85-2.85l-.708.708zM12.003 21q-1.866 0-3.51-.708q-1.643-.709-2.859-1.924t-1.925-2.856T3 12.003t.709-3.51Q4.417 6.85 5.63 5.634t2.857-1.925T11.997 3t3.51.709q1.643.708 2.859 1.922t1.925 2.857t.709 3.509t-.708 3.51t-1.924 2.859t-2.856 1.925t-3.509.709"
+  ></path></svg
+>`;
+    case 'partial':
+      return `<svg aria-label="${supportLabel}" alt="${supportLabel}" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"
+  ><path
+    fill="currentColor"
+    d="m10.562 15.908l6.396-6.396l-.708-.708l-5.688 5.688l-2.85-2.85l-.708.708zM12.003 21q-1.866 0-3.51-.708q-1.643-.709-2.859-1.924t-1.925-2.856T3 12.003t.709-3.51Q4.417 6.85 5.63 5.634t2.857-1.925T11.997 3t3.51.709q1.643.708 2.859 1.922t1.925 2.857t.709 3.509t-.708 3.51t-1.924 2.859t-2.856 1.925t-3.509.709M12 20q3.35 0 5.675-2.325T20 12t-2.325-5.675T12 4T6.325 6.325T4 12t2.325 5.675T12 20m0-8"
+  ></path></svg
+>
+`;
+    case 'none':
+      return `<svg aria-label="${supportLabel}" alt="${supportLabel}" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"
+  ><path
+    fill="currentColor"
+    d="m12 12.708l-5.246 5.246q-.14.14-.344.15t-.364-.15t-.16-.354t.16-.354L11.292 12L6.046 6.754q-.14-.14-.15-.344t.15-.364t.354-.16t.354.16L12 11.292l5.246-5.246q.14-.14.345-.15q.203-.01.363.15t.16.354t-.16.354L12.708 12l5.246 5.246q.14.14.15.345q.01.203-.15.363t-.354.16t-.354-.16z"
+  ></path></svg
+>
+`;
+    default:
+      return `<svg viewBox="0 0 24 24" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg">
+  <line x1="4" y1="12" x2="20" y2="12" stroke="currentColor" />
+</svg>`;
+  }
+}
+
+// depends on /assets/platforms.svg
+function renderPlatformIcon(iconId: IconId) {
+  return `
+  <div style="padding-inline-end: 4px">
+    <svg width="24" height="24">
+      <use xlink:href="/assets/platforms.svg#${iconId}"></use>
+    </svg>
+  </div>
+`;
+}
+
+export function getPlatformSupportIcon(supportLevel: string, platform: Platform): string {
+  const iconMap: Record<Platform, IconId> = {
+    windows: 'bi-windows',
+    linux: 'cib-linux',
+    ios: 'simple-icons-ios',
+    macos: 'simple-icons-macos',
+    android: 'material-symbols-android',
+  };
+
+  const iconId = iconMap[platform];
+
+  if (supportLevel !== 'full' && supportLevel !== 'partial') {
+    return '';
+  }
+
+  return renderPlatformIcon(iconId);
+}

src/content/docs/es/plugin/dialog.mdx

@@ -4,16 +4,23 @@ description: Diálogos nativos del sistema para abrir y guardar archivos junto c
 i18nReady: true
 tableOfContents:
   maxHeadingLevel: 4
+plugin: dialog
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="dialog" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Los diálogos nativos del sistema para abrir y guardar archivos junto con diálogos de mensajes.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Configuración
 
 Instala el plugin de diálogo para comenzar.

src/content/docs/fr/plugin/notification.mdx

@@ -2,14 +2,17 @@
 title: Notifications
 description: Envoie une notification native à l'utilisateur.
 i18nReady: true
+plugin: notification
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import Stub from '@components/Stub.astro';
 
-<PluginLinks plugin="notification" version="2.0.0-rc.0" />
+<PluginLinks plugin={frontmatter.plugin} version="2.0.0-rc.0" />
 
 Envoie une notification native à votre utilisateur via le plugin de notification.
 
@@ -17,6 +20,10 @@ Envoie une notification native à votre utilisateur via le plugin de notificatio
 
 Pour commencer, installez le plugin de notifications.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 <Tabs>
     <TabItem label="Automatic">
 

src/content/docs/plugin/autostart.mdx

@@ -5,22 +5,23 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: autostart
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="autostart" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Automatically launch your application at system startup.
 
 ## Supported Platforms
 
-- Windows
-- Mac (via AppleScript or Launch Agent)
-- Linux
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
@@ -155,4 +156,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="autostart" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/barcode-scanner.mdx

@@ -5,26 +5,26 @@ sidebar:
   badge:
     text: New
     variant: tip
+plugin: barcode-scanner
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="barcode-scanner" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Allows your mobile application to use the camera to scan QR codes, EAN-13 and other kinds of barcodes.
 
 ## Supported Platforms
 
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the barcode-scanner plugin to get started.
 
 <Tabs>
@@ -130,4 +130,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="barcode-scanner" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/biometric.mdx

@@ -1,21 +1,23 @@
 ---
 title: Biometric
 description: Prompt the user for biometric authentication on Android and iOS.
+plugin: biometric
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="biometric" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Prompt the user for biometric authentication on Android and iOS.
 
 ## Supported Platforms
 
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
@@ -220,4 +222,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="biometric" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/cli.mdx

@@ -1,28 +1,33 @@
 ---
 title: Command Line Interface (CLI)
 description: Parse arguments from the command line interface.
+sidebar:
+  badge:
+    text: WIP
+    variant: caution
+plugin: cli
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="cli" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Tauri enables your app to have a CLI through [clap](https://github.com/clap-rs/clap), a robust command line argument parser. With a simple CLI definition in your `tauri.conf.json` file, you can define your interface and read its argument matches map on JavaScript and/or Rust.
 
 ## Supported Platforms
 
+<Compatibility plugin={frontmatter.plugin} />
+
 - Windows
   - Due to an OS limitation, production apps are not be able to write text back to the calling console by default. Please check out [tauri#8305](https://github.com/tauri-apps/tauri/issues/8305#issuecomment-1826871949) for a workaround.{/* TODO: Inline the instructions into this guide */}
-- Linux
-- macOS
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the CLI plugin to get started.
 
 <Tabs>
@@ -279,4 +284,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="cli" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/clipboard.mdx

@@ -5,18 +5,25 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: clipboard-manager
 ---
 
 import Stub from '@components/Stub.astro';
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="clipboard-manager" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Read and write to the system clipboard using the clipboard plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the clipboard plugin to get started.
@@ -110,4 +117,4 @@ println!("{:?}", content.unwrap());
 </TabItem>
 </Tabs>
 
-<PluginPermissions plugin="clipboard-manager" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/deep-linking.mdx

@@ -5,29 +5,26 @@ sidebar:
   badge:
     text: New
     variant: tip
+plugin: deep-link
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="deep-link" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Set your Tauri application as the default handler for an URL.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the deep-link plugin to get started.
 
 <Tabs>
@@ -407,7 +404,7 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="deep-link" />
+<PluginPermissions plugin={frontmatter.plugin} />
 
 [`tauri.conf.json > identifier`]: /reference/config/#identifier
 [verify Android applinks]: https://developer.android.com/training/app-links/verify-android-applinks#web-assoc

src/content/docs/plugin/dialog.mdx

@@ -4,17 +4,24 @@ description: Native system dialogs for opening and saving files along with messa
 i18nReady: true
 tableOfContents:
   maxHeadingLevel: 4
+plugin: dialog
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="dialog" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Native system dialogs for opening and saving files along with message dialogs.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the dialog plugin to get started.
@@ -308,4 +315,4 @@ app.dialog()
     });
 ```
 
-<PluginPermissions plugin="dialog" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/file-system.mdx

@@ -1,29 +1,26 @@
 ---
 title: File System
 description: Access the file system.
+plugin: fs
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="fs" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Access the file system.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
-- Android (in progress)
-- iOS (in progress)
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the fs plugin to get started.
 
 <Tabs>
@@ -579,7 +576,7 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="fs" />
+<PluginPermissions plugin={frontmatter.plugin} />
 
 ### Scopes
 

src/content/docs/plugin/global-shortcut.mdx

@@ -5,14 +5,17 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: global-shortcut
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="global-shortcut" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Register global shortcuts.
 
@@ -24,8 +27,6 @@ Register global shortcuts.
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the global-shortcut plugin to get started.
 
 <Tabs>
@@ -160,4 +161,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="global-shortcut" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/http-client.mdx

@@ -5,17 +5,24 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: http
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="http" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Make HTTP requests with the http plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the http plugin to get started.
@@ -125,4 +132,4 @@ println!("{:?}", res.status()); // e.g. 200
 println!("{:?}", res.text().await); // e.g Ok("{ Content }")
 ```
 
-<PluginPermissions plugin="http" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/index.mdx

@@ -10,6 +10,7 @@ import FeaturesList from '@components/list/Features.astro';
 import CommunityList from '@components/list/Community.astro';
 import Search from '@components/CardGridSearch.astro';
 import AwesomeTauri from '@components/AwesomeTauri.astro';
+import TableCompatibility from '@components/plugins/TableCompatibility.astro';
 
 Tauri comes with extensibility in mind. On this page you'll find:
 
@@ -30,3 +31,9 @@ Tauri comes with extensibility in mind. On this page you'll find:
   ### Integrations
   <AwesomeTauri section="integrations" />
 </Search>
+
+## Support Table
+
+Hover "\*" to see notes. For more details visit the plugin page
+
+<TableCompatibility />

src/content/docs/plugin/localhost.mdx

@@ -5,13 +5,16 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: localhost
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="localhost" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 Expose your app's assets through a localhost server instead of the default custom protocol.
 
@@ -21,14 +24,10 @@ This plugin brings considerable security risks and you should only use it if you
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the localhost plugin to get started.
 
 <Tabs>

src/content/docs/plugin/logging.mdx

@@ -1,29 +1,26 @@
 ---
 title: Logging
 description: Configurable logging.
+plugin: log
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="log" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Configurable logging for your Tauri app.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the log plugin to get started.
 
 <Tabs>
@@ -370,4 +367,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="log" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/nfc.mdx

@@ -5,6 +5,7 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: nfc
 ---
 
 import Stub from '@components/Stub.astro';
@@ -12,20 +13,18 @@ import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
 
-<PluginLinks plugin="nfc" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Read and write NFC tags on Android and iOS.
 
 ## Supported Platforms
 
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the nfc plugin to get started.
 
 <Tabs>
@@ -108,4 +107,4 @@ Based on https://github.com/tauri-apps/plugins-workspace/tree/plugins/nfc
 
 </Stub>
 
-<PluginPermissions plugin="nfc" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/notification.mdx

@@ -2,18 +2,25 @@
 title: Notifications
 description: Send native notifications to the user.
 i18nReady: true
+plugin: notification
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import PluginPermissions from '@components/PluginPermissions.astro';
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import Stub from '@components/Stub.astro';
 
-<PluginLinks plugin="notification" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Send native notifications to your user using the notification plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the notifications plugin to get started.
@@ -165,4 +172,4 @@ tauri::Builder::default()
 
 Aside from normal sanitization procedures of user input there are currently no known security considerations.
 
-<PluginPermissions plugin="notification" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/os-info.mdx

@@ -5,17 +5,24 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: os
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="os" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Read information about the operating system using the OS Information plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the OS Information plugin to get started.
@@ -119,4 +126,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="os" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/persisted-scope.mdx

@@ -5,28 +5,25 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: persisted-scope
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="persisted-scope" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 Save filesystem and asset scopes and restore them when the app is reopened.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the persisted-scope plugin to get started.
 
 <Tabs>

src/content/docs/plugin/positioner.mdx

@@ -5,14 +5,17 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: positioner
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="positioner" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Position your windows at well-known locations.
 
@@ -20,14 +23,10 @@ This plugin is a port of [electron-positioner](https://github.com/jenslind/elect
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the positioner plugin to get started.
 
 :::note
@@ -156,4 +155,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="positioner" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/process.mdx

@@ -5,17 +5,24 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: process
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import PluginPermissions from '@components/PluginPermissions.astro';
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="process" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 This plugin provides APIs to access the current process. To spawn child processes, see the [shell](/plugin/shell/) plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the plugin-process to get started.
@@ -102,4 +109,4 @@ app.restart();
 </TabItem>
 </Tabs>
 
-<PluginPermissions plugin="process" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/shell.mdx

@@ -5,27 +5,26 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: shell
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="shell" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Access the system shell. Allows you to spawn child processes and manage files and URLs using their default application.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the shell plugin to get started.
 
 <Tabs>
@@ -153,4 +152,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="shell" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/single-instance.mdx

@@ -5,16 +5,23 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: single-instance
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="single-instance" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 Ensure that a single instance of your tauri app is running at a time using the Single Instance Plugin.
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## Setup
 
 Install the Single Instance plugin to get started.

src/content/docs/plugin/sql.mdx

@@ -5,20 +5,25 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: sql
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import PluginPermissions from '@components/PluginPermissions.astro';
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="sql" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Plugin providing an interface for the frontend to communicate with SQL databases through [sqlx](https://github.com/launchbadge/sqlx). It supports the SQLite, MySQL and PostgreSQL drivers, enabled by a Cargo feature.
 
-## Setup
+## Supported Platforms
 
-_This plugin requires a Rust version of at least **1.75**_
+<Compatibility plugin={frontmatter.plugin} />
+
+## Setup
 
 Install the SQL plugin to get started.
 
@@ -300,4 +305,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 | `sql:allow-select`  | Enables the select command without any pre-configured scope.  |
 | `sql:deny-select`   | Denies the select command without any pre-configured scope.   |
 
-<PluginPermissions plugin="sql" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/store.mdx

@@ -1,14 +1,17 @@
 ---
 title: Store
 description: Persistent key value storage.
+plugin: store
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="store" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 This plugin provides a persistent key-value store. This is one of many options to handle state in your application. See the [state management overview](/develop/state-management/) for more information on additional options.
 
@@ -16,11 +19,7 @@ This store will allow you to persist state to a file which can be saved and load
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
@@ -159,4 +158,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="store" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/stronghold.mdx

@@ -5,27 +5,26 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: stronghold
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="stronghold" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Store secrets and keys using the [IOTA Stronghold](https://github.com/iotaledger/stronghold.rs) encrypted database and secure runtime.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the stronghold plugin to get started.
 
 <Tabs>
@@ -220,4 +219,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="stronghold" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/updater.mdx

@@ -1,22 +1,23 @@
 ---
 title: Updater
 description: In-app updates for Tauri applications.
+plugin: updater
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import PluginPermissions from '@components/PluginPermissions.astro';
 import CommandTabs from '@components/CommandTabs.astro';
 import { TabItem, Steps, Tabs } from '@astrojs/starlight/components';
 
-<PluginLinks plugin="updater" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Automatically update your Tauri app with an update server or a static JSON.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
@@ -745,4 +746,4 @@ The values from the [configuration](#tauri-configuration) are used as fallback i
 [JavaScript API Documentation]: /reference/javascript/updater/
 [Rust API Documentation]: https://docs.rs/tauri-plugin-updater
 
-<PluginPermissions plugin="updater" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/upload.mdx

@@ -5,20 +5,25 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: upload
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="upload" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Upload files from disk to a remote server over HTTP. Download files from a remote HTTP server to disk.
 
-## Setup
+## Supported Platforms
 
-_This plugin requires a Rust version of at least **1.75**_
+<Compatibility plugin={frontmatter.plugin} />
+
+## Setup
 
 <Tabs>
 	<TabItem label="Automatic">
@@ -104,4 +109,4 @@ download(
 );
 ```
 
-<PluginPermissions plugin="upload" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/websocket.mdx

@@ -5,27 +5,26 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: websocket
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="websocket" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Open a WebSocket connection using a Rust client in JavaScript.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the websocket plugin to get started.
 
 <Tabs>
@@ -114,4 +113,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="websocket" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/plugin/window-state.mdx

@@ -5,27 +5,26 @@ sidebar:
   badge:
     text: WIP
     variant: caution
+plugin: window-state
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import PluginPermissions from '@components/PluginPermissions.astro';
 
-<PluginLinks plugin="window-state" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Save window positions and sizes and restore them when the app is reopened.
 
 ## Supported Platforms
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## Setup
 
-_This plugin requires a Rust version of at least **1.75**_
-
 Install the window-state plugin to get started.
 
 <Tabs>
@@ -150,4 +149,4 @@ See the [Capabilities Overview](/security/capabilities/) for more information an
 }
 ```
 
-<PluginPermissions plugin="window-state" />
+<PluginPermissions plugin={frontmatter.plugin} />

src/content/docs/zh-cn/plugin/autostart.mdx

@@ -1,21 +1,22 @@
 ---
 title: 自动启动
 description: 在系统启动时自动启动应用程序。
+plugin: autostart
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="autostart" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 在系统启动时自动启动应用程序。
 
 ## 支持的平台
 
-- Windows
-- Mac（通过 AppleScript 或启动代理）
-- Linux
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 

src/content/docs/zh-cn/plugin/barcode-scanner.mdx

@@ -5,20 +5,22 @@ sidebar:
   badge:
     text: New
     variant: tip
+plugin: barcode-scanner
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="barcode-scanner" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 允许您的移动应用程序使用相机扫描 QR 码、EAN-13 和其他类型的条形码。
 
 ## 支持的平台
 
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 

src/content/docs/zh-cn/plugin/cli.mdx

@@ -1,26 +1,25 @@
 ---
 title: 命令行接口 (CLI)
 description: 从命令行接口解析参数。
+plugin: cli
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="cli" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 Tauri 使您的应用程序能够通过 [clap](https://github.com/clap-rs/clap)（一个强大的命令行参数解析器）拥有 CLI。通过 `tauri.conf.json` 文件中的简单 CLI 定义，您可以定义接口并读取其参数匹配 JavaScript/Rust 上的映射。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装 CLI 插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/clipboard.mdx

@@ -1,17 +1,24 @@
 ---
 title: 剪切板
 description: 读取和写入系统剪贴板。
+plugin: clipboard-manager
 ---
 
 import Stub from '@components/Stub.astro';
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="clipboard-manager" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 使用剪贴板插件读取和写入系统剪贴板。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 请安装剪贴板插件。

src/content/docs/zh-cn/plugin/deep-linking.mdx

@@ -5,25 +5,25 @@ sidebar:
   badge:
     text: New
     variant: tip
+plugin: deep-link
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="deep-link" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 将你的 Tauri 应用程序设置为 URL 的默认处理程序。
 
 ## 支持的平台
 
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装 deep-link 插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/dialog.mdx

@@ -4,16 +4,23 @@ description: 本机系统对话框，用于打开和保存文件，以及消息
 i18nReady: true
 tableOfContents:
   maxHeadingLevel: 4
+plugin: dialog
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="dialog" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 本机系统对话框，用于打开和保存文件，以及消息对话框。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 从安装对话框插件开始。

src/content/docs/zh-cn/plugin/file-system.mdx

@@ -1,26 +1,25 @@
 ---
 title: 文件系统
 description: 访问文件系统。
+plugin: fs
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="fs" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 访问文件系统。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 安装 fs 插件开始。
 
 <Tabs>

src/content/docs/zh-cn/plugin/global-shortcut.mdx

@@ -1,26 +1,25 @@
 ---
 title: 全局快捷方式
 description: 注册全局快捷方式。
+plugin: global-shortcut
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="global-shortcut" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 注册全局快捷方式。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装全局快捷方式插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/http-client.mdx

@@ -1,16 +1,23 @@
 ---
 title: HTTP 客户端
 description: 访问用 Rust 编写的 HTTP 客户端。
+plugin: http
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="http" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 使用 HTTP 插件发起 HTTP 请求。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 请安装 http 插件。

src/content/docs/zh-cn/plugin/localhost.mdx

@@ -4,10 +4,12 @@ description: 在生产环境中使用 localhost 服务器。
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="localhost" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 通过 localhost 服务器而不是默认的自定义协议公开你的应用资源。
 
@@ -23,8 +25,6 @@ import CommandTabs from '@components/CommandTabs.astro';
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 1. 通过将以下内容添加到 `Cargo.toml` 中来安装 localhost 插件。
 
 ```toml title="src-tauri/Cargo.toml"

src/content/docs/zh-cn/plugin/logging.mdx

@@ -1,27 +1,25 @@
 ---
 title: 日志记录
 description: 可配置的日志记录。
+plugin: log
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="log" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 为你的 Tauri 应用程序配置日志记录。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装日志插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/notification.mdx

@@ -2,17 +2,24 @@
 title: 通知提示
 description: 向用户发送本地通知提示。
 i18nReady: true
+plugin: notification
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 import Stub from '@components/Stub.astro';
 
-<PluginLinks plugin="notification" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 使用通知提示插件以向你的用户发送原生通知。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 配置
 
 首先，下载通知提示插件

src/content/docs/zh-cn/plugin/os-info.mdx

@@ -1,16 +1,23 @@
 ---
 title: 操作系统信息
 description: 查看操作系统信息。
+plugin: os
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="os" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 使用操作系统信息插件读取操作系统信息。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 安装操作系统信息插件开始。

src/content/docs/zh-cn/plugin/persisted-scope.mdx

@@ -4,10 +4,12 @@ description: 将运行时作用域的更改持久化到文件系统上。
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="persisted-scope" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 保存文件系统和资源作用域，并在应用重新打开时恢复它们。
 
@@ -19,8 +21,6 @@ import CommandTabs from '@components/CommandTabs.astro';
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装 persistent-scope 插件。
 
 :::note

src/content/docs/zh-cn/plugin/positioner.mdx

@@ -1,13 +1,16 @@
 ---
 title: 定位器（Positioner）
 description: 将窗口移动到公共位置。
+plugin: positioner
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="positioner" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 把窗口放在你熟悉的地方。
 
@@ -15,14 +18,10 @@ import CommandTabs from '@components/CommandTabs.astro';
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装定位器插件。
 
 :::note

src/content/docs/zh-cn/plugin/process.mdx

@@ -1,16 +1,23 @@
 ---
 title: 进程
 description: 访问当前进程。
+plugin: process
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="process" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 这个插件提供了访问当前进程的 API。要生成子进程，请参阅 [shell](/plugin/shell/) 插件。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 从安装 `plugin-process` 开始使用。

src/content/docs/zh-cn/plugin/shell.mdx

@@ -1,26 +1,25 @@
 ---
 title: Shell
 description: 访问系统 shell，使用默认应用程序管理文件和 URL，并生成子进程。
+plugin: shell
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="shell" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 访问系统 shell。允许您生成子进程并使用其默认应用程序管理文件和 URL。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装 shell 插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/single-instance.mdx

@@ -1,16 +1,23 @@
 ---
 title: 单例
 description: 确保一次只运行一个 Tauri 应用程序实例。
+plugin: single-instance
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="single-instance" showJsLinks={false} />
+<PluginLinks plugin={frontmatter.plugin} showJsLinks={false} />
 
 使用单实例插件确保 Tauri 应用程序在同一时间只运行单个实例。
 
+## Supported Platforms
+
+<Compatibility plugin={frontmatter.plugin} />
+
 ## 设置
 
 请安装单例插件。

src/content/docs/zh-cn/plugin/sql.mdx

@@ -1,20 +1,25 @@
 ---
 title: SQL
 description: 插件提供了一个接口，让前端可以通过 sqlx 与 SQL 数据库进行通信
+plugin: sql
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="sql" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 这个插件提供了一个接口，让前端可以通过 [sqlx](https：//github.com/launchbadge/sqlx) 与 SQL 数据库进行通信。
 它支持 SQLite、MySQL 和 PostgreSQL 驱动程序，通过 Cargo 特性来启用。
 
-## 安装
+## Supported Platforms
 
-_这个插件要求 Rust 版本至少是 **1.75**_
+<Compatibility plugin={frontmatter.plugin} />
+
+## 安装
 
 首先，在你的 `Cargo.toml` 文件中添加以下内容来安装插件。
 

src/content/docs/zh-cn/plugin/store.mdx

@@ -1,23 +1,22 @@
 ---
 title: Store
 description: 持久键值存储。
+plugin: store
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="store" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 简单、持久的键值存储。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
-- Android
-- iOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 

src/content/docs/zh-cn/plugin/stronghold.mdx

@@ -1,26 +1,25 @@
 ---
 title: Stronghold
 description: 加密的、安全的数据库。
+plugin: stronghold
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="stronghold" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 使用 [IOTA Stronghold](https：//github.com/iotaledger/stronghold.rs) 加密数据库和安全运行时存储秘密和密钥。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 安装 stronghold 插件开始。
 
 <Tabs>

src/content/docs/zh-cn/plugin/upload.mdx

@@ -1,19 +1,24 @@
 ---
 title: 上传
 description: 通过 HTTP 上传文件
+plugin: upload
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="upload" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 通过 HTTP 从磁盘上传文件到远程服务器。从远程 HTTP 服务器下载文件到磁盘。
 
-## 设置
+## 支持的平台
 
-_这个插件要求 Rust 版本至少是 **1.75**_
+<Compatibility plugin={frontmatter.plugin} />
+
+## 设置
 
 <Tabs>
 	<TabItem label="自动">

src/content/docs/zh-cn/plugin/websocket.mdx

@@ -1,26 +1,25 @@
 ---
 title: WebSocket
 description: 在 JavaScript 中使用 Rust 客户端打开 WebSocket 连接。
+plugin: websocket
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Steps, Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="websocket" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 在 JavaScript 中使用 Rust 客户端打开 WebSocket 连接。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 首先安装 WebSocket 插件。
 
 <Tabs>

src/content/docs/zh-cn/plugin/window-state.mdx

@@ -1,26 +1,25 @@
 ---
 title: 窗口状态
 description: 保持窗口大小和位置。
+plugin: window-state
 ---
 
 import PluginLinks from '@components/PluginLinks.astro';
+import Compatibility from '@components/plugins/Compatibility.astro';
+
 import { Tabs, TabItem } from '@astrojs/starlight/components';
 import CommandTabs from '@components/CommandTabs.astro';
 
-<PluginLinks plugin="window-state" />
+<PluginLinks plugin={frontmatter.plugin} />
 
 保存窗口位置和大小，并在应用程序重新打开时恢复它们。
 
 ## 支持的平台
 
-- Windows
-- Linux
-- macOS
+<Compatibility plugin={frontmatter.plugin} />
 
 ## 设置
 
-_这个插件要求 Rust 版本至少是 **1.75**_
-
 请安装窗口状态插件。
 
 <Tabs>