cenvert to component

frontend/src/app/components/icons/key.jsx

@@ -0,0 +1,23 @@
+import React from "react";
+
+const KeyIcon = (props) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M14.875 9.12482H14.8846M16.3652 4.18269L19.8171 7.63461C20.0732 7.89064 20.2763 8.1946 20.4149 8.52913C20.5535 8.86367 20.6248 9.22223 20.6248 9.58434C20.6248 9.94644 20.5535 10.305 20.4149 10.6395C20.2763 10.9741 20.0732 11.278 19.8171 11.5341L17.2843 14.0669C17.0282 14.323 16.7243 14.5261 16.3897 14.6647C16.0552 14.8033 15.6966 14.8746 15.3345 14.8746C14.9724 14.8746 14.6139 14.8033 14.2793 14.6647C13.9448 14.5261 13.6408 14.323 13.3848 14.0669L13.0963 13.7785L6.81158 20.0632C6.49315 20.3816 6.07278 20.5777 5.62421 20.6171L5.4565 20.6248H4.33333C4.09861 20.6248 3.87205 20.5386 3.69664 20.3826C3.52123 20.2267 3.40917 20.0117 3.38171 19.7786L3.375 19.6665V18.5433C3.37511 18.0933 3.53354 17.6577 3.82254 17.3128L3.93658 17.1882L4.33333 16.7915H6.25V14.8748H8.16667V12.9581L10.2213 10.9035L9.93287 10.615C9.67681 10.359 9.47368 10.055 9.3351 9.7205C9.19651 9.38596 9.12518 9.0274 9.12518 8.66529C9.12518 8.30319 9.19651 7.94463 9.3351 7.61009C9.47368 7.27556 9.67681 6.97159 9.93287 6.71557L12.4657 4.18269C12.7218 3.92662 13.0257 3.7235 13.3603 3.58491C13.6948 3.44633 14.0534 3.375 14.4155 3.375C14.7776 3.375 15.1361 3.44633 15.4707 3.58491C15.8052 3.7235 16.1092 3.92662 16.3652 4.18269Z"
+        stroke="#D2D3E0"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+
+export default KeyIcon;