Merge pull request #857 from makeplane/develop

promote: develop to stage-release

apiserver/plane/api/serializers/view.py

@@ -25,22 +25,18 @@ class IssueViewSerializer(BaseSerializer):
 
     def create(self, validated_data):
         query_params = validated_data.get("query_data", {})
-
+        if bool(query_params):
-        if not bool(query_params):
-            raise serializers.ValidationError(
-                {"query_data": ["Query data field cannot be empty"]}
-            )
-
             validated_data["query"] = issue_filters(query_params, "POST")
+        else:
+            validated_data["query"] = dict()
         return IssueView.objects.create(**validated_data)
 
     def update(self, instance, validated_data):
         query_params = validated_data.get("query_data", {})
-        if not bool(query_params):
+        if bool(query_params):
-            raise serializers.ValidationError(
+            validated_data["query"] = issue_filters(query_params, "POST")
-                {"query_data": ["Query data field cannot be empty"]}
+        else:
-            )
+            validated_data["query"] = dict()
-
         validated_data["query"] = issue_filters(query_params, "PATCH")
         return super().update(instance, validated_data)
 

apiserver/plane/api/views/issue.py

@@ -246,6 +246,20 @@ class UserWorkSpaceIssues(BaseAPIView):
                 .prefetch_related("assignees")
                 .prefetch_related("labels")
                 .order_by("-created_at")
+                .annotate(
+                    link_count=IssueLink.objects.filter(issue=OuterRef("id"))
+                    .order_by()
+                    .annotate(count=Func(F("id"), function="Count"))
+                    .values("count")
+                )
+                .annotate(
+                    attachment_count=IssueAttachment.objects.filter(
+                        issue=OuterRef("id")
+                    )
+                    .order_by()
+                    .annotate(count=Func(F("id"), function="Count"))
+                    .values("count")
+                )
             )
             serializer = IssueLiteSerializer(issues, many=True)
             return Response(serializer.data, status=status.HTTP_200_OK)

apps/app/components/auth-screens/project/join-project.tsx

@@ -5,15 +5,16 @@ import { useRouter } from "next/router";
 
 import { mutate } from "swr";
 
+// services
+import projectService from "services/project.service";
 // ui
 import { PrimaryButton } from "components/ui";
-// icon
+// icons
 import { AssignmentClipboardIcon } from "components/icons";
-// img
+// images
 import JoinProjectImg from "public/auth/project-not-authorized.svg";
-import projectService from "services/project.service";
 // fetch-keys
-import { PROJECT_MEMBERS } from "constants/fetch-keys";
+import { USER_PROJECT_VIEW } from "constants/fetch-keys";
 
 export const JoinProject: React.FC = () => {
   const [isJoiningProject, setIsJoiningProject] = useState(false);
@@ -22,13 +23,16 @@ export const JoinProject: React.FC = () => {
   const { workspaceSlug, projectId } = router.query;
 
   const handleJoin = () => {
+    if (!workspaceSlug || !projectId) return;
+
     setIsJoiningProject(true);
     projectService
       .joinProject(workspaceSlug as string, {
         project_ids: [projectId as string],
       })
-      .then(() => {
+      .then(async () => {
-        mutate(PROJECT_MEMBERS(projectId as string));
+        await mutate(USER_PROJECT_VIEW(workspaceSlug.toString()));
+        setIsJoiningProject(false);
       })
       .catch((err) => {
         console.error(err);

apps/app/components/core/existing-issues-list-modal.tsx

@@ -19,7 +19,12 @@ import { LayerDiagonalIcon } from "components/icons";
 // types
 import { IIssue } from "types";
 // fetch-keys
-import { CYCLE_ISSUES_WITH_PARAMS, MODULE_ISSUES_WITH_PARAMS } from "constants/fetch-keys";
+import {
+  CYCLE_DETAILS,
+  CYCLE_ISSUES_WITH_PARAMS,
+  MODULE_DETAILS,
+  MODULE_ISSUES_WITH_PARAMS,
+} from "constants/fetch-keys";
 
 type FormInput = {
   issues: string[];
@@ -76,8 +81,14 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
     }
 
     await handleOnSubmit(data);
-    if (cycleId) mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId as string, params));
+    if (cycleId) {
-    if (moduleId) mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params));
+      mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId as string, params));
+      mutate(CYCLE_DETAILS(cycleId as string));
+    }
+    if (moduleId) {
+      mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params));
+      mutate(MODULE_DETAILS(moduleId as string));
+    }
 
     handleClose();
 

apps/app/components/core/feeds.tsx

@@ -73,6 +73,10 @@ const activityDetails: {
     message: "updated the description.",
     icon: <ChatBubbleBottomCenterTextIcon className="h-3 w-3 text-gray-500" aria-hidden="true" />,
   },
