awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-15 06:35:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

improvement: address requested feedback

Browse Source
This commit is contained in:
Scott Wilson
2024-11-07 12:38:33 -08:00
parent 61f786e8d8
commit 19c26c680c
24 changed files with 263 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/hooks/api/projectTemplates/types.ts
+3 -1
View File
@@ -26,4 +26,6 @@ export type TDeleteProjectTemplateDTO = {
templateId: string;
};
export const DefaultProjectTemplateIdentifier = "default";
export enum InfisicalProjectTemplate {
Default = "default"
}
frontend/src/hooks/api/workspace/queries.tsx
+4 -4
View File
@@ -209,20 +209,20 @@ export const useGetWorkspaceIntegrations = (workspaceId: string) =>
export const createWorkspace = ({
projectName,
kmsKeyId,
templateId
template
}: CreateWorkspaceDTO): Promise<{ data: { project: Workspace } }> => {
return apiRequest.post("/api/v2/workspace", { projectName, kmsKeyId, templateId });
return apiRequest.post("/api/v2/workspace", { projectName, kmsKeyId, template });
};
export const useCreateWorkspace = () => {
const queryClient = useQueryClient();
return useMutation<{ data: { project: Workspace } }, {}, CreateWorkspaceDTO>({
mutationFn: async ({ projectName, kmsKeyId, templateId }) =>
mutationFn: async ({ projectName, kmsKeyId, template }) =>
createWorkspace({
projectName,
kmsKeyId,
templateId
template
}),
onSuccess: () => {
queryClient.invalidateQueries(workspaceKeys.getAllUserWorkspace);
frontend/src/hooks/api/workspace/types.ts
+1 -1
View File
@@ -57,7 +57,7 @@ export type TGetUpgradeProjectStatusDTO = {
export type CreateWorkspaceDTO = {
projectName: string;
kmsKeyId?: string;
templateId?: string;
template?: string;
};
export type RenameWorkspaceDTO = { workspaceID: string; newWorkspaceName: string };
frontend/src/layouts/AppLayout/AppLayout.tsx
+18 -27
View File
@@ -79,10 +79,7 @@ import {
useSelectOrganization
} from "@app/hooks/api";
import { INTERNAL_KMS_KEY_ID } from "@app/hooks/api/kms/types";
import {
DefaultProjectTemplateIdentifier,
useListProjectTemplates
} from "@app/hooks/api/projectTemplates";
import { InfisicalProjectTemplate, useListProjectTemplates } from "@app/hooks/api/projectTemplates";
import { Workspace } from "@app/hooks/api/types";
import { useUpdateUserProjectFavorites } from "@app/hooks/api/users/mutation";
import { useGetUserProjectFavorites } from "@app/hooks/api/users/queries";
@@ -130,7 +127,7 @@ const formSchema = yup.object({
.max(64, "Too long, maximum length is 64 characters"),
addMembers: yup.bool().required().label("Add Members"),
kmsKeyId: yup.string().label("KMS Key ID"),
templateId: yup.string().label("Project Template ID")
template: yup.string().label("Project Template Name")
});
type TAddProjectFormData = yup.InferType<typeof formSchema>;
@@ -288,12 +285,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
enabled: canReadProjectTemplates && subscription?.projectTemplates
});
const onCreateProject = async ({
name,
addMembers,
kmsKeyId,
templateId
}: TAddProjectFormData) => {
const onCreateProject = async ({ name, addMembers, kmsKeyId, template }: TAddProjectFormData) => {
// type check
if (!currentOrg) return;
if (!user) return;
@@ -305,7 +297,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
} = await createWs.mutateAsync({
projectName: name,
kmsKeyId: kmsKeyId !== INTERNAL_KMS_KEY_ID ? kmsKeyId : undefined,
templateId: templateId === DefaultProjectTemplateIdentifier ? undefined : templateId
template
});
if (addMembers) {
@@ -948,7 +940,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
/>
<Controller
control={control}
name="templateId"
name="template"
render={({ field: { value, onChange } }) => (
<OrgPermissionCan
I={OrgPermissionActions.Read}
@@ -971,25 +963,24 @@ export const AppLayout = ({ children }: LayoutProps) => {
}
>
<Select
defaultValue={DefaultProjectTemplateIdentifier}
placeholder={DefaultProjectTemplateIdentifier}
defaultValue={InfisicalProjectTemplate.Default}
placeholder={InfisicalProjectTemplate.Default}
isDisabled={!isAllowed || !subscription?.projectTemplates}
value={value}
onValueChange={onChange}
className="w-44"
>
<SelectItem value={DefaultProjectTemplateIdentifier}>
{DefaultProjectTemplateIdentifier}
</SelectItem>
{projectTemplates
.filter(
(template) => template.name !== DefaultProjectTemplateIdentifier
)
.map((template) => (
<SelectItem key={template.id} value={template.id}>
{template.name}
</SelectItem>
))}
{projectTemplates.length
? projectTemplates.map((template) => (
<SelectItem key={template.id} value={template.name}>
{template.name}
</SelectItem>
))
: Object.values(InfisicalProjectTemplate).map((template) => (
<SelectItem key={template} value={template}>
{template}
</SelectItem>
))}
</Select>
</FormControl>
)}
frontend/src/pages/org/[id]/overview/index.tsx
+18 -27
View File
@@ -70,10 +70,7 @@ import {
useRegisterUserAction
} from "@app/hooks/api";
import { INTERNAL_KMS_KEY_ID } from "@app/hooks/api/kms/types";
import {
DefaultProjectTemplateIdentifier,
useListProjectTemplates
} from "@app/hooks/api/projectTemplates";
import { InfisicalProjectTemplate, useListProjectTemplates } from "@app/hooks/api/projectTemplates";
// import { fetchUserWsKey } from "@app/hooks/api/keys/queries";
import { useFetchServerStatus } from "@app/hooks/api/serverDetails";
import { Workspace } from "@app/hooks/api/types";
@@ -488,7 +485,7 @@ const formSchema = yup.object({
.max(64, "Too long, maximum length is 64 characters"),
addMembers: yup.bool().required().label("Add Members"),
kmsKeyId: yup.string().label("KMS Key ID"),
templateId: yup.string().label("Project Template ID")
template: yup.string().label("Project Template Name")
});
type TAddProjectFormData = yup.InferType<typeof formSchema>;
@@ -543,12 +540,7 @@ const OrganizationPage = () => {
enabled: permission.can(OrgPermissionActions.Read, OrgPermissionSubjects.Kms)
});
const onCreateProject = async ({
name,
addMembers,
kmsKeyId,
templateId
}: TAddProjectFormData) => {
const onCreateProject = async ({ name, addMembers, kmsKeyId, template }: TAddProjectFormData) => {
// type check
if (!currentOrg) return;
if (!user) return;
@@ -560,7 +552,7 @@ const OrganizationPage = () => {
} = await createWs.mutateAsync({
projectName: name,
kmsKeyId: kmsKeyId !== INTERNAL_KMS_KEY_ID ? kmsKeyId : undefined,
templateId: templateId === DefaultProjectTemplateIdentifier ? undefined : templateId
template
});
if (addMembers) {
@@ -1076,7 +1068,7 @@ const OrganizationPage = () => {
/>
<Controller
control={control}
name="templateId"
name="template"
render={({ field: { value, onChange } }) => (
<OrgPermissionCan
I={OrgPermissionActions.Read}
@@ -1099,25 +1091,24 @@ const OrganizationPage = () => {
}
>
<Select
defaultValue={DefaultProjectTemplateIdentifier}
placeholder={DefaultProjectTemplateIdentifier}
defaultValue={InfisicalProjectTemplate.Default}
placeholder={InfisicalProjectTemplate.Default}
isDisabled={!isAllowed || !subscription?.projectTemplates}
value={value}
onValueChange={onChange}
className="w-44"
>
<SelectItem value={DefaultProjectTemplateIdentifier}>
{DefaultProjectTemplateIdentifier}
</SelectItem>
{projectTemplates
.filter(
(template) => template.name !== DefaultProjectTemplateIdentifier
)
.map((template) => (
<SelectItem key={template.id} value={template.id}>
{template.name}
</SelectItem>
))}
{projectTemplates.length
? projectTemplates.map((template) => (
<SelectItem key={template.id} value={template.name}>
{template.name}
</SelectItem>
))
: Object.values(InfisicalProjectTemplate).map((template) => (
<SelectItem key={template} value={template}>
{template}
</SelectItem>
))}
</Select>
</FormControl>
)}
frontend/src/views/Settings/OrgSettingsPage/components/ProjectTemplatesTab/components/EditProjectTemplateSection/EditProjectTemplateSection.tsx
+6 -4
View File
@@ -3,7 +3,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Button, EmptyState, Spinner } from "@app/components/v2";
import {
DefaultProjectTemplateIdentifier,
InfisicalProjectTemplate,
TProjectTemplate,
useGetProjectTemplateById
} from "@app/hooks/api/projectTemplates";
@@ -16,11 +16,13 @@ type Props = {
};
export const EditProjectTemplateSection = ({ template, onBack }: Props) => {
const isDefault = template.name === DefaultProjectTemplateIdentifier;
const isInfisicalTemplate = Object.values(InfisicalProjectTemplate).includes(
template.name as InfisicalProjectTemplate
);
const { data: projectTemplate, isLoading } = useGetProjectTemplateById(template.id, {
initialData: template,
enabled: !isDefault
enabled: !isInfisicalTemplate
});
return (
@@ -41,7 +43,7 @@ export const EditProjectTemplateSection = ({ template, onBack }: Props) => {
</div>
) : projectTemplate ? (
<EditProjectTemplate
isDefault={isDefault}
isInfisicalTemplate={isInfisicalTemplate}
projectTemplate={projectTemplate}
onBack={onBack}
/>
frontend/src/views/Settings/OrgSettingsPage/components/ProjectTemplatesTab/components/EditProjectTemplateSection/components/EditProjectTemplate.tsx
+8 -5
View File
@@ -23,10 +23,10 @@ import { ProjectTemplateRolesSection } from "./ProjectTemplateRolesSection";
type Props = {
projectTemplate: TProjectTemplate;
onBack: () => void;
isDefault: boolean;
isInfisicalTemplate: boolean;
};
export const EditProjectTemplate = ({ isDefault, projectTemplate, onBack }: Props) => {
export const EditProjectTemplate = ({ isInfisicalTemplate, projectTemplate, onBack }: Props) => {
const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
"removeTemplate",
"editDetails"
@@ -63,7 +63,7 @@ export const EditProjectTemplate = ({ isDefault, projectTemplate, onBack }: Prop
<h3 className="text-xl font-semibold">{name}</h3>
<h2 className="text-sm text-mineshaft-400">{description || "Project Template"}</h2>
</div>
{!isDefault && (
{!isInfisicalTemplate && (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<IconButton
@@ -117,9 +117,12 @@ export const EditProjectTemplate = ({ isDefault, projectTemplate, onBack }: Prop
</DropdownMenu>
)}
</div>
<ProjectTemplateEnvironmentsForm isDefault={isDefault} projectTemplate={projectTemplate} />
<ProjectTemplateEnvironmentsForm
isInfisicalTemplate={isInfisicalTemplate}
projectTemplate={projectTemplate}
/>
<ProjectTemplateRolesSection
isDefaultTemplate={isDefault}
isInfisicalTemplate={isInfisicalTemplate}
projectTemplate={projectTemplate}
/>
<ProjectTemplateDetailsModal
frontend/src/views/Settings/OrgSettingsPage/components/ProjectTemplatesTab/components/EditProjectTemplateSection/components/ProjectTemplateEditRoleForm.tsx
+1 -1
View File
@@ -169,7 +169,7 @@ export const ProjectTemplateEditRoleForm = ({
label="Name"
className="mb-0 flex-1"
>
<Input {...field} placeholder="Role name..." />
<Input {...field} autoFocus placeholder="Role name..." />
</FormControl>
)}
/>
frontend/src/views/Settings/OrgSettingsPage/components/ProjectTemplatesTab/components/EditProjectTemplateSection/components/ProjectTemplateEnvironmentsForm.tsx
+11 -8
View File
@@ -25,7 +25,7 @@ import { slugSchema } from "@app/lib/schemas";
type Props = {
projectTemplate: TProjectTemplate;
isDefault: boolean;
isInfisicalTemplate: boolean;
};
const formSchema = z.object({
@@ -39,7 +39,10 @@ const formSchema = z.object({
type TFormSchema = z.infer<typeof formSchema>;
export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }: Props) => {
export const ProjectTemplateEnvironmentsForm = ({
projectTemplate,
isInfisicalTemplate
}: Props) => {
const {
control,
handleSubmit,
@@ -94,13 +97,13 @@ export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }:
<div className="mb-4 flex items-center justify-between border-b border-mineshaft-400 pb-4">
<div>
<h2 className="text-lg font-semibold">Project Environments</h2>
{!isDefault && (
{!isInfisicalTemplate && (
<p className="text-sm text-mineshaft-400">
Add, rename, remove and reorder environments for this project template
</p>
)}
</div>
{!isDefault && (
{!isInfisicalTemplate && (
<OrgPermissionCan
I={OrgPermissionActions.Edit}
a={OrgPermissionSubjects.ProjectTemplates}
@@ -129,7 +132,7 @@ export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }:
<Tr>
<Th>Friendly Name</Th>
<Th>Slug</Th>
{!isDefault && (
{!isInfisicalTemplate && (
<Th>
<div className="flex w-full justify-end normal-case">
<OrgPermissionCan
@@ -161,7 +164,7 @@ export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }:
{environments.map(({ id, name, slug }, pos) => (
<Tr key={id}>
<Td>
{isDefault ? (
{isInfisicalTemplate ? (
name
) : (
<OrgPermissionCan
@@ -187,7 +190,7 @@ export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }:
)}
</Td>
<Td>
{isDefault ? (
{isInfisicalTemplate ? (
slug
) : (
<OrgPermissionCan
@@ -212,7 +215,7 @@ export const ProjectTemplateEnvironmentsForm = ({ projectTemplate, isDefault }:
</OrgPermissionCan>
)}
</Td>
{!isDefault && (
{!isInfisicalTemplate && (
<Td className="flex items-center justify-end">
<OrgPermissionCan
I={OrgPermissionActions.Edit}
frontend/src/views/Settings/OrgSettingsPage/components/ProjectTemplatesTab/components/EditProjectTemplateSection/components/ProjectTemplateRolesSection.tsx
+4 -4
View File
@@ -27,10 +27,10 @@ import { ProjectTemplateEditRoleForm } from "./ProjectTemplateEditRoleForm";
type Props = {
projectTemplate: TProjectTemplate;
isDefaultTemplate: boolean;
isInfisicalTemplate: boolean;
};
export const ProjectTemplateRolesSection = ({ projectTemplate, isDefaultTemplate }: Props) => {
export const ProjectTemplateRolesSection = ({ projectTemplate, isInfisicalTemplate }: Props) => {
const { popUp, handlePopUpOpen, handlePopUpToggle, handlePopUpClose } = usePopUp([
"removeRole",
"editRole"
@@ -108,12 +108,12 @@ export const ProjectTemplateRolesSection = ({ projectTemplate, isDefaultTemplate
<div>
<h2 className="text-lg font-semibold">Project Roles</h2>
<p className="text-sm text-mineshaft-400">
{isDefaultTemplate
{isInfisicalTemplate
? "Click a role to view the associated permissions"
: "Add, edit and remove roles for this project template"}
</p>
</div>
{!isDefaultTemplate && (
{!isInfisicalTemplate && (
<OrgPermissionCan
I={OrgPermissionActions.Edit}
a={OrgPermissionSubjects.ProjectTemplates}