サイド・バーの幅を可変に (#385) (#396)

Reviewed-on: #396
Co-authored-by: miteruzo <miteruzo@naver.com>
Co-committed-by: miteruzo <miteruzo@naver.com>

frontend/src/components/MaterialSidebar.tsx

@@ -488,25 +488,23 @@ const MaterialSidebar: FC = () => {
 	  </div>
 	</div>
 
-	<div className="hidden md:block">
-	  <SidebarComponent>
-	    <div className="space-y-4">
-	      <MaterialFilterButtons
-		  materialFilter={materialFilter}
-		  onChange={handleFilterChange}/>
-	      {isLoading && (
-		  <p className="text-sm text-neutral-500 dark:text-stone-400">読込中……</p>)}
-	      {isError && (
-		  <p className="text-sm text-red-600 dark:text-red-300">
-		    タグ一覧の取得に失敗しました．
-		  </p>)}
-	      {(!isLoading && !isError) && (
-		  <ul>
-		    {renderDesktopTree (visibleRootTags)}
-		  </ul>)}
-	    </div>
-	  </SidebarComponent>
-	</div>
+	<SidebarComponent sidebarKey="materials" className="hidden md:block">
+	  <div className="space-y-4">
+	    <MaterialFilterButtons
+		materialFilter={materialFilter}
+		onChange={handleFilterChange}/>
+	    {isLoading && (
+		<p className="text-sm text-neutral-500 dark:text-stone-400">読込中……</p>)}
+	    {isError && (
+		<p className="text-sm text-red-600 dark:text-red-300">
+		  タグ一覧の取得に失敗しました．
+		</p>)}
+	    {(!isLoading && !isError) && (
+		<ul>
+		  {renderDesktopTree (visibleRootTags)}
+		</ul>)}
+	  </div>
+	</SidebarComponent>
       </>)
 }