+  estimate_point: {
+    message: "set the estimate point to",
+    icon: <PlayIcon className="h-3 w-3 text-gray-500 -rotate-90" aria-hidden="true" />,
+  },
   target_date: {
     message: "set the due date to",
     icon: <CalendarDaysIcon className="h-3 w-3 text-gray-500" aria-hidden="true" />,
@@ -136,8 +140,6 @@ export const Feeds: React.FC<any> = ({ activities }) => (
           action = `${activity.verb} the`;
         } else if (activity.field === "link") {
           action = `${activity.verb} the`;
-        } else if (activity.field === "estimate") {
-          action = "updated the";
         }
         // for values that are after the action clause
         let value: any = activity.new_value ? activity.new_value : activity.old_value;
@@ -188,8 +190,10 @@ export const Feeds: React.FC<any> = ({ activities }) => (
           value = "attachment";
         } else if (activity.field === "link") {
           value = "link";
-        } else if (activity.field === "estimate") {
+        } else if (activity.field === "estimate_point") {
-          value = "estimate";
+          value = activity.new_value
+            ? activity.new_value + ` Point${parseInt(activity.new_value ?? "", 10) > 1 ? "s" : ""}`
+            : "None";
         }
 
         if (activity.field === "comment") {

apps/app/components/core/filter-list.tsx

@@ -309,7 +309,19 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
                   )}
                 </div>
               ) : (
-                <span className="capitalize">{filters[key as keyof typeof filters]}</span>
+                <div className="flex items-center gap-x-1 capitalize">
+                  {filters[key as keyof typeof filters]}
+                  <button
+                    type="button"
+                    onClick={() =>
+                      setFilters({
+                        [key]: null,
+                      })
+                    }
+                  >
+                    <XMarkIcon className="h-3 w-3" />
+                  </button>
+                </div>
               )}
             </div>
           );
