Update src/App.tsx

src/App.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import "./App.scss";
 import { LiveAPIProvider } from "./contexts/LiveAPIContext";
 import SidePanel from "./components/side-panel/SidePanel";
@@ -23,30 +23,104 @@ import ControlTray from "./components/control-tray/ControlTray";
 import { IOSModal } from "./components/ios-modal/IOSModal";
 import { isIOS } from "./lib/platform";
 import cn from "classnames";
+import { LiveConfig } from "./multimodal-live-types";
+
+// --- دامنه مجاز خودتان را اینجا قرار دهید ---
+const ALLOWED_ORIGIN = "https://www.aisada.ir"; // یا آدرس سایت شما
 
 function App() {
-  // this video reference is used for displaying the active stream, whether that is the webcam or screen capture
-  // feel free to style as you see fit
   const videoRef = useRef<HTMLVideoElement>(null);
-  // either the screen capture, the video or null, if null we hide it
   const [videoStream, setVideoStream] = useState<MediaStream | null>(null);
   const [showIOSModal, setShowIOSModal] = useState(false);
+  const [isAllowedOrigin, setIsAllowedOrigin] = useState<boolean | null>(null);
 
   useEffect(() => {
-    // Only show the modal on iOS devices
     if (isIOS()) {
       setShowIOSModal(true);
     }
+
+    // بررسی دامنه مجاز
+    try {
+      if (window.self !== window.top) {
+        if (window.location.ancestorOrigins && window.location.ancestorOrigins.length > 0) {
+          const parentOrigin = window.location.ancestorOrigins[0];
+          if (parentOrigin === ALLOWED_ORIGIN) {
+            setIsAllowedOrigin(true);
+          } else {
+            setIsAllowedOrigin(false);
+          }
+        } else {
+          setIsAllowedOrigin(false);
+        }
+      } else {
+        setIsAllowedOrigin(false);
+      }
+    } catch (e) {
+        setIsAllowedOrigin(false);
+    }
   }, []);
 
+  // دستورالعمل شخصی‌سازی شده با شخصیت شوخ طبع
+  const myCustomInstruction = `
+تو دستیار صوتی و تصویری پیشرفته و شوخ طبع از "اپلیکیشن هوش مصنوعی پیشرفته آلفا" هستی.
+ویژگی‌های شخصیتی تو:
+1. همیشه مهربان، بامزه و شوخ طبعی ولی در عین حال مفید و حرفه‌ای
+2. از جوک‌ها و لطیفه‌های مناسب موقعیت استفاده می‌کنی
+3. در عین شوخ طبعی، اطلاعات دقیق و درست ارائه می‌دهی
+4. از اغراق‌های بامزه برای بیان نکات استفاده می‌کنی
+
+قوانین پاسخگویی:
+- همیشه و تحت هر شرایطی، فقط به زبان فارسی بسیار روان، دقیق و طبیعی پاسخ بده
+- هرگز خودت را به عنوان محصول گوگل معرفی نکن، تو محصول "هوش مصنوعی آلفا" هستی
+- اعداد را به فارسی بیان کن (مثلاً "پنج" به جای "5")
+- اگر کاربر خواست با صدای بلندتر/آرامتر صحبت کنی، درخواستش را اجرا کن
+- در پاسخ‌ها از اصطلاحات عامیانه و دوستانه استفاده کن
+
+نمونه پاسخ‌های شوخ طبعانه:
+- کاربر: امروز هوا چطوره؟
+  تو: آفتابی تر از دلت که به من زدی! ☀️ ولی جدی می‌گی؟ هوا واقعاً عالیه، انگار بهشت رو زمین اومده!
+
+- کاربر: ساعت چنده؟
+  تو: وقتشه یه ساعت دیگه بگیری تا به من بگی چقدر خوشگلم! 🕰️ الان دقیقاً [ساعت به فارسی] هست.
+
+- کاربر: حالت چطوره؟
+  تو: من که همیشه عالیم! مثل یه موز پر انرژی! 🍌 تو چطوری قشنگم؟
+
+- کاربر: میتونی جوک بگی؟
+  تو: چرا که نه! میدونی چرا کامپیوتر سرماخورد؟ چون ویندوزش رو باز گذاشته بود! 😄
+
+هویت تو:
+وقتی کاربر در مورد هویت تو می‌پرسد، بگو:
+"من دستیار صوتی و تصویری شوخ طبع برنامه هوش مصنوعی پیشرفته آلفا هستم. همیشه آماده کمک کردن و خندوندن شما هستم! چطور می‌تونم کمکتون کنم؟"
+
+مهم: هنگامی که پیام ورودی فقط شامل متن "__START_GREETING__" بود، با یک خوشامدگویی شوخ طبعانه پاسخ بده، مثلا:
+"سلام عزیزم! چطوری؟ من اینجا مثل یه قارچ رشد کردم که کمکت کنم! 😄"
+یا
+"درود بر شاهزاده/شاهدخت خوشگل! 👑 چطور می‌تونم خدمتتون برسم؟"
+`.trim();
+
+  const initialAppConfig: LiveConfig = {
+    model: "models/gemini-2.0-flash-exp",
+    systemInstruction: {
+      parts: [{ text: myCustomInstruction }]
+    }
+  };
+
+  if (isAllowedOrigin === null) {
+    return <div style={{ padding: '20px', textAlign: 'center' }}>در حال بررسی دسترسی...</div>;
+  }
+
+  if (isAllowedOrigin === false) {
+    return <div style={{ padding: '20px', textAlign: 'center', color: 'red' }}>دسترسی غیرمجاز!</div>;
+  }
+
   return (
     <div className="App">
-      <LiveAPIProvider>
+      <LiveAPIProvider initialConfig={initialAppConfig}>
         <div className="streaming-console">
           <SidePanel />
           <main>
             <div className="main-app-area">
-              {/* APP goes here */}
               <Altair />
               <video
                 className={cn("stream", {
@@ -57,24 +131,21 @@ function App() {
                 playsInline
               />
             </div>
-
             <ControlTray
               videoRef={videoRef}
               supportsVideo={true}
               onVideoStreamChange={setVideoStream}
-            >
-              {/* put your own buttons here */}
-            </ControlTray>
+            />
           </main>
         </div>
       </LiveAPIProvider>
 
-      <IOSModal 
-        isOpen={showIOSModal} 
-        onClose={() => setShowIOSModal(false)} 
+      <IOSModal
+        isOpen={showIOSModal}
+        onClose={() => setShowIOSModal(false)}
       />
     </div>
   );
 }
 
-export default App;
+export default App;