Merge pull request #3117 from makeplane/chore/issue_related_bug_and_improvement

chore: issue details related bug fixes and improvement

web/components/inbox/main-content.tsx

@@ -225,7 +225,7 @@ export const InboxMainContent: React.FC = observer(() => {
                 </>
               ) : null}
             </div>
-            <div className="mb-5 flex items-center">
+            <div className="mb-2.5 flex items-center">
               {currentIssueState && (
                 <StateGroupIcon
                   className="mr-3 h-4 w-4"

web/components/issues/description-form.tsx

@@ -135,7 +135,7 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
                   debouncedFormSave();
                 }}
                 required
-                className="min-h-10 block w-full resize-none overflow-hidden rounded border-none bg-transparent px-3 py-2 text-xl outline-none ring-0 focus:ring-1 focus:ring-custom-primary"
+                className="min-h-min block w-full resize-none overflow-hidden rounded border-none bg-transparent px-3 py-2 text-2xl font-medium outline-none ring-0 focus:ring-1 focus:ring-custom-primary"
                 hasError={Boolean(errors?.description)}
                 role="textbox"
                 disabled={!isAllowed}

web/components/issues/issue-layouts/properties/assignee.tsx

@@ -100,7 +100,7 @@ export const IssuePropertyAssignee: React.FC<IIssuePropertyAssignee> = observer(
 
   const label = (
     <Tooltip tooltipHeading="Assignee" tooltipContent={getTooltipContent()} position="top">
-      <div className="flex h-full w-full cursor-pointer items-center gap-2 text-custom-text-200">
+      <div className="flex h-full w-full items-center gap-2 text-custom-text-200">
         {value && value.length > 0 && Array.isArray(value) ? (
           <AvatarGroup showTooltip={false}>
             {value.map((assigneeId) => {

web/components/issues/main-content.tsx

@@ -216,7 +216,7 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
             </CustomMenu>
           </div>
         ) : null}
-        <div className="mb-5 flex items-center">
+        <div className="mb-2.5 flex items-center">
           {currentIssueState && (
             <StateGroupIcon
               className="mr-3 h-4 w-4"

web/components/issues/sidebar-select/parent.tsx

@@ -4,6 +4,8 @@ import { useRouter } from "next/router";
 
 // components
 import { ParentIssuesListModal } from "components/issues";
+// icons
+import { X } from "lucide-react";
 // types
 import { IIssue, ISearchIssueResponse } from "types";
 
@@ -32,12 +34,20 @@ export const SidebarParentSelect: React.FC<Props> = ({ onChange, issueDetails, d
         issueId={issueId as string}
         projectId={projectId as string}
       />
+
       <button
         type="button"
-        className={`rounded bg-custom-background-80 px-2.5 py-0.5 text-xs ${
+        className={`flex items-center gap-2 rounded bg-custom-background-80 px-2.5 py-0.5 text-xs max-w-max" ${
           disabled ? "cursor-not-allowed" : "cursor-pointer "
         }`}
-        onClick={() => setIsParentModalOpen(true)}
+        onClick={() => {
+          if (issueDetails?.parent) {
+            onChange("");
+            setSelectedParentIssue(null);
+          } else {
+            setIsParentModalOpen(true);
+          }
+        }}
         disabled={disabled}
       >
         {selectedParentIssue && issueDetails?.parent ? (
@@ -47,6 +57,7 @@ export const SidebarParentSelect: React.FC<Props> = ({ onChange, issueDetails, d
         ) : (
           <span className="text-custom-text-200">Select issue</span>
         )}
+        {issueDetails?.parent && <X className="h-2.5 w-2.5" />}
       </button>
     </>
   );

web/components/issues/sub-issues/properties.tsx

@@ -78,7 +78,7 @@ export const IssueProperty: React.FC<IIssueProperty> = (props) => {
           projectId={issue?.project_detail?.id || null}
           value={issue?.state || null}
           onChange={(data) => handleStateChange(data)}
-          disabled={false}
+          disabled={!editable}
           hideDropdownArrow
         />
       </div>
@@ -89,7 +89,7 @@ export const IssueProperty: React.FC<IIssueProperty> = (props) => {
           value={issue?.assignees || null}
           hideDropdownArrow
           onChange={(val) => handleAssigneeChange(val)}
-          disabled={false}
+          disabled={!editable}
         />
       </div>
     </div>