previewIndex: update to TS, no-verify

Author: NalinDalal

client/modules/Preview/previewIndex.jsx renamed to client/modules/Preview/previewIndex.tsx

@@ -11,13 +11,22 @@ import { filesReducer, setFiles } from './filesReducer';
 import EmbedFrame from './EmbedFrame';
 import { getConfig } from '../../utils/getConfig';
 import { initialState } from '../IDE/reducers/files';
+import { File } from './filesReducer'; // Import File interface
 
 const GlobalStyle = createGlobalStyle`
   body {
     margin: 0;
   }
 `;
 
+interface AppState {
+  files: File[];
+  isPlaying: boolean;
+  basePath: string;
+  textOutput: boolean;
+  gridOutput: boolean;
+}
+
 const App = () => {
   const [state, dispatch] = useReducer(filesReducer, [], initialState);
   const [isPlaying, setIsPlaying] = useState(false);
@@ -26,14 +35,16 @@ const App = () => {
   const [gridOutput, setGridOutput] = useState(false);
   registerFrame(window.parent, getConfig('EDITOR_URL'));
 
-  function handleMessageEvent(message) {
+  function handleMessageEvent(message: { type: string; payload?: any }) {
     const { type, payload } = message;
     switch (type) {
       case MessageTypes.SKETCH:
-        dispatch(setFiles(payload.files));
-        setBasePath(payload.basePath);
-        setTextOutput(payload.textOutput);
-        setGridOutput(payload.gridOutput);
+        if (payload) {
+          dispatch(setFiles(payload.files));
+          setBasePath(payload.basePath);
+          setTextOutput(payload.textOutput);
+          setGridOutput(payload.gridOutput);
+        }
         break;
       case MessageTypes.START:
         setIsPlaying(true);
@@ -45,14 +56,16 @@ const App = () => {
         dispatchMessage({ type: MessageTypes.REGISTER });
         break;
       case MessageTypes.EXECUTE:
-        dispatchMessage(payload);
+        if (payload) {
+          dispatchMessage(payload);
+        }
         break;
       default:
         break;
     }
   }
 
-  function addCacheBustingToAssets(files) {
+  function addCacheBustingToAssets(files: File[]): File[] {
     const timestamp = new Date().getTime();
     return files.map((file) => {
       if (file.url && !file.url.endsWith('obj') && !file.url.endsWith('stl')) {