feat: Update Services and Settings pages to include Labels and Tech Stack fields with improved descriptions

This commit is contained in:
Nawaz Dhandala 2026-01-09 14:27:16 +00:00
parent b0ab3f299c
commit 89e1bdedaf
No known key found for this signature in database
GPG key ID: 96C5DCA24769DBCA
2 changed files with 33 additions and 8 deletions

View file

@ -2,11 +2,9 @@ import LabelsElement from "Common/UI/Components/Label/Labels";
import ServiceElement from "../../Components/Service/ServiceElement";
import ProjectUtil from "Common/UI/Utils/Project";
import PageComponentProps from "../PageComponentProps";
import TechStack from "Common/Types/Service/TechStack";
import FormFieldSchemaType from "Common/UI/Components/Forms/Types/FormFieldSchemaType";
import ModelTable from "Common/UI/Components/ModelTable/ModelTable";
import FieldType from "Common/UI/Components/Types/FieldType";
import DropdownUtil from "Common/UI/Utils/Dropdown";
import Navigation from "Common/UI/Utils/Navigation";
import Label from "Common/Models/DatabaseModels/Label";
import Service from "Common/Models/DatabaseModels/Service";
@ -58,15 +56,19 @@ const ServicesPage: FunctionComponent<
},
{
field: {
techStack: true,
labels: true,
},
title: "Tech Stack",
title: "Labels",
description:
"Tech stack used in the service. This will help other developers understand the service better.",
"Labels help you categorize and organize your services.",
fieldType: FormFieldSchemaType.MultiSelectDropdown,
required: true,
placeholder: "Tech Stack",
dropdownOptions: DropdownUtil.getDropdownOptionsFromEnum(TechStack),
required: false,
placeholder: "Labels",
dropdownModal: {
type: Label,
labelField: "name",
valueField: "_id",
},
},
]}
showRefreshButton={true}

View file

@ -1,8 +1,10 @@
import PageComponentProps from "../../PageComponentProps";
import ObjectID from "Common/Types/ObjectID";
import TechStack from "Common/Types/Service/TechStack";
import FormFieldSchemaType from "Common/UI/Components/Forms/Types/FormFieldSchemaType";
import CardModelDetail from "Common/UI/Components/ModelDetail/CardModelDetail";
import FieldType from "Common/UI/Components/Types/FieldType";
import DropdownUtil from "Common/UI/Utils/Dropdown";
import Navigation from "Common/UI/Utils/Navigation";
import Service from "Common/Models/DatabaseModels/Service";
import React, { Fragment, FunctionComponent, ReactElement } from "react";
@ -33,6 +35,18 @@ const ServiceSettings: FunctionComponent<
required: true,
placeholder: "15",
},
{
field: {
techStack: true,
},
title: "Tech Stack",
description:
"Tech stack used in the service. This will help other developers understand the service better.",
fieldType: FormFieldSchemaType.MultiSelectDropdown,
required: false,
placeholder: "Tech Stack",
dropdownOptions: DropdownUtil.getDropdownOptionsFromEnum(TechStack),
},
]}
modelDetailProps={{
modelType: Service,
@ -46,6 +60,15 @@ const ServiceSettings: FunctionComponent<
description: "Color for your service.",
fieldType: FieldType.Color,
},
{
field: {
techStack: true,
},
title: "Tech Stack",
description:
"Tech stack used in the service. This will help other developers understand the service better.",
fieldType: FieldType.ArrayOfText,
},
],
modelId: modelId,
}}