From 5ce5a2ab9db7b4039792323f160dbbc4d9220ec7 Mon Sep 17 00:00:00 2001
From: rajun <nalagamdinniraju@gmail.com>
Date: Tue, 28 Jul 2026 11:12:01 +0530
Subject: [PATCH] refactor: extract model-viewer types to global.d.ts and
 rename AR viewer entry file

---
 app/global.d.ts                        | 37 +++++++++++++++++++++
 app/{qr-ar => routes/ar}/ar-viewer.tsx | 45 +-------------------------
 2 files changed, 38 insertions(+), 44 deletions(-)
 create mode 100644 app/global.d.ts
 rename app/{qr-ar => routes/ar}/ar-viewer.tsx (80%)

diff --git a/app/global.d.ts b/app/global.d.ts
new file mode 100644
index 0000000..7ca96d3
--- /dev/null
+++ b/app/global.d.ts
@@ -0,0 +1,37 @@
+import * as React from 'react';
+
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements {
+            'model-viewer': React.DetailedHTMLProps<
+                React.HTMLAttributes<HTMLElement> & {
+                    src?: string;
+                    'ios-src'?: string;
+                    ar?: boolean;
+                    'ar-modes'?: string;
+                    'ar-scale'?: string;
+                    'ar-placement'?: string;
+                    'camera-controls'?: boolean;
+                    'touch-action'?: string;
+                    alt?: string;
+                    'shadow-intensity'?: string | number;
+                    'shadow-softness'?: string | number;
+                    exposure?: string | number;
+                    'interaction-prompt'?: string;
+                    'min-camera-orbit'?: string;
+                    'max-camera-orbit'?: string;
+                    'camera-orbit'?: string;
+                    'field-of-view'?: string;
+                    scale?: string;
+                    'auto-rotate'?: boolean;
+                    'rotation-per-second'?: string;
+                    onLoad?: (e: any) => void;
+                    'onAr-status'?: (e: any) => void;
+                    'onModel-visibility'?: (e: any) => void;
+                    'onCamera-change'?: (e: any) => void;
+                },
+                HTMLElement
+            >;
+        }
+    }
+}
diff --git a/app/qr-ar/ar-viewer.tsx b/app/routes/ar/ar-viewer.tsx
similarity index 80%
rename from app/qr-ar/ar-viewer.tsx
rename to app/routes/ar/ar-viewer.tsx
index 72d5cdf..8afa358 100644
--- a/app/qr-ar/ar-viewer.tsx
+++ b/app/routes/ar/ar-viewer.tsx
@@ -4,48 +4,7 @@ import { useParams } from 'react-router';
 import { Box } from 'lucide-react';
 import { pb } from '~/lib/pocketbase';
 
-// --- A-FRAME/AR.JS CUSTOM ELEMENTS TYPING FIX ---
-declare module 'react' {
-    namespace JSX {
-        interface IntrinsicElements {
-            'a-scene': any;
-            'a-assets': any;
-            'a-asset-item': any;
-            'a-marker': any;
-            'a-entity': any;
-            'a-text': any;
-            'model-viewer': React.DetailedHTMLProps<
-                React.HTMLAttributes<HTMLElement>,
-                HTMLElement
-            > & {
-                src?: string;
-                'ios-src'?: string;
-                ar?: boolean;
-                'ar-modes'?: string;
-                'ar-scale'?: string;
-                'ar-placement'?: string;
-                'camera-controls'?: boolean;
-                'touch-action'?: string;
-                alt?: string;
-                'shadow-intensity'?: string | number;
-                'shadow-softness'?: string | number;
-                exposure?: string | number;
-                'interaction-prompt'?: string;
-                'min-camera-orbit'?: string;
-                'max-camera-orbit'?: string;
-                'camera-orbit'?: string;
-                'field-of-view'?: string;
-                scale?: string;
-                'auto-rotate'?: boolean;
-                'rotation-per-second'?: string;
-                onLoad?: (e: any) => void;
-                'onAr-status'?: (e: any) => void;
-                'onModel-visibility'?: (e: any) => void;
-                'onCamera-change'?: (e: any) => void;
-            };
-        }
-    }
-}
+
 
 const AR_HINTS = [
     'Arranging models to view…',
@@ -69,9 +28,7 @@ export default function ARViewer() {
     useEffect(() => {
         if (!id) return;
         const loadAsset = async () => {
-            // const response = await fetch(`https://thobapi.bopconsultancy.com/v2/ar-assets/${id}`);
             const data = await pb.collection('ar_assets').getOne(id);
-            // const data = await response.json();
             setAsset(data);
         };
         loadAsset();