misc: remove animation buttons

viewer/src/App.tsx

@@ -7,7 +7,6 @@ import UrdfView from "./pages/UrdfView";
 import { ThemeProvider } from "./contexts/ThemeContext";
 import { DragAndDropProvider } from "./contexts/DragAndDropContext";
 import { UrdfProvider } from "./contexts/UrdfContext";
-import { MyListProvider } from "./hooks/use-my-list";
 
 const queryClient = new QueryClient();
 
@@ -17,36 +16,13 @@ const App = () => {
       <QueryClientProvider client={queryClient}>
         <TooltipProvider>
           <UrdfProvider>
-            {/* TODO: check whether this is necessary <MyListProvider>  */}
-            <MyListProvider>
-              <Toaster />
-              <Sonner />
-              <DragAndDropProvider>
-                <UrdfView />
-              </DragAndDropProvider>
-              {/* <BrowserRouter>
-                <Routes>
-                  <Route path="/" element={<Index />} />
-                  <Route
-                    path="/playground"
-                    element={
-                      <DragAndDropProvider>
-                        <UrdfView />
-                      </DragAndDropProvider>
-                    }
-                  />
-                  <Route path="/content/:id" element={<ContentDetail />} />
-                  <Route path="/my-list" element={<MyList />} />
-                  <Route path="/new" element={<NewAndPopular />} />
-                  <Route path="/explore" element={<Explore />} />
-                  <Route path="*" element={<NotFound />} />
-                </Routes>
-              </BrowserRouter> */}
-            </MyListProvider>
+            <Toaster />
+            <Sonner />
+            <DragAndDropProvider>
+              <UrdfView />
+            </DragAndDropProvider>
           </UrdfProvider>
         </TooltipProvider>
-        {/* https://tanstack.com/query/latest/docs/framework/react/devtools */}
-        {/* <ReactQueryDevtools initialIsOpen={false} /> */}
       </QueryClientProvider>
     </ThemeProvider>
   );

viewer/src/components/layout/Layout.tsx

@@ -5,7 +5,6 @@ import { LayoutDashboard, PanelLeft, RotateCcw } from "lucide-react";
 import { useUrdf } from "@/hooks/useUrdf";
 import { Button } from "../ui/button";
 import { useTheme } from "@/hooks/useTheme";
-import AnimationDialog from "../AnimationDialog";
 import RobotParameters from "../RobotParameters";
 
 // Calculate header height - should match your Header component height
@@ -13,7 +12,6 @@ const HEADER_HEIGHT = 0; // in pixels - adjust if your header is different
 
 const Layout: React.FC = () => {
   const [open, setOpen] = useState(true);
-  const [animationDialogOpen, setAnimationDialogOpen] = useState(false);
   const { theme } = useTheme();
 
   // Use the centralized UrdfContext for all robot data
@@ -39,9 +37,6 @@ const Layout: React.FC = () => {
     setOpen(true);
   }, []);
 
-  // Get the robot name from currentRobotData
-  const robotName = currentRobotData?.name || "Robot";
-
   // Calculate if we have a custom animation
   const hasCustomAnimation = currentAnimationConfig !== null;
 
@@ -66,7 +61,6 @@ const Layout: React.FC = () => {
           headerHeight={HEADER_HEIGHT}
         />
       </div>
-
       {/* Sidebar positioned above with z-index, with top padding for header */}
       <div
         className="absolute inset-y-0 left-0 z-10"
@@ -77,7 +71,7 @@ const Layout: React.FC = () => {
             <SidebarBody className="justify-between gap-10">
               <div className="flex flex-col flex-1 overflow-y-auto overflow-x-hidden">
                 <div className="flex items-center justify-between mb-4 mt-2 px-2">
-                  <h2 className="text-xl font-bold tracking-tight font-mono">
+                  <h2 className="text-xl font-bold tracking-tight font-mono overflow-x-auto whitespace-nowrap scrollbar-none max-w-[200px] pr-2">
                     {currentRobotData?.name || "Robot Model"}
                   </h2>
                   <div className="flex items-center space-x-2">
@@ -120,21 +114,6 @@ const Layout: React.FC = () => {
 
                   <div className="sidebar-divider" />
                   <RobotParameters />
-                  <div className="sidebar-divider" />
-
-                  <div className="sidebar-section">
-                    <div
-                      className="bg-sidebar-accent rounded-lg p-3 flex items-center justify-center hover:bg-sidebar-accent/80 cursor-pointer transition-colors"
-                      onClick={() => setAnimationDialogOpen(true)}
-                    >
-                      <span className="text-sidebar-accent-foreground font-medium font-mono text-sm">
-                        Run an animation
-                      </span>
-                    </div>
-                    <div className="text-xs text-muted-foreground mt-2 text-left font-mono">
-                      See the robot move any way you want.
-                    </div>
-                  </div>
                 </div>
               </div>
             </SidebarBody>
@@ -160,13 +139,6 @@ const Layout: React.FC = () => {
           </div>
         )}
       </div>
-
-      {/* Animation Dialog - moved to root level to prevent accessibility issues */}
-      <AnimationDialog
-        open={animationDialogOpen}
-        onOpenChange={setAnimationDialogOpen}
-        robotName={robotName}
-      />
     </div>
   );
 };