From 3a6776d9028826a3d98a8db2aec49be55da2a8f0 Mon Sep 17 00:00:00 2001
From: blanxi <guillemblanche@gmail.com>
Date: Wed, 20 Sep 2023 14:42:25 +0200
Subject: [PATCH 1/2] fix(camera): fix camera issues when browser doesn't have
 TouchEvent

---
 .../Models/Model/Model.component.tsx          | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/Models/Model/Model.component.tsx b/src/components/Models/Model/Model.component.tsx
index 1488004d..56ec356c 100644
--- a/src/components/Models/Model/Model.component.tsx
+++ b/src/components/Models/Model/Model.component.tsx
@@ -1,4 +1,4 @@
-import React, { FC, Ref, useEffect, useState, useCallback } from 'react';
+import React, { FC, Ref, useEffect, useState, useCallback, useMemo } from 'react';
 import { Group, Mesh } from 'three';
 import { normaliseMaterialsConfig, triggerCallback } from 'src/services';
 import { useGraph, useThree } from '@react-three/fiber';
@@ -20,13 +20,13 @@ export const Model: FC<ModelProps> = ({ scene, scale = 1, modelRef, onLoaded, on
   const [isTouching, setIsTouching] = useState(false);
   const [touchEvent, setTouchEvent] = useState<TouchEvent | null>(null);
   const setTouchingOn = (e: MouseEvent | TouchEvent) => {
-    if (e instanceof TouchEvent) {
+    if (window.TouchEvent && e instanceof TouchEvent) {
       setTouchEvent(e as TouchEvent);
     }
     setIsTouching(true);
   };
   const setTouchingOff = (e: MouseEvent | TouchEvent) => {
-    if (e instanceof TouchEvent) {
+    if (window.TouchEvent && e instanceof TouchEvent) {
       setTouchEvent(null);
     }
     setIsTouching(false);
@@ -38,7 +38,7 @@ export const Model: FC<ModelProps> = ({ scene, scale = 1, modelRef, onLoaded, on
         scene.rotation.y += event.movementX * ROTATION_STEP;
       }
 
-      if (isTouching && event instanceof TouchEvent) {
+      if (isTouching && window.TouchEvent && event instanceof TouchEvent) {
         /* eslint-disable-next-line no-param-reassign */
         const movementX = Math.round(event.touches[0].pageX - touchEvent!.touches[0].pageX);
         /* eslint-disable-next-line no-param-reassign */
@@ -66,13 +66,13 @@ export const Model: FC<ModelProps> = ({ scene, scale = 1, modelRef, onLoaded, on
 
   useEffect(() => {
     gl.domElement.addEventListener('mousedown', setTouchingOn);
-    gl.domElement.addEventListener('touchstart', setTouchingOn);
+    gl.domElement.addEventListener('touchstart', setTouchingOn, { passive: true });
     gl.domElement.addEventListener('mouseup', setTouchingOff);
     gl.domElement.addEventListener('touchend', setTouchingOff);
     gl.domElement.addEventListener('touchcancel', setTouchingOff);
 
     gl.domElement.addEventListener('mousemove', onTouchMove);
-    gl.domElement.addEventListener('touchmove', onTouchMove);
+    gl.domElement.addEventListener('touchmove', onTouchMove, { passive: true });
 
     return () => {
       gl.domElement.removeEventListener('mousedown', setTouchingOn);
@@ -86,10 +86,15 @@ export const Model: FC<ModelProps> = ({ scene, scale = 1, modelRef, onLoaded, on
     };
   });
 
+  const spawnComponent = useMemo(
+    () => <Spawn avatar={scene} onSpawnFinish={onSpawnAnimationFinish} />,
+    [onSpawnAnimationFinish]
+  );
+
   return (
     <group ref={modelRef} dispose={null} rotation={[0, 0, 0]}>
       <primitive object={scene} scale={scale} />
-      <Spawn avatar={scene} onSpawnFinish={onSpawnAnimationFinish} />
+      {spawnComponent}
     </group>
   );
 };

From 71e7e235a6eb3834919e466d9e348632ce86badd Mon Sep 17 00:00:00 2001
From: blanxi <guillemblanche@gmail.com>
Date: Wed, 20 Sep 2023 14:43:55 +0200
Subject: [PATCH 2/2] fix(camera): fix camera issues when browser doesn't have
 TouchEvent

---
 src/types/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/types/index.ts b/src/types/index.ts
index 4698ddbf..1fce75e2 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -141,8 +141,8 @@ export type EffectConfiguration = {
   /**
    * Enables ambient occlusion for the current scene.
    */
-  ambientOcclusion?: boolean
-}
+  ambientOcclusion?: boolean;
+};
 
 export interface SpawnState {
   /**