fix: icon picker not working (#1080)

* fix: icon picker not working

* fix: project icon in analytics sidebar
This commit is contained in:
Aaryan Khandelwal 2023-05-19 16:35:51 +05:30 committed by GitHub
parent e3a114cd69
commit 7f5fdb9589
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 158 additions and 71 deletions

View file

@ -56,27 +56,14 @@ const ControlSettings: NextPage = () => {
formState: { isSubmitting },
} = useForm<IProject>({ defaultValues });
useEffect(() => {
if (projectDetails)
reset({
...projectDetails,
default_assignee: projectDetails.default_assignee?.id ?? projectDetails.default_assignee,
project_lead: projectDetails.project_lead?.id ?? projectDetails.project_lead,
workspace: (projectDetails.workspace as IWorkspace).id,
});
}, [projectDetails, reset]);
const onSubmit = async (formData: IProject) => {
if (!workspaceSlug || !projectId) return;
const payload: Partial<IProject> = {
name: formData.name,
network: formData.network,
identifier: formData.identifier,
description: formData.description,
default_assignee: formData.default_assignee,
project_lead: formData.project_lead,
icon: formData.icon,
};
await projectService
.updateProject(workspaceSlug as string, projectId as string, payload)
.then((res) => {
@ -94,6 +81,16 @@ const ControlSettings: NextPage = () => {
});
};
useEffect(() => {
if (projectDetails)
reset({
...projectDetails,
default_assignee: projectDetails.default_assignee?.id ?? projectDetails.default_assignee,
project_lead: projectDetails.project_lead?.id ?? projectDetails.project_lead,
workspace: (projectDetails.workspace as IWorkspace).id,
});
}, [projectDetails, reset]);
return (
<ProjectAuthorizationWrapper
breadcrumbs={

View file

@ -74,8 +74,7 @@ const GeneralSettings: NextPage = () => {
if (projectDetails)
reset({
...projectDetails,
default_assignee: projectDetails.default_assignee?.id,
project_lead: projectDetails.project_lead?.id,
emoji_and_icon: projectDetails.emoji ?? projectDetails.icon_prop,
workspace: (projectDetails.workspace as IWorkspace).id,
});
}, [projectDetails, reset]);
@ -115,12 +114,17 @@ const GeneralSettings: NextPage = () => {
network: formData.network,
identifier: formData.identifier,
description: formData.description,
default_assignee: formData.default_assignee,
project_lead: formData.project_lead,
icon: formData.icon,
cover_image: formData.cover_image,
};
if (typeof formData.emoji_and_icon === "object") {
payload.emoji = null;
payload.icon_prop = formData.emoji_and_icon;
} else {
payload.emoji = formData.emoji_and_icon;
payload.icon_prop = null;
}
if (projectDetails.identifier !== formData.identifier)
await projectService
.checkProjectIdentifierAvailability(workspaceSlug as string, payload.identifier ?? "")
@ -163,17 +167,34 @@ const GeneralSettings: NextPage = () => {
</div>
<div className="col-span-12 flex gap-2 sm:col-span-6">
{projectDetails ? (
<Controller
control={control}
name="icon"
render={({ field: { value, onChange } }) => (
<EmojiIconPicker
label={value ? String.fromCodePoint(parseInt(value)) : "Icon"}
value={value}
onChange={onChange}
/>
)}
/>
<div className="h-7 w-7 grid place-items-center">
<Controller
control={control}
name="emoji_and_icon"
render={({ field: { value, onChange } }) => (
<EmojiIconPicker
label={
value ? (
typeof value === "object" ? (
<span
style={{ color: value.color }}
className="material-symbols-rounded text-lg"
>
{value.name}
</span>
) : (
String.fromCodePoint(parseInt(value))
)
) : (
"Icon"
)
}
value={value}
onChange={onChange}
/>
)}
/>
</div>
) : (
<Loader>
<Loader.Item height="46px" width="46px" />