Fix the structure of the r3f playground

packages/playground/src/shared/r3f-rocket/App.tsx

@@ -1,19 +1,10 @@
-import {
+import {editable as e, RefreshSnapshot, SheetProvider} from '@theatre/r3f'
-  editable as e,
-  RefreshSnapshot,
-  SheetProvider,
-  extension,
-} from '@theatre/r3f'
 import {OrbitControls, Stars} from '@react-three/drei'
 import {getProject} from '@theatre/core'
 import React, {Suspense, useState} from 'react'
 import {Canvas} from '@react-three/fiber'
 import {useGLTF} from '@react-three/drei'
 import sceneGLB from './scene.glb'
-import studio from '@theatre/studio'
-
-studio.extend(extension)
-studio.initialize()
 
 document.body.style.backgroundColor = '#171717'
 

packages/playground/src/shared/r3f-rocket/index.tsx

@@ -1,5 +1,10 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
 import App from './App'
+import studio from '@theatre/studio'
+import {extension} from '@theatre/r3f'
+
+studio.extend(extension)
+studio.initialize()
 
 ReactDOM.render(<App />, document.getElementById('root'))