feat: update models list ui/ux

.husky/pre-commit

@@ -1,4 +1 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-npx lint-staged
+pnpm lint-staged

apps/console/.eslintrc.cjs

@@ -1,5 +1,10 @@
+var path = require("path");
+
 module.exports = {
   root: true,
   extends: ["next/core-web-vitals"],
   ignorePatterns: [".eslintrc.cjs"],
+  parserOptions: {
+    project: path.join(__dirname, "tsconfig.json"),
+  },
 };

apps/console/package.json

@@ -82,7 +82,6 @@
     "eslint": "^8.13.0",
     "eslint-config-next": "latest",
     "js-yaml": "^4.1.0",
-    "lint-staged": ">=10",
     "npm-run-all": "^4.1.5",
     "openapi-types": "^12.1.3",
     "postcss": "^8.4.12",

apps/console/src/app/[entity]/models/[id]/page.tsx → apps/console/src/app/[entity]/models/[id]/[tab]/page.tsx

@@ -1,13 +1,17 @@
 import { ModelViewPageRender } from "./render";
 import { Metadata } from "next";
+import {
+  type ModelTabNames,
+  getModelTabTitle,
+} from "@instill-ai/toolkit/server";
 
 type Props = {
-  params: { id: string; entity: string };
+  params: { id: string; entity: string; tab: string };
 };
 
 export async function generateMetadata({ params }: Props): Promise<Metadata> {
   const metadata: Metadata = {
-    title: `Instill Core | ${params.id}`,
+    title: `Instill Core | ${params.id} | ${getModelTabTitle(params.tab as ModelTabNames)}`,
 
     openGraph: {
       images: ["/instill-open-graph.png"],

apps/console/src/app/[entity]/models/[id]/render.tsx → apps/console/src/app/[entity]/models/[id]/[tab]/render.tsx

@@ -25,7 +25,6 @@ export function ModelViewPageRender() {
             router={router}
             accessToken={accessToken.isSuccess ? accessToken.data : null}
             enableQuery={accessToken.isSuccess}
-            disabledConfigureModel={false}
           />
         </PageBase.Content>
       </PageBase.Container>

apps/console/src/components/AuthPageBase.tsx

@@ -41,7 +41,7 @@ const Content = ({ children }: { children: React.ReactNode }) => {
 
           <div className="flex flex-row">
             <p className="text-semantic-fg-disabled product-body-text-3-regular mr-auto mt-auto p-8 font-sans">
-              © Instill AI 2023
+              © Instill AI {new Date().getFullYear()}
             </p>
             <Image
               src="/images/auth-page-bg-strip.svg"

apps/console/src/components/ModelReadmeMarkdown.tsx

@@ -44,7 +44,7 @@ export const ModelReadmeMarkdown = ({
           <h3 className="text-instillGrey90 text-instill-h3 mx-auto mt-auto">
             There is no Model card
           </h3>
-          <p className="text-instillGrey50 text-instill-body mx-auto mb-auto">
+          <p className="mx-auto mb-auto text-semantic-node-disconnected-default-stroke text-instill-body">
             You can add a README.md to describe the model.
           </p>
         </React.Fragment>

package.json

@@ -21,7 +21,8 @@
     "test": "turbo run test",
     "ci-build-packages": "turbo run build lint test",
     "ci-build-storybook": "turbo run build --filter=@instill-ai/design-tokens --filter=@instill-ai/design-system",
-    "prettier:fix": "prettier --write"  
+    "prettier:fix": "prettier --write",
+    "prepare": "husky install"
   },
   "devDependencies": {
     "@commitlint/cli": "latest",
@@ -44,5 +45,13 @@
       "vite": "^5.2.0",
       "express": "4.19.2"
     }
+  },
+  "lint-staged": {
+    "**/*.{ts,tsx}": [
+      "prettier --write"
+    ],
+    "**/*.{js,jsx,ts,tsx}": [
+      "eslint --cache --fix"
+    ]
   }
-}
+}

packages/design-system/.eslintrc.cjs

@@ -1,5 +1,10 @@
+var path = require("path");
+
 module.exports = {
   root: true,
   extends: ["@instill-ai/eslint-config-cortex", "plugin:storybook/recommended"],
   ignorePatterns: [".eslintrc.cjs"],
+  parserOptions: {
+    project: path.join(__dirname, "tsconfig.json"),
+  },
 };

packages/design-system/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instill-ai/design-system",
-  "version": "0.69.2",
+  "version": "0.69.2-rc.4",
   "description": "Instill AI's design system",
   "repository": "https://github.com/instill-ai/design-system.git",
   "bugs": "https://github.com/instill-ai/design-system/issues",
@@ -140,11 +140,6 @@
   "engines": {
     "node": ">=14.6.0"
   },
-  "lint-staged": {
-    "*.{js,jsx,ts,tsx}": [
-      "eslint --cache --fix"
-    ]
-  },
   "publishConfig": {
     "access": "public"
   }