Remove re-render on customizer open/close in project profile

app/web/src/components/Customizer/Customizer.tsx

@@ -21,9 +21,11 @@ const Customizer = () => {
   const currentParameters = state?.currentParameters || {}
   const handleRender = useRender()
   const toggleOpen = () => {
-    const newOpenState = !isOpen
-    thunkDispatch({ type: 'setCustomizerOpenState', payload: newOpenState })
-    setTimeout(() => handleRender())
+    thunkDispatch({ type: 'setCustomizerOpenState', payload: !isOpen })
+    if (state.viewerContext === 'ide') {
+      // don't re-render on open/close in the project profile
+      setTimeout(() => handleRender())
+    }
   }
   const handleReset = () => {
     thunkDispatch({ type: 'resetCustomizer' })

app/web/src/components/EncodedUrl/helpers.ts

@@ -5,6 +5,7 @@ import { useIdeContext } from 'src/helpers/hooks/useIdeContext'
 import { useRender } from 'src/components/IdeWrapper/useRender'
 import { encode, decode } from 'src/helpers/compress'
 import { isBrowser } from '@redwoodjs/prerender/browserUtils'
+import type { State } from 'src/helpers/hooks/useIdeState'
 
 const scriptKey = 'encoded_script'
 const scriptKeyV2 = 'encoded_script_v2'
@@ -32,13 +33,17 @@ export function makeExternalUrl(resourceUrl: string): string {
   }#${fetchText}=${prepareDecodedUrl(resourceUrl)}`
 }
 
-export function useIdeInit(cadPackage: string, code = '') {
+export function useIdeInit(
+  cadPackage: State['ideType'],
+  code = '',
+  viewerContext: State['viewerContext'] = 'ide'
+) {
   const { thunkDispatch } = useIdeContext()
   const handleRender = useRender()
   useEffect(() => {
     thunkDispatch({
       type: 'initIde',
-      payload: { cadPackage, code },
+      payload: { cadPackage, code, viewerContext },
     })
     if (code) {
       return

app/web/src/components/ProjectProfile/ProjectProfile.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect, useRef, lazy, Suspense } from 'react'
+import { useState, useEffect, useRef } from 'react'
 import { useAuth } from '@redwoodjs/auth'
 import { Link, navigate, routes } from '@redwoodjs/router'
 import Editor from 'rich-markdown-editor'
@@ -15,7 +15,6 @@ import CadPackage from 'src/components/CadPackage/CadPackage'
 import Gravatar from 'src/components/Gravatar/Gravatar'
 import { useIdeInit } from 'src/components/EncodedUrl/helpers'
 import ProfileViewer from '../ProfileViewer/ProfileViewer'
-import Svg from 'src/components/Svg/Svg'
 import OpenscadStaticImageMessage from 'src/components/OpenscadStaticImageMessage/OpenscadStaticImageMessage'
 import KeyValue from 'src/components/KeyValue/KeyValue'
 
@@ -51,7 +50,7 @@ const ProjectProfile = ({
         })
       )
   }, [currentUser])
-  useIdeInit(project?.cadPackage, project?.code)
+  useIdeInit(project?.cadPackage, project?.code, 'viewer')
   const [newDescription, setNewDescription] = useState(project?.description)
   const onDescriptionChange = (description) => setNewDescription(description())
   const onEditSaveClick = () => {

app/web/src/helpers/hooks/useIdeState.ts

@@ -33,6 +33,7 @@ interface EditorModel {
 
 export interface State {
   ideType: 'INIT' | CadPackageType
+  viewerContext: 'ide' | 'viewer'
   ideGuide?: string
   consoleMessages: { type: 'message' | 'error'; message: string; time: Date }[]
   code: string
@@ -72,6 +73,7 @@ const initialLayout = {
 
 export const initialState: State = {
   ideType: 'INIT',
+  viewerContext: 'ide',
   consoleMessages: [
     { type: 'message', message: 'Initialising', time: new Date() },
   ],
@@ -105,6 +107,7 @@ const reducer = (state: State, { type, payload }): State => {
           '',
         ideType: payload.cadPackage,
         ideGuide: initGuideMap[payload.cadPackage],
+        viewerContext: payload.viewerContext,
       }
     case 'updateCode':
       return { ...state, code: payload }