add types to entity editor

rename generateTypes to getColumns
cinnabar-forge · Nov 21, 2024 · 36d0463 · 36d0463
1 parent 37b1983
commit 36d0463
Show file tree

Hide file tree

Showing 4 changed files with 60 additions and 14 deletions.
diff --git a/src/config/file.ts b/src/config/file.ts
@@ -3,7 +3,7 @@ import fs from "fs/promises";
 
 import knex from "../config/database.js";
 import { Config } from "../types/config.js";
-import { generateTypes } from "../utils/db.js";
+import { getColumns } from "../utils/db.js";
 
 let config: Config;
 // eslint-disable-next-line sonarjs/no-unused-collection
@@ -30,7 +30,6 @@ export function getCli() {
  *
  */
 export async function getConfig(): Promise<Config> {
-  console.log("config", config);
   if (config != null) {
     return config;
   }
@@ -60,8 +59,7 @@ export async function getConfig(): Promise<Config> {
       );
 
       for (const tableName of tablesList) {
-        console.log(tableName);
-        const columns = await generateTypes(knex, tableName);
+        const columns = await getColumns(knex, tableName);
         if (!columns) {
           continue;
         }

diff --git a/src/services/getTableEntities.ts b/src/services/getTableEntities.ts
@@ -3,7 +3,7 @@ import {
   GetTableEntitiesParams,
   GetTableEntitiesQuery,
 } from "../types/openapi.js";
-import { generateTypes, tableCheck } from "../utils/db.js";
+import { getColumns, tableCheck } from "../utils/db.js";
 import { getHtmlPageTemplate } from "../utils/html.js";
 
 /**
@@ -22,7 +22,7 @@ export async function getTableEntities(
   const limit = parseInt(query.limit) || 30;
   const offset = parseInt(query.offset) || 0;
 
-  const columns = await generateTypes(knex, tableName || "table");
+  const columns = await getColumns(knex, tableName || "table");
 
   if (!columns) {
     throw new Error(`failed to get columns in '${tableName}'`);
@@ -38,8 +38,6 @@ export async function getTableEntities(
     )
     .map((value) => value.Field);
 
-  console.log("primaryKeys", primaryKeys);
-
   const entities = await knex(tableName)
     .select("*")
     .limit(limit)

diff --git a/src/services/getTableEntity.ts b/src/services/getTableEntity.ts
@@ -1,6 +1,6 @@
 import knex from "../config/database.js";
 import { GetTableEntityParams, GetTableEntityQuery } from "../types/openapi.js";
-import { generateTypes, tableCheck } from "../utils/db.js";
+import { getColumns, tableCheck } from "../utils/db.js";
 import { getHtmlPageTemplate } from "../utils/html.js";
 
 /**
@@ -16,7 +16,7 @@ export async function getTableEntity(
 
   const tableColumns = await tableCheck(tableName);
 
-  const columns = await generateTypes(knex, tableName || "table");
+  const columns = await getColumns(knex, tableName || "table");
 
   if (!columns) {
     throw new Error("no such columns");
@@ -55,9 +55,59 @@ export async function getTableEntity(
       ${visibleColumns
         .filter((column) => tableColumns.includes(column))
         .map((column) => {
-          return `<div>
-            <p><label for="${column}">${column}</label></p>
-            <input type="text" id="${column}" name="${column}" value="${entity[column]}" autocomplete="off" ${primaryKeys.includes(column) ? "disabled" : ""}></div>
+          const columnType = columns.find((c) => c.Field === column)?.Type;
+          let inputType = "text";
+          let inputAttributes = "";
+
+          let columnValue = entity[column];
+
+          if (columnType == null) {
+            inputType = "text";
+          } else if (
+            columnType.includes("int") ||
+            columnType.includes("tinyint")
+          ) {
+            inputType = "number";
+          } else if (
+            columnType.includes("datetime") ||
+            columnType.includes("timestamp")
+          ) {
+            const date = columnValue as Date;
+            if (date && date.toISOString) {
+              columnValue = date.toISOString().slice(0, 16);
+            }
+            inputType = "datetime-local";
+            inputAttributes = `value="${columnValue}"`;
+            return `
+              <div>
+                <p><label for="${column}">${column}</label></p>
+                <input type="${inputType}" id="${column}" name="${column}" ${inputAttributes} ${primaryKeys.includes(column) ? "disabled" : ""}>
+              </div>
+            `;
+          } else if (columnType.includes("enum")) {
+            const enumValues = columnType
+              .replace("enum(", "")
+              .replace(")", "")
+              .split(",");
+            inputAttributes = `value="${entity[column]}"`;
+            return `
+              <div>
+                <p><label for="${column}">${column}</label></p>
+                <select id="${column}" name="${column}" ${primaryKeys.includes(column) ? "disabled" : ""}>
+                  ${enumValues.map((value) => `<option value="${value}" ${entity[column] === value ? "selected" : ""}>${value}</option>`).join("")}
+                </select>
+              </div>
+            `;
+          } else if (columnType.includes("bool")) {
+            inputType = "checkbox";
+            inputAttributes = `value="${entity[column]}" ${entity[column] === 1 ? "checked" : ""}`;
+          }
+
+          return `
+            <div>
+              <p><label for="${column}">${column}</label></p>
+              <input type="${inputType}" id="${column}" name="${column}" value="${columnValue}" autocomplete="off" ${primaryKeys.includes(column) ? "disabled" : ""} ${inputAttributes}>
+            </div>
           `;
         })
         .join("")}

diff --git a/src/utils/db.ts b/src/utils/db.ts
@@ -17,7 +17,7 @@ interface GeneratedResultItem {
  * @param knex
  * @param tableName
  */
-export async function generateTypes(
+export async function getColumns(
   knex: Knex,
   tableName: string,
 ): Promise<GeneratedResultItem[] | undefined> {