diff --git a/packages/dashboard-v2/src/components/Icons/icons/TrashIcon.js b/packages/dashboard-v2/src/components/Icons/icons/TrashIcon.js new file mode 100644 index 00000000..7a4b222c --- /dev/null +++ b/packages/dashboard-v2/src/components/Icons/icons/TrashIcon.js @@ -0,0 +1,10 @@ +import { withIconProps } from "../withIconProps"; + +export const TrashIcon = withIconProps(({ size, ...props }) => ( + + + +)); diff --git a/packages/dashboard-v2/src/components/Icons/index.js b/packages/dashboard-v2/src/components/Icons/index.js index 611acef4..beaf1789 100644 --- a/packages/dashboard-v2/src/components/Icons/index.js +++ b/packages/dashboard-v2/src/components/Icons/index.js @@ -13,3 +13,4 @@ export * from "./icons/SearchIcon"; export * from "./icons/CopyIcon"; export * from "./icons/ShareIcon"; export * from "./icons/SimpleUploadIcon"; +export * from "./icons/TrashIcon"; diff --git a/packages/dashboard-v2/src/pages/settings/api-keys.js b/packages/dashboard-v2/src/pages/settings/api-keys.js index 56d6977e..8ed8b1c8 100644 --- a/packages/dashboard-v2/src/pages/settings/api-keys.js +++ b/packages/dashboard-v2/src/pages/settings/api-keys.js @@ -1,11 +1,65 @@ -import * as React from "react"; +import useSWR from "swr"; +import dayjs from "dayjs"; import UserSettingsLayout from "../../layouts/UserSettingsLayout"; +import { TextInputBasic } from "../../components/TextInputBasic"; +import { Button } from "../../components/Button"; +import { TrashIcon } from "../../components/Icons"; + const APIKeysPage = () => { + const { data: apiKeys } = useSWR("user/apikeys"); + return ( <> -

API Keys

+
+
+
+

API Keys

+

+ At vero eos et caritatem, quae sine metu contineret, saluti prospexit civium, qua. Laudem et dolorem + aspernari ut ad naturam aut fu. +

+
+
+
+
+ +
+ +
+
+
+ {apiKeys?.length > 0 && ( +
+
API Keys
+
    + {apiKeys.map(({ id, name, createdAt }) => ( +
  • + {name || id} + + {dayjs(createdAt).format("MMM DD, YYYY")} + + + +
  • + ))} +
+
+ )} +
+
+ +
+
); };