Skip to content

Commit

Permalink
chore: add favorite project from sidebar (#1909)
Browse files Browse the repository at this point in the history
  • Loading branch information
anmolsinghbhatia authored Aug 18, 2023
1 parent 0fbdc0b commit 8d50183
Show file tree
Hide file tree
Showing 2 changed files with 61 additions and 17 deletions.
34 changes: 33 additions & 1 deletion apps/app/components/project/create-project-modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ import { NETWORK_CHOICES } from "constants/project";
type Props = {
isOpen: boolean;
setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
setToFavorite?: boolean;
user: ICurrentUserResponse | undefined;
};

Expand Down Expand Up @@ -74,7 +75,12 @@ const IsGuestCondition: React.FC<{
return null;
};

export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user }) => {
export const CreateProjectModal: React.FC<Props> = ({
isOpen,
setIsOpen,
setToFavorite = false,
user,
}) => {
const [isChangeInIdentifierRequired, setIsChangeInIdentifierRequired] = useState(true);

const { setToastAlert } = useToast();
Expand Down Expand Up @@ -104,6 +110,29 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
reset(defaultValues);
};

const handleAddToFavorites = (projectId: string) => {
if (!workspaceSlug) return;

mutate<IProject[]>(
PROJECTS_LIST(workspaceSlug as string, { is_favorite: "all" }),
(prevData) =>
(prevData ?? []).map((p) => (p.id === projectId ? { ...p, is_favorite: true } : p)),
false
);

projectServices
.addProjectToFavorites(workspaceSlug as string, {
project: projectId,
})
.catch(() =>
setToastAlert({
type: "error",
title: "Error!",
message: "Couldn't remove the project from favorites. Please try again.",
})
);
};

const onSubmit = async (formData: IProject) => {
if (!workspaceSlug) return;

Expand All @@ -125,6 +154,9 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
title: "Success!",
message: "Project created successfully.",
});
if (setToFavorite) {
handleAddToFavorites(res.id);
}
handleClose();
})
.catch((err) => {
Expand Down
44 changes: 28 additions & 16 deletions apps/app/components/project/sidebar-list.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import useTheme from "hooks/use-theme";
import useUserAuth from "hooks/use-user-auth";
import useProjects from "hooks/use-projects";
// components
import { DeleteProjectModal, SingleSidebarProject } from "components/project";
import { CreateProjectModal, DeleteProjectModal, SingleSidebarProject } from "components/project";
// services
import projectService from "services/project.service";
// icons
Expand All @@ -32,6 +32,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
export const ProjectSidebarList: FC = () => {
const store: any = useMobxStore();

const [isProjectModalOpen, setIsProjectModalOpen] = useState(false);
const [deleteProjectModal, setDeleteProjectModal] = useState(false);
const [projectToDelete, setProjectToDelete] = useState<IProject | null>(null);

Expand Down Expand Up @@ -151,6 +152,12 @@ export const ProjectSidebarList: FC = () => {

return (
<>
<CreateProjectModal
isOpen={isProjectModalOpen}
setIsOpen={setIsProjectModalOpen}
setToFavorite
user={user}
/>
<DeleteProjectModal
isOpen={deleteProjectModal}
onClose={() => setDeleteProjectModal(false)}
Expand All @@ -172,17 +179,25 @@ export const ProjectSidebarList: FC = () => {
{({ open }) => (
<>
{!store?.theme?.sidebarCollapsed && (
<Disclosure.Button
as="button"
type="button"
className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
>
Favorites
<Icon
iconName={open ? "arrow_drop_down" : "arrow_right"}
className="group-hover:opacity-100 opacity-0 !text-lg"
/>
</Disclosure.Button>
<div className="group flex justify-between items-center text-xs px-1.5 rounded text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-80 w-full">
<Disclosure.Button
as="button"
type="button"
className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-400 text-left hover:bg-custom-sidebar-background-80 rounded w-full whitespace-nowrap"
>
Favorites
<Icon
iconName={open ? "arrow_drop_down" : "arrow_right"}
className="group-hover:opacity-100 opacity-0 !text-lg"
/>
</Disclosure.Button>
<button
className="group-hover:opacity-100 opacity-0"
onClick={() => setIsProjectModalOpen(true)}
>
<Icon iconName="add" />
</button>
</div>
)}
<Disclosure.Panel as="div" className="space-y-2">
{orderedFavProjects.map((project, index) => (
Expand Down Expand Up @@ -241,10 +256,7 @@ export const ProjectSidebarList: FC = () => {
</Disclosure.Button>
<button
className="group-hover:opacity-100 opacity-0"
onClick={() => {
const e = new KeyboardEvent("keydown", { key: "p" });
document.dispatchEvent(e);
}}
onClick={() => setIsProjectModalOpen(true)}
>
<Icon iconName="add" />
</button>
Expand Down

1 comment on commit 8d50183

@vercel
Copy link

@vercel vercel bot commented on 8d50183 Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

plane-dev – ./apps/app

plane-dev.vercel.app
plane-dev-git-develop-plane.vercel.app
plane-dev-plane.vercel.app

Please sign in to comment.