Replace with sorting icon

Laurie T. Malau · Laurie T. Malau · commit 22f1baa65f6c · 2022-08-02T16:43:22.000Z
diff --git a/components/dashboard/src/images/sort-arrow.svg b/components/dashboard/src/images/sort-arrow.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" className="h-4 w-4" viewBox="0 0 16 16">
+    <path
+        fill="#A8A29E"
+        fill-rule="evenodd"
+        d="M13.366 8.234a.8.8 0 010 1.132l-4.8 4.8a.8.8 0 01-1.132 0l-4.8-4.8a.8.8 0 111.132-1.132L7.2 11.67V2.4a.8.8 0 111.6 0v9.269l3.434-3.435a.8.8 0 011.132 0z"
+        clip-rule="evenodd"
+    />
+</svg>
diff --git a/components/dashboard/src/teams/TeamUsage.tsx b/components/dashboard/src/teams/TeamUsage.tsx
@@ -23,7 +23,7 @@ import { ErrorCodes } from "@gitpod/gitpod-protocol/lib/messaging/error";
 import { FeatureFlagContext } from "../contexts/FeatureFlagContext";
 import { ReactComponent as CreditsSvg } from "../images/credits.svg";
 import { ReactComponent as Spinner } from "../icons/Spinner.svg";
-import Arrow from "../components/Arrow";
+import { ReactComponent as SortArrow } from "../icons/sort-arrow.svg";
 
 function TeamUsage() {
     const { teams } = useContext(TeamsContext);
@@ -204,7 +204,7 @@ function TeamUsage() {
                                         <ItemField className="my-auto cursor-pointer">
                                             <span onClick={() => setIsStartedTimeDescending(!isStartedTimeDescending)}>
                                                 Started
-                                                <Arrow direction={isStartedTimeDescending ? "down" : "up"} />
+                                                <SortArrow className={isStartedTimeDescending ? "" : "rotate-180"} />
                                             </span>
                                         </ItemField>
                                     </Item>
