auto completion & tags

package.json

@@ -25,7 +25,9 @@
     "react": "^16.8.1",
     "react-dom": "^16.8.1",
     "react-router-dom": "^4.3.1",
-    "react-timeago": "^4.3.0"
+    "react-timeago": "^4.3.0",
+    "redux": "^4.0.1",
+    "redux-react-hook": "^3.3.1"
   },
   "eslintConfig": {
     "extends": "react-app"

src/client/account.ts

@@ -0,0 +1,48 @@
+import { ApiResponse, client, remapFields } from "./index"
+
+export interface Account {
+  id: string
+  name: string
+  email: string
+  avatarUrl: string
+  apiKey: string
+  admin: boolean
+  createdAt: Date
+}
+
+const toAccount = (data: object): Account => {
+  const account = remapFields(data, {
+    avatar_url: "avatarUrl",
+    api_key: "apiKey",
+    created_at: "createdAt",
+  })
+  account.createdAt = new Date(account.createdAt)
+  return account
+}
+
+export const getAccount = (): Promise<ApiResponse<Account>> =>
+  client.get("/v1/account")
+    .then((res) => {
+      if (res.status !== 200) {
+        return { status: res.status, error: res.data }
+      }
+      return { status: res.status, data: toAccount(res.data.account) }
+    })
+
+export const syncAccount = (): Promise<ApiResponse<Account>> =>
+  client.post("/v1/account/sync")
+    .then((res) => {
+      if (res.status !== 200) {
+        return { status: res.status, error: res.data }
+      }
+      return { status: res.status, data: toAccount(res.data.account) }
+    })
+
+export const regenerateApiKey = (): Promise<ApiResponse<Account>> =>
+  client.post("/v1/account/regenerate_apikey")
+    .then((res) => {
+      if (res.status !== 200) {
+        return { status: res.status, error: res.data }
+      }
+      return { status: res.status, data: toAccount(res.data.account) }
+    })

src/client/container.ts

@@ -0,0 +1,45 @@
+import { ApiResponse, client, remapFields } from "./index"
+
+export interface Container {
+  id: string
+  name: string
+  status: string
+  image: string
+  endpoint: string
+  memory: number
+  tags: string[]
+  createdAt: Date
+}
+
+const toContainer = (data: object): Container => {
+  const container = remapFields(data, {
+    created_at: "createdAt",
+  })
+  container.createdAt = new Date(container.createdAt)
+  return container
+}
+
+export const getContainers = (): Promise<ApiResponse<Container[]>> =>
+  client.get("/v1/containers")
+    .then((res) => {
+      if (res.status !== 200) {
+        return { status: res.status, error: res.data }
+      }
+      return { status: res.status, data: res.data.containers.map((data: object) => toContainer(data)) }
+    })
+
+export interface CreateContainerRequest {
+  name: string
+  image: string
+  size: string
+  tags: string[]
+}
+
+export const createContainer = (req: CreateContainerRequest): Promise<ApiResponse<Container>> =>
+  client.post("/v1/containers", req)
+    .then((res) => {
+      if (res.status !== 200) {
+        return { status: res.status, error: res.data }
+      }
+      return { status: res.status, data: toContainer(res.data.container) }
+    })

src/client/image.ts

@@ -0,0 +1,22 @@
+import { ApiResponse, client, remapFields } from "./index"
+
+export interface ImageSummary {
+  name: string
+  tag: string
+  namespaceId: string
+  lastPush: Date
+}
+
+const toImageSummary = (data: object): ImageSummary =>
+  remapFields(data, {
+    namespace_id: "namespaceId",
+    last_push: "lastPush",
+  })
+
+export const getImages = (): Promise<ApiResponse<ImageSummary[]>> =>
+  client.get("/v1/images").then((res) => {
+    if (res.status !== 200) {
+      return { status: res.status, error: res.data }
+    }
+    return { status: res.status, data: res.data.images.map((data: object) => toImageSummary(data)) }
+  })

src/client/index.ts

@@ -0,0 +1,32 @@
+import axios from "axios"
+import * as container from "./container"
+import * as account from "./account"
+import * as image from "./image"
+
+export const client = axios.create({
+  baseURL: process.env.API_URL || "http://localhost:3000",
+  transformRequest(data, headers) {
+    headers.Authorization = document.cookie.split("=")[1]
+    return data
+  },
+  validateStatus() {
+    return true
+  },
+})
+
+export const remapFields = (obj: any, fields: any): any =>
+  Object.entries(obj)
+    .map(([key, value]) => [fields[key] || key, value])
+    .reduce((prev, [key, value]) => ({ ...prev, [key]: value }), {})
+
+export interface ApiResponse<T> {
+  status: number
+  data?: T
+  error?: {
+    message: string
+    fields?: object
+  }
+}
+const a = { ...container, ...account, ...image }
+console.log(a)
+export default a

src/client/plan.ts

@@ -0,0 +1 @@
+export default () => {}