clamped the scene name to be 20 characters with an ellipse and a tooltip

Author: MbfloydIR

packages/client-core/src/admin/components/scene/SceneItem.tsx

@@ -31,6 +31,7 @@ import { EditorState } from '@etherealengine/editor/src/services/EditorServices'
 import { useHookstate, useMutableState } from '@etherealengine/hyperflux'
 import RenameSceneModal from '@etherealengine/ui/src/components/editor/panels/Scenes/modals/RenameScene'
 import ConfirmDialog from '@etherealengine/ui/src/components/tailwind/ConfirmDialog'
+import Tooltip from '@etherealengine/ui/src/primitives/mui/Tooltip'
 import Button from '@etherealengine/ui/src/primitives/tailwind/Button'
 import Text from '@etherealengine/ui/src/primitives/tailwind/Text'
 import { default as React, useEffect, useRef } from 'react'
@@ -100,7 +101,12 @@ export const SceneItem = ({ scene, updateEditorState, handleOpenScene, refetchPr
         <div className="inline-flex w-full flex-col items-start justify-start">
           <div className="space-between flex w-full flex-row">
             <Text component="h3" fontWeight="light" className="leading-6 text-neutral-100">
-              {sceneName}
+              {sceneName.length > 20 && (
+                <Tooltip title={sceneName}>
+                  <div>{sceneName.substring(0, 20)} ...</div>
+                </Tooltip>
+              )}
+              {sceneName.length <= 20 && <div>{sceneName}</div>}
             </Text>
           </div>
           <Text component="h3" fontSize="xs" fontWeight="light" className="h-3.5 w-40 leading-5 text-neutral-100">