@@ -319,6 +331,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
           type="button"
           onClick={() =>
             setFilters({
+              type: null,
               state: null,
               priority: null,
               assignees: null,

apps/app/components/core/issues-view.tsx

@@ -234,7 +234,7 @@ export const IssuesView: React.FC<Props> = ({
             )
               trackEventServices.trackIssueMarkedAsDoneEvent({
                 workspaceSlug,
-                workspaceId: draggedItem.workspace_detail.id,
+                workspaceId: draggedItem.workspace,
                 projectName: draggedItem.project_detail.name,
                 projectIdentifier: draggedItem.project_detail.identifier,
                 projectId,
@@ -359,12 +359,15 @@ export const IssuesView: React.FC<Props> = ({
     (key) => filters[key as keyof IIssueFilterOptions] === null
   );
 
+  const areFiltersApplied =
+    Object.keys(filters).length > 0 && nullFilters.length !== Object.keys(filters).length;
+
   return (
     <>
       <CreateUpdateViewModal
         isOpen={createViewModal !== null}
         handleClose={() => setCreateViewModal(null)}
-        data={createViewModal}
+        preLoadedData={createViewModal}
       />
       <CreateUpdateIssueModal
         isOpen={createIssueModal && preloadedData?.actionType === "createIssue"}
@@ -388,11 +391,15 @@ export const IssuesView: React.FC<Props> = ({
         handleClose={() => setTransferIssuesModal(false)}
         isOpen={transferIssuesModal}
       />
-      <div>
+      {issueView !== "calendar" && (
-        <div className="flex items-center justify-between gap-2">
+        <>
+          <div
+            className={`flex items-center justify-between gap-2 ${
+              issueView === "list" && areFiltersApplied ? "px-8 mt-6" : "-mt-2"
+            }`}
+          >
             <FilterList filters={filters} setFilters={setFilters} />
-          {Object.keys(filters).length > 0 &&
+            {areFiltersApplied && (
-            nullFilters.length !== Object.keys(filters).length && (
               <PrimaryButton
                 onClick={() => {
                   if (viewId) {
@@ -414,19 +421,18 @@ export const IssuesView: React.FC<Props> = ({
               </PrimaryButton>
             )}
           </div>
-      </div>
+          {areFiltersApplied && (
-
+            <div className={` ${issueView === "list" ? "mt-4" : "my-4"} border-t`} />
-      {Object.keys(filters).length > 0 && nullFilters.length !== Object.keys(filters).length && (
+          )}
-        <div className="mb-5 border-t" />
+        </>
       )}
-
       <DragDropContext onDragEnd={handleOnDragEnd}>
         <StrictModeDroppable droppableId="trashBox">
           {(provided, snapshot) => (
             <div
               className={`${
                 trashBox ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0"
-              } fixed top-9 right-9 z-20 flex h-28 w-96 flex-col items-center justify-center gap-2 rounded border-2 border-red-500 bg-red-100 p-3 text-xs font-medium italic text-red-500 ${
+              } fixed top-9 right-9 z-30 flex h-28 w-96 flex-col items-center justify-center gap-2 rounded border-2 border-red-500 bg-red-100 p-3 text-xs font-medium italic text-red-500 ${
                 snapshot.isDraggingOver ? "bg-red-500 text-white" : ""
               } duration-200`}
               ref={provided.innerRef}
@@ -434,7 +440,6 @@ export const IssuesView: React.FC<Props> = ({
             >
               <TrashIcon className="h-4 w-4" />
               Drop issue here to delete
-              {provided.placeholder}
             </div>
           )}
         </StrictModeDroppable>

apps/app/components/core/list-view/all-lists.tsx

@@ -36,7 +36,7 @@ export const AllLists: React.FC<Props> = ({
   return (
     <>
       {groupedByIssues && (
-        <div className="flex flex-col space-y-5 gap-4 bg-white">
+        <div className="flex flex-col space-y-5 bg-white">
           {Object.keys(groupedByIssues).map((singleGroup) => {
             const currentState =
               selectedGroup === "state" ? states?.find((s) => s.id === singleGroup) : null;

apps/app/components/core/list-view/single-issue.tsx

@@ -216,9 +216,9 @@ export const SingleListIssue: React.FC<Props> = ({
           </ContextMenu.Item>
         </a>
       </ContextMenu>
-      <div className="border-b mx-4 border-gray-300 last:border-b-0">
+      <div className="border-b mx-6 border-gray-300 last:border-b-0">
         <div
-          className="flex items-center justify-between gap-2 px-4 py-3"
+          className="flex items-center justify-between gap-2  py-3"
           onContextMenu={(e) => {
             e.preventDefault();
             setContextMenu(true);

apps/app/components/estimates/single-estimate.tsx

@@ -152,14 +152,16 @@ export const SingleEstimate: React.FC<Props> = ({
           </CustomMenu>
         </div>
         {estimatePoints && estimatePoints.length > 0 ? (
-          <div className="flex gap-2 text-sm text-gray-400">
+          <div className="flex text-sm text-gray-400">
-            Estimate points(
+            Estimate points (
+            <span className="flex gap-1">
               {estimatePoints.map((point, index) => (
                 <h6 key={point.id}>
                   {point.value}
                   {index !== estimatePoints.length - 1 && ","}{" "}
                 </h6>
               ))}
+            </span>
             )
           </div>
         ) : (

apps/app/components/integration/github/import-users.tsx

@@ -1,7 +1,5 @@
 import { FC } from "react";
 
-import { useRouter } from "next/router";
-
 // react-hook-form
 import { UseFormWatch } from "react-hook-form";
 // ui
@@ -22,8 +20,6 @@ type Props = {
 };
 
 export const GithubImportUsers: FC<Props> = ({ handleStepChange, users, setUsers, watch }) => {
-  const router = useRouter();
-
   const isInvalid = users.filter((u) => u.import !== false && u.email === "").length > 0;
 
   return (
@@ -44,7 +40,6 @@ export const GithubImportUsers: FC<Props> = ({ handleStepChange, users, setUsers
               index={index}
               users={users}
               setUsers={setUsers}
-              project={watch("project")}
             />
           ))}
         </div>

apps/app/components/integration/github/single-user-select.tsx

@@ -4,21 +4,20 @@ import { useRouter } from "next/router";
 import useSWR from "swr";
 
 // services
-import projectService from "services/project.service";
+import workspaceService from "services/workspace.service";
 // ui
 import { Avatar, CustomSearchSelect, CustomSelect, Input } from "components/ui";
 // types
 import { IGithubRepoCollaborator } from "types";
 import { IUserDetails } from "./root";
 // fetch-keys
-import { PROJECT_MEMBERS } from "constants/fetch-keys";
+import { WORKSPACE_MEMBERS } from "constants/fetch-keys";
 
 type Props = {
   collaborator: IGithubRepoCollaborator;
   index: number;
   users: IUserDetails[];
   setUsers: React.Dispatch<React.SetStateAction<IUserDetails[]>>;
-  project: string | null;
 };
 
 const importOptions = [
@@ -36,21 +35,13 @@ const importOptions = [
   },
 ];
 
-export const SingleUserSelect: React.FC<Props> = ({
+export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users, setUsers }) => {
-  collaborator,
-  index,
-  users,
-  setUsers,
-  project,
-}) => {
   const router = useRouter();
   const { workspaceSlug } = router.query;
 
   const { data: members } = useSWR(
-    workspaceSlug && project ? PROJECT_MEMBERS(project) : null,
+    workspaceSlug ? WORKSPACE_MEMBERS(workspaceSlug.toString()) : null,
-    workspaceSlug && project
+    workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug.toString()) : null
-      ? () => projectService.projectMembers(workspaceSlug as string, project)
-      : null
   );
 
   const options =

apps/app/components/issues/activity.tsx

@@ -29,6 +29,7 @@ import { addSpaceIfCamelCase } from "helpers/string.helper";
 // types
 import { IIssueComment, IIssueLabels } from "types";
 import { PROJECT_ISSUES_ACTIVITY, PROJECT_ISSUE_LABELS } from "constants/fetch-keys";
+import useEstimateOption from "hooks/use-estimate-option";
 
 const activityDetails: {
   [key: string]: {
@@ -56,6 +57,10 @@ const activityDetails: {
     message: "set the cycle to",
     icon: <CyclesIcon height="12" width="12" color="#6b7280" />,
   },
+  estimate_point: {
+    message: "set the estimate point to",
+    icon: <PlayIcon className="h-3 w-3 text-gray-500 -rotate-90" aria-hidden="true" />,
+  },
   labels: {
     icon: <TagIcon height="12" width="12" color="#6b7280" />,
   },
@@ -107,6 +112,8 @@ export const IssueActivitySection: React.FC<Props> = () => {
   const router = useRouter();
   const { workspaceSlug, projectId, issueId } = router.query;
 
+  const { isEstimateActive, estimatePoints } = useEstimateOption();
+
   const { data: issueActivities, mutate: mutateIssueActivities } = useSWR(
     workspaceSlug && projectId && issueId ? PROJECT_ISSUES_ACTIVITY(issueId as string) : null,
     workspaceSlug && projectId && issueId
@@ -278,8 +285,14 @@ export const IssueActivitySection: React.FC<Props> = () => {
             value = "attachment";
           } else if (activityItem.field === "link") {
             value = "link";
-          } else if (activityItem.field === "estimate") {
+          } else if (activityItem.field === "estimate_point") {
-            value = "estimate";
+            value = activityItem.new_value
+              ? isEstimateActive
+                ? estimatePoints.find((e) => e.key === parseInt(activityItem.new_value ?? "", 10))
+                    ?.value
+                : activityItem.new_value +
+                  ` Point${parseInt(activityItem.new_value ?? "", 10) > 1 ? "s" : ""}`
+              : "None";
           }
 
           if ("field" in activityItem && activityItem.field !== "updated_by") {

apps/app/components/issues/form.tsx

@@ -46,9 +46,9 @@ const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor
 const defaultValues: Partial<IIssue> = {
   project: "",
   name: "",
-  description: "",
+  description: { type: "doc", content: [] },
   description_html: "<p></p>",
-  estimate_point: 0,
+  estimate_point: null,
   state: "",
   cycle: null,
   priority: null,
@@ -137,7 +137,7 @@ export const IssueForm: FC<IssueFormProps> = ({
     setValue("description_html", `${watch("description_html")}<p>${response}</p>`);
   };
 
-  const handelAutoGenerateDescription = async () => {
+  const handleAutoGenerateDescription = async () => {
     if (!workspaceSlug || !projectId) return;
 
     setIAmFeelingLucky(true);
@@ -301,7 +301,7 @@ export const IssueForm: FC<IssueFormProps> = ({
                       className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-gray-100 ${
                         iAmFeelingLucky ? "cursor-wait" : ""
                       }`}
-                      onClick={handelAutoGenerateDescription}
+                      onClick={handleAutoGenerateDescription}
                       disabled={iAmFeelingLucky}
                     >
                       {iAmFeelingLucky ? (

apps/app/components/issues/modal.tsx

@@ -29,6 +29,8 @@ import {
   PROJECT_ISSUES_LIST_WITH_PARAMS,
   CYCLE_ISSUES_WITH_PARAMS,
   MODULE_ISSUES_WITH_PARAMS,
+  CYCLE_DETAILS,
+  MODULE_DETAILS,
 } from "constants/fetch-keys";
 
 export interface IssuesModalProps {
@@ -101,7 +103,10 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
         issues: [issueId],
       })
       .then(() => {
+        if (cycleId) {
           mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId, params));
+          mutate(CYCLE_DETAILS(cycleId as string));
+        }
       });
   };
 
@@ -113,7 +118,10 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
         issues: [issueId],
       })
       .then(() => {
+        if (moduleId) {
           mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params));
+          mutate(MODULE_DETAILS(moduleId as string));
+        }
       });
   };
 

apps/app/components/issues/my-issues-list-item.tsx

@@ -5,6 +5,8 @@ import { useRouter } from "next/router";
 
 import { mutate } from "swr";
 
+// hooks
+import useToast from "hooks/use-toast";
 // services
 import issuesService from "services/issues.service";
 // components
@@ -13,16 +15,17 @@ import {
   ViewPrioritySelect,
   ViewStateSelect,
 } from "components/issues/view-select";
+// icon
+import { LinkIcon, PaperClipIcon } from "@heroicons/react/24/outline";
 // ui
 import { AssigneesList } from "components/ui/avatar";
 import { CustomMenu, Tooltip } from "components/ui";
 // types
 import { IIssue, Properties } from "types";
+// helper
+import { copyTextToClipboard, truncateText } from "helpers/string.helper";
 // fetch-keys
 import { USER_ISSUE } from "constants/fetch-keys";
-import { copyTextToClipboard, truncateText } from "helpers/string.helper";
-import useToast from "hooks/use-toast";
-import { LinkIcon } from "@heroicons/react/24/outline";
 
 type Props = {
   issue: IIssue;
@@ -79,8 +82,8 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
   const isNotAllowed = false;
 
   return (
-    <div className="border-b border-gray-300 last:border-b-0">
+    <div className="border-b border-gray-300 last:border-b-0 mx-6">
-      <div key={issue.id} className="flex items-center justify-between gap-2 px-4 py-3">
+      <div key={issue.id} className="flex items-center justify-between gap-2 py-3">
         <Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}>
           <a className="group relative flex items-center gap-2">
             {properties?.key && (
@@ -167,6 +170,26 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
               </div>
             </Tooltip>
           )}
+          {properties.link && (
+            <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+              <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
+                <div className="flex items-center gap-1 text-gray-500">
+                  <LinkIcon className="h-3.5 w-3.5 text-gray-500" />
+                  {issue.link_count}
+                </div>
+              </Tooltip>
+            </div>
+          )}
+          {properties.attachment_count && (
+            <div className="flex items-center rounded-md shadow-sm px-2.5 py-1 cursor-default text-xs border border-gray-200">
+              <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
+                <div className="flex items-center gap-1 text-gray-500">
+                  <PaperClipIcon className="h-3.5 w-3.5 text-gray-500 -rotate-45" />
+                  {issue.attachment_count}
+                </div>
+              </Tooltip>
+            </div>
+          )}
           <CustomMenu width="auto" ellipsis>
             <CustomMenu.MenuItem onClick={handleCopyText}>
               <span className="flex items-center justify-start gap-2">

apps/app/components/issues/select/estimate.tsx

@@ -8,8 +8,8 @@ import { PlayIcon } from "@heroicons/react/24/outline";
 import useEstimateOption from "hooks/use-estimate-option";
 
 type Props = {
-  value: number;
+  value: number | null;
-  onChange: (value: number) => void;
+  onChange: (value: number | null) => void;
 };
 
 export const IssueEstimateSelect: React.FC<Props> = ({ value, onChange }) => {
@@ -24,18 +24,26 @@ export const IssueEstimateSelect: React.FC<Props> = ({ value, onChange }) => {
         <div className="flex items-center gap-2 text-xs">
           <PlayIcon className="h-4 w-4 text-gray-500 -rotate-90" />
           <span className={`${value ? "text-gray-600" : "text-gray-500"}`}>
-            {estimatePoints?.find((e) => e.key === value)?.value ?? "Estimate points"}
+            {estimatePoints?.find((e) => e.key === value)?.value ?? "Estimate"}
           </span>
         </div>
       }
       onChange={onChange}
       position="right"
-      width="w-full min-w-[6rem]"
+      width="w-full min-w-[8rem]"
       noChevron
     >
+      <CustomSelect.Option value={null}>
+        <>
+          <span>
+            <PlayIcon className="h-4 w-4 -rotate-90" />
+          </span>
+          None
+        </>
+      </CustomSelect.Option>
       {estimatePoints &&
         estimatePoints.map((point) => (
-          <CustomSelect.Option className="w-full " key={point.key} value={point.key}>
+          <CustomSelect.Option key={point.key} value={point.key}>
             <>
               <span>
                 <PlayIcon className="h-4 w-4 -rotate-90" />

apps/app/components/issues/select/state.tsx

@@ -48,6 +48,7 @@ export const IssueStateSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
   }));
 
   const selectedOption = states?.find((s) => s.id === value);
+  const currentDefaultState = states.find((s) => s.default);
 
   return (
     <CustomSearchSelect
@@ -58,11 +59,12 @@ export const IssueStateSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
         <div className="flex items-center gap-2 text-gray-500">
           {selectedOption ? (
             getStateGroupIcon(selectedOption.group, "16", "16", selectedOption.color)
+          ) : currentDefaultState ? (
+            getStateGroupIcon(currentDefaultState.group, "16", "16", currentDefaultState.color)
           ) : (
             <Squares2X2Icon className="h-4 w-4" />
           )}
-
+          {selectedOption?.name ? selectedOption.name : currentDefaultState?.name ?? "State"}
-          {selectedOption?.name ?? "State"}
         </div>
       }
       footerOption={

apps/app/components/issues/sidebar-select/estimate.tsx

@@ -1,17 +1,17 @@
 import React from "react";
 
+// hooks
+import useEstimateOption from "hooks/use-estimate-option";
 // ui
 import { CustomSelect } from "components/ui";
 // icons
-import { BanknotesIcon, PlayIcon } from "@heroicons/react/24/outline";
+import { PlayIcon } from "@heroicons/react/24/outline";
 // types
 import { UserAuth } from "types";
-import useEstimateOption from "hooks/use-estimate-option";
-// constants
 
 type Props = {
-  value: number;
+  value: number | null;
-  onChange: (val: number) => void;
+  onChange: (val: number | null) => void;
   userAuth: UserAuth;
 };
 
@@ -35,7 +35,7 @@ export const SidebarEstimateSelect: React.FC<Props> = ({ value, onChange, userAu
             <div className="flex items-center gap-2 text-xs">
               <PlayIcon className="h-4 w-4 text-gray-700 -rotate-90" />
               <span className={`${value ? "text-gray-600" : "text-gray-500"}`}>
-                {estimatePoints?.find((e) => e.key === value)?.value ?? "Estimate points"}
+                {estimatePoints?.find((e) => e.key === value)?.value ?? "Estimate"}
               </span>
             </div>
           }
@@ -44,9 +44,17 @@ export const SidebarEstimateSelect: React.FC<Props> = ({ value, onChange, userAu
           width="w-full"
           disabled={isNotAllowed}
         >
+          <CustomSelect.Option value={null}>
+            <>
+              <span>
+                <PlayIcon className="h-4 w-4 -rotate-90" />
+              </span>
+              None
+            </>
+          </CustomSelect.Option>
           {estimatePoints &&
             estimatePoints.map((point) => (
-              <CustomSelect.Option className="w-full " key={point.key} value={point.key}>
+              <CustomSelect.Option key={point.key} value={point.key}>
                 <>
                   <span>
                     <PlayIcon className="h-4 w-4 -rotate-90" />

apps/app/components/issues/sidebar.tsx

@@ -294,7 +294,7 @@ export const IssueDetailsSidebar: React.FC<Props> = ({
               render={({ field: { value } }) => (
                 <SidebarEstimateSelect
                   value={value}
-                  onChange={(val: number) => submitChanges({ estimate_point: val })}
+                  onChange={(val: number | null) => submitChanges({ estimate_point: val })}
                   userAuth={memberRole}
                 />
               )}

apps/app/components/issues/view-select/assignee.tsx

@@ -75,8 +75,8 @@ export const ViewAssigneeSelect: React.FC<Props> = ({
 
         trackEventServices.trackIssuePartialPropertyUpdateEvent(
           {
-            workspaceSlug: issue.workspace_detail.slug,
+            workspaceSlug,
-            workspaceId: issue.workspace_detail.id,
+            workspaceId: issue.workspace,
             projectId: issue.project_detail.id,
             projectIdentifier: issue.project_detail.identifier,
             projectName: issue.project_detail.name,

apps/app/components/issues/view-select/due-date.tsx

@@ -1,3 +1,5 @@
+import { useRouter } from "next/router";
+
 // ui
 import { CustomDatePicker, Tooltip } from "components/ui";
 // helpers
@@ -13,7 +15,11 @@ type Props = {
   isNotAllowed: boolean;
 };
 
-export const ViewDueDateSelect: React.FC<Props> = ({ issue, partialUpdateIssue, isNotAllowed }) => (
+export const ViewDueDateSelect: React.FC<Props> = ({ issue, partialUpdateIssue, isNotAllowed }) => {
+  const router = useRouter();
+  const { workspaceSlug } = router.query;
+
+  return (
     <Tooltip tooltipHeading="Due Date" tooltipContent={issue.target_date ?? "N/A"}>
       <div
         className={`group relative ${
@@ -35,8 +41,8 @@ export const ViewDueDateSelect: React.FC<Props> = ({ issue, partialUpdateIssue,
             });
             trackEventServices.trackIssuePartialPropertyUpdateEvent(
               {
-              workspaceSlug: issue.workspace_detail.slug,
+                workspaceSlug,
-              workspaceId: issue.workspace_detail.id,
+                workspaceId: issue.workspace,
                 projectId: issue.project_detail.id,
                 projectIdentifier: issue.project_detail.identifier,
                 projectName: issue.project_detail.name,
@@ -50,4 +56,5 @@ export const ViewDueDateSelect: React.FC<Props> = ({ issue, partialUpdateIssue,
         />
       </div>
     </Tooltip>
-);
+  );
+};

apps/app/components/issues/view-select/estimate.tsx

@@ -1,17 +1,17 @@
 import React from "react";
 
+import { useRouter } from "next/router";
+
+// services
+import trackEventServices from "services/track-event.service";
+// hooks
+import useEstimateOption from "hooks/use-estimate-option";
 // ui
 import { CustomSelect, Tooltip } from "components/ui";
 // icons
-import { getPriorityIcon } from "components/icons/priority-icon";
+import { PlayIcon } from "@heroicons/react/24/outline";
 // types
 import { IIssue } from "types";
-// constants
-import { PRIORITIES } from "constants/project";
-// services
-import trackEventServices from "services/track-event.service";
-import useEstimateOption from "hooks/use-estimate-option";
-import { PlayIcon } from "@heroicons/react/24/outline";
 
 type Props = {
   issue: IIssue;
@@ -28,6 +28,9 @@ export const ViewEstimateSelect: React.FC<Props> = ({
   selfPositioned = false,
   isNotAllowed,
 }) => {
+  const router = useRouter();
+  const { workspaceSlug } = router.query;
+
   const { isEstimateActive, estimatePoints } = useEstimateOption(issue.estimate_point);
 
   const estimateValue = estimatePoints?.find((e) => e.key === issue.estimate_point)?.value;
@@ -41,8 +44,8 @@ export const ViewEstimateSelect: React.FC<Props> = ({
         partialUpdateIssue({ estimate_point: val });
         trackEventServices.trackIssuePartialPropertyUpdateEvent(
           {
-            workspaceSlug: issue.workspace_detail.slug,
+            workspaceSlug,
-            workspaceId: issue.workspace_detail.id,
+            workspaceId: issue.workspace,
             projectId: issue.project_detail.id,
             projectIdentifier: issue.project_detail.identifier,
             projectName: issue.project_detail.name,
@@ -55,7 +58,7 @@ export const ViewEstimateSelect: React.FC<Props> = ({
         <Tooltip tooltipHeading="Estimate" tooltipContent={estimateValue}>
           <div className="flex items-center gap-1 text-gray-500">
             <PlayIcon className="h-3.5 w-3.5 -rotate-90" />
-            {estimateValue}
+            {estimateValue ?? "Estimate"}
           </div>
         </Tooltip>
       }
@@ -64,11 +67,24 @@ export const ViewEstimateSelect: React.FC<Props> = ({
       disabled={isNotAllowed}
       position={position}
       selfPositioned={selfPositioned}
-      width="w-full min-w-[6rem]"
+      width="w-full min-w-[8rem]"
     >
+      <CustomSelect.Option value={null}>
+        <>
+          <span>
+            <PlayIcon className="h-4 w-4 -rotate-90" />
+          </span>
+          None
+        </>
+      </CustomSelect.Option>
       {estimatePoints?.map((estimate) => (
-        <CustomSelect.Option key={estimate.id} value={estimate.key} className="capitalize">
+        <CustomSelect.Option key={estimate.id} value={estimate.key}>
-          <>{estimate.value}</>
+          <>
+            <span>
+              <PlayIcon className="h-4 w-4 -rotate-90" />
+            </span>
+            {estimate.value}
+          </>
         </CustomSelect.Option>
       ))}
     </CustomSelect>

apps/app/components/issues/view-select/priority.tsx

@@ -1,5 +1,7 @@
 import React from "react";
 
+import { useRouter } from "next/router";
+
 // ui
 import { CustomSelect, Tooltip } from "components/ui";
 // icons
@@ -25,15 +27,19 @@ export const ViewPrioritySelect: React.FC<Props> = ({
   position = "left",
   selfPositioned = false,
   isNotAllowed,
-}) => (
+}) => {
+  const router = useRouter();
+  const { workspaceSlug } = router.query;
+
+  return (
     <CustomSelect
       value={issue.priority}
       onChange={(data: string) => {
         partialUpdateIssue({ priority: data });
         trackEventServices.trackIssuePartialPropertyUpdateEvent(
           {
-          workspaceSlug: issue.workspace_detail.slug,
+            workspaceSlug,
-          workspaceId: issue.workspace_detail.id,
+            workspaceId: issue.workspace,
             projectId: issue.project_detail.id,
             projectIdentifier: issue.project_detail.identifier,
             projectName: issue.project_detail.name,
@@ -84,4 +90,5 @@ export const ViewPrioritySelect: React.FC<Props> = ({
         </CustomSelect.Option>
       ))}
     </CustomSelect>
-);
+  );
+};

apps/app/components/issues/view-select/state.tsx

@@ -67,8 +67,8 @@ export const ViewStateSelect: React.FC<Props> = ({
         });
         trackEventServices.trackIssuePartialPropertyUpdateEvent(
           {
-            workspaceSlug: issue.workspace_detail.slug,
+            workspaceSlug,
-            workspaceId: issue.workspace_detail.id,
+            workspaceId: issue.workspace,
             projectId: issue.project_detail.id,
             projectIdentifier: issue.project_detail.identifier,
             projectName: issue.project_detail.name,

apps/app/components/pages/create-update-block-inline.tsx

@@ -32,7 +32,8 @@ type Props = {
 
 const defaultValues = {
   name: "",
-  description: "<p></p>",
+  description: { type: "doc", content: [] },
+  description_html: "<p></p>",
 };
 
 const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
@@ -167,7 +168,7 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
           });
         else {
           setValue("description", {});
-          setValue("description_html", `${watch("description_html")}<p>${res.response}</p>`);
+          setValue("description_html", `${watch("description_html") ?? ""}<p>${res.response}</p>`);
         }
       })
       .catch((err) => {

apps/app/components/rich-text-editor/index.tsx

@@ -199,7 +199,9 @@ const RemirrorRichTextEditor: FC<IRemirrorRichTextEditor> = (props) => {
           onBlur(jsonValue, htmlValue);
         }}
       >
-        {(!value || value === "" || value?.content?.[0]?.content === undefined) && placeholder && (
+        {(!value || value === "" || value?.content?.[0]?.content === undefined) &&
+          !(typeof value === "string" && value.includes("<")) &&
+          placeholder && (
             <p className="absolute pointer-events-none top-4 left-4 text-gray-300">{placeholder}</p>
           )}
         <EditorComponent />

apps/app/components/views/form.tsx

@@ -1,6 +1,5 @@
 import { useEffect } from "react";
 
-
 import { useForm } from "react-hook-form";
 // ui
 import { Input, PrimaryButton, SecondaryButton, TextArea } from "components/ui";
@@ -16,6 +15,7 @@ type Props = {
   handleClose: () => void;
   status: boolean;
   data?: IView | null;
+  preLoadedData?: Partial<IView> | null;
 };
 
 const defaultValues: Partial<IView> = {
@@ -23,7 +23,13 @@ const defaultValues: Partial<IView> = {
   description: "",
 };
 
-export const ViewForm: React.FC<Props> = ({ handleFormSubmit, handleClose, status, data }) => {
+export const ViewForm: React.FC<Props> = ({
+  handleFormSubmit,
+  handleClose,
+  status,
+  data,
+  preLoadedData,
+}) => {
   const {
     register,
     formState: { errors, isSubmitting },
@@ -47,9 +53,10 @@ export const ViewForm: React.FC<Props> = ({ handleFormSubmit, handleClose, statu
   useEffect(() => {
     reset({
       ...defaultValues,
+      ...preLoadedData,
       ...data,
     });
-  }, [data, reset]);
+  }, [data, preLoadedData, reset]);
 
   useEffect(() => {
     if (status && data) {

apps/app/components/views/modal.tsx

@@ -21,9 +21,10 @@ type Props = {
   isOpen: boolean;
   handleClose: () => void;
   data?: IView | null;
+  preLoadedData?: Partial<IView> | null ;
 };
 
-export const CreateUpdateViewModal: React.FC<Props> = ({ isOpen, handleClose, data }) => {
+export const CreateUpdateViewModal: React.FC<Props> = ({ isOpen, handleClose, data, preLoadedData }) => {
   const router = useRouter();
   const { workspaceSlug, projectId } = router.query;
 
@@ -133,6 +134,7 @@ export const CreateUpdateViewModal: React.FC<Props> = ({ isOpen, handleClose, da
                   handleClose={handleClose}
                   status={data ? true : false}
                   data={data}
+                  preLoadedData={preLoadedData}
                 />
               </Dialog.Panel>
             </Transition.Child>

apps/app/contexts/issue-view.context.tsx

@@ -439,12 +439,11 @@ export const IssueViewContextProvider: React.FC<{ children: React.ReactNode }> =
       payload: {
         ...myViewProps?.view_props,
         filters: {
-          ...myViewProps?.view_props?.filters,
+          ...(viewId ? viewDetails?.query_data : myViewProps?.view_props?.filters),
-          ...viewDetails?.query_data,
         } as any,
       },
     });
-  }, [myViewProps, viewDetails]);
+  }, [myViewProps, viewDetails, viewId]);
 
   return (
     <issueViewContext.Provider

apps/app/hooks/use-estimate-option.tsx

@@ -13,7 +13,7 @@ import { orderArrayBy } from "helpers/array.helper";
 // fetch-keys
 import { ESTIMATE_POINTS_LIST } from "constants/fetch-keys";
 
-const useEstimateOption = (estimateKey?: number) => {
+const useEstimateOption = (estimateKey?: number | null) => {
   const router = useRouter();
   const { workspaceSlug, projectId } = router.query;
 

apps/app/hooks/use-local-storage.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback } from "react";
 
 const getValueFromLocalStorage = (key: string, defaultValue: any) => {
+  if (typeof window === undefined || typeof window === "undefined") return defaultValue;
   try {
     const item = window.localStorage.getItem(key);
     return item ? JSON.parse(item) : defaultValue;

apps/app/pages/[workspaceSlug]/index.tsx

@@ -46,7 +46,7 @@ const WorkspacePage: NextPage = () => {
             // style={{ background: "linear-gradient(90deg, #8e2de2 0%, #4a00e0 100%)" }}
           >
             <p className="font-semibold">
-              Plane is a open source application, to support us you can star us on GitHub!
+              Plane is open source, support us by staring us on GitHub.
             </p>
             <div className="flex items-center gap-2">
               {/* <a href="#" target="_blank" rel="noopener noreferrer">

apps/app/pages/[workspaceSlug]/me/my-issues.tsx

@@ -43,6 +43,7 @@ const MyIssuesPage: NextPage = () => {
           <BreadcrumbItem title="My Issues" />
         </Breadcrumbs>
       }
+      noPadding
       right={
         <div className="flex items-center gap-2">
           {myIssues && myIssues.length > 0 && (
@@ -72,7 +73,10 @@ const MyIssuesPage: NextPage = () => {
                         <div className="relative flex flex-col gap-1">
                           <h4 className="text-base text-gray-600">Properties</h4>
                           <div className="flex flex-wrap items-center gap-2">
-                            {Object.keys(properties).map((key) => (
+                            {Object.keys(properties).map((key) => {
+                              if (key === "estimate") return null;
+
+                              return (
                                 <button
                                   key={key}
                                   type="button"
@@ -85,7 +89,8 @@ const MyIssuesPage: NextPage = () => {
                                 >
                                   {key === "key" ? "ID" : replaceUnderscoreIfSnakeCase(key)}
                                 </button>
-                            ))}
+                              );
+                            })}
                           </div>
                         </div>
                       </div>
@@ -115,10 +120,10 @@ const MyIssuesPage: NextPage = () => {
               <div className="flex flex-col space-y-5">
                 <Disclosure as="div" defaultOpen>
                   {({ open }) => (
-                    <div className="rounded-[10px] border border-gray-300 bg-white">
+                    <div className="bg-white">
                       <div
                         className={`flex items-center justify-start bg-gray-100 px-5 py-3 ${
-                          open ? "rounded-t-[10px]" : "rounded-[10px]"
+                          open ? "" : "rounded-[10px]"
                         }`}
                       >
                         <Disclosure.Button>

apps/app/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx

@@ -34,6 +34,7 @@ const defaultValues = {
   name: "",
   description: "",
   description_html: "",
+  estimate_point: null,
   state: "",
   assignees_list: [],
   priority: "low",

apps/app/pages/[workspaceSlug]/projects/[projectId]/pages/index.tsx

@@ -14,6 +14,7 @@ import projectService from "services/project.service";
 import pagesService from "services/pages.service";
 // hooks
 import useToast from "hooks/use-toast";
+import useLocalStorage from "hooks/use-local-storage";
 // icons
 import { PlusIcon } from "components/icons";
 // layouts
@@ -74,6 +75,8 @@ const ProjectPages: NextPage = () => {
 
   const { setToastAlert } = useToast();
 
+  const { storedValue: pageTab, setValue: setPageTab } = useLocalStorage("pageTab", "Recent");
+
   const {
     handleSubmit,
     register,
@@ -145,6 +148,25 @@ const ProjectPages: NextPage = () => {
       });
   };
 
+
+  const currentTabValue = (tab: string | null) => {
+    switch (tab) {
+      case "Recent":
+        return 0;
+      case "All":
+        return 1;
+      case "Favorites":
+        return 2;
+      case "Created by me":
+        return 3;
+      case "Created by others":
+        return 4;
+
+      default:
+        return 0;
+    }
+  };
+
   return (
     <>
       <CreateUpdatePageModal
@@ -193,7 +215,26 @@ const ProjectPages: NextPage = () => {
             )}
           </form>
           <div>
-            <Tab.Group>
+            <Tab.Group
+              defaultIndex={currentTabValue(pageTab)}
+              onChange={(i) => {
+                switch (i) {
+                  case 0:
+                    return setPageTab("Recent");
+                  case 1:
+                    return setPageTab("All");
+                  case 2:
+                    return setPageTab("Favorites");
+                  case 3:
+                    return setPageTab("Created by me");
+                  case 4:
+                    return setPageTab("Created by others");
+
+                  default:
+                    return setPageTab("Recent");
+                }
+              }}
+            >
               <Tab.List as="div" className="flex items-center justify-between mb-6">
                 <div className="flex gap-4">
                   {["Recent", "All", "Favorites", "Created by me", "Created by others"].map(

apps/app/types/issues.d.ts

@@ -87,7 +87,7 @@ export interface IIssue {
   description: any;
   description_html: any;
   description_stripped: any;
-  estimate_point: number;
+  estimate_point: number | null;
   id: string;
   issue_cycle: IIssueCycle | null;
   issue_link: {