From c8aca0f46d099fe7c431151a8851c52010261ad4 Mon Sep 17 00:00:00 2001
From: Jeason <me@cowpoke.cc>
Date: Tue, 9 Jul 2024 21:22:14 +0800
Subject: [PATCH] chore: add demo for polyfill

---
 app/components/outputs.tsx | 21 +++++++++------------
 app/orders/page.tsx        |  1 +
 app/page.tsx               |  1 +
 3 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/app/components/outputs.tsx b/app/components/outputs.tsx
index ed2afe8..ef3007c 100644
--- a/app/components/outputs.tsx
+++ b/app/components/outputs.tsx
@@ -14,7 +14,6 @@ export const Outputs = React.forwardRef<
 >(({ children, ...props }, ref) => {
   let infoElement = null;
 
-  const [isBrowserSupport, setIsBrowserSupport] = React.useState(true);
   const [isEnabledFlags, setIsEnabledFlags] = React.useState(true);
 
   React.useEffect(() => {
@@ -23,7 +22,7 @@ export const Outputs = React.forwardRef<
       return raw ? parseInt(raw[2], 10) : 0;
     }
     const version = getChromeVersion();
-    setIsBrowserSupport(version >= 127);
+    // setIsBrowserSupport(version >= 127);
 
     setIsEnabledFlags(!!('ai' in globalThis));
 
@@ -32,7 +31,7 @@ export const Outputs = React.forwardRef<
     });
   }, []);
 
-  if (!isBrowserSupport || !isEnabledFlags) {
+  if (!isEnabledFlags) {
     infoElement = (
       <div className="w-[500px] m-auto flex flex-col gap-4">
         <h2 className="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight first:mt-0">
@@ -43,15 +42,13 @@ export const Outputs = React.forwardRef<
           experimental and will change as they test and address feedback.
         </p>
 
-        {isBrowserSupport ? null : (
-          <Alert variant="destructive">
-            <AlertCircle className="h-4 w-4" />
-            <AlertTitle>Your browser is not supported.</AlertTitle>
-            <AlertDescription>
-              Please update Chrome to version 127 or higher.
-            </AlertDescription>
-          </Alert>
-        )}
+        <Alert variant="destructive">
+          <AlertCircle className="h-4 w-4" />
+          <AlertTitle>Your browser is not supported.</AlertTitle>
+          <AlertDescription>
+            Please update Chrome to version 127 or higher.
+          </AlertDescription>
+        </Alert>
 
         {isEnabledFlags ? null : (
           <div className="flex flex-col items-start justify-start">
diff --git a/app/orders/page.tsx b/app/orders/page.tsx
index 66ff6f1..6c18022 100644
--- a/app/orders/page.tsx
+++ b/app/orders/page.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+import 'chrome-ai/polyfill';
 import { LoaderCircle, SquareKanban } from 'lucide-react';
 import { Badge } from '../components/ui/badge';
 import { Button } from '../components/ui/button';
diff --git a/app/page.tsx b/app/page.tsx
index 3fdde14..782ad91 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+require('chrome-ai/polyfill');
 import {
   CornerDownLeft,
   Command,