fix: Fix errors

src/pages/Route/RouteListPage/index.tsx

@@ -90,6 +90,7 @@ export const RouteListPage = observer(() => {
       width: 250,
       align: "center",
       headerAlign: "center",
+      sortable: false,
       renderCell: (params: GridRenderCellParams) => {
         return (
           <div className="flex h-full gap-7 justify-center items-center">

src/pages/Route/route-preview/InfiniteCanvas.tsx

@@ -54,16 +54,16 @@ export function InfiniteCanvas({
   const lastOriginalRotation = useRef<number | undefined>(undefined);
 
   useEffect(() => {
-    const canvas = applicationRef?.app?.canvas;
-    if (!canvas) return;
+    if (!applicationRef?.app?.canvas) return;
 
+    const canvas = applicationRef.app.canvas;
     const canvasRect = canvas.getBoundingClientRect();
     const canvasLeft = canvasRect.left;
     const canvasTop = canvasRect.top;
     const centerX = window.innerWidth / 2 - canvasLeft;
     const centerY = window.innerHeight / 2 - canvasTop;
     setScreenCenter({ x: centerX, y: centerY });
-  }, [applicationRef?.app?.canvas, setScreenCenter]);
+  }, [applicationRef?.app, setScreenCenter]);
 
   const handlePointerDown = (e: FederatedMouseEvent) => {
     setIsPointerDown(true);

src/pages/Route/route-preview/RightSidebar.tsx

@@ -101,7 +101,6 @@ export function RightSidebar() {
   }
 
   if (!routeData) {
-    console.error("routeData is null");
     return null;
   }
 

src/pages/Route/route-preview/index.tsx

@@ -166,7 +166,7 @@ export const RouteMap = observer(() => {
   return (
     <div style={{ width: "100%", height: "100%" }} ref={parentRef}>
       <LanguageSwitcher />
-      <Application resizeTo={parentRef} background="#fff">
+      <Application resizeTo={parentRef} background="#fff" preference="webgl">
         <InfiniteCanvas>
           <TravelPath points={points} />
           {stationData[language].map((obj, index) => (