Fix: UI bugs

frontend/src/icons/duplicate-line-2.tsx

@@ -12,19 +12,11 @@ export function DuplicateLine2({ size = 18, className, color }: IconProps) {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <rect
-        x="2"
-        y="6"
-        width="12"
-        height="12"
-        rx="2.11"
-        stroke={color ? color : 'currentColor'}
-        strokeWidth="2"
-      />
       <path
-        d="M5 6.64286V5.11C5 3.39239 6.39239 2 8.11 2H14.89C16.6076 2 18 3.39239 18 5.11V11.89C18 13.6076 16.6076 15 14.89 15H13.3571"
-        stroke={color ? color : 'currentColor'}
-        strokeWidth="2"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M7.03828 1.9978H7.96174C8.69088 1.99779 9.28354 1.99779 9.76444 2.03708C10.2611 2.07765 10.7041 2.16384 11.1163 2.37383C11.7654 2.70459 12.2932 3.23237 12.624 3.88153C12.834 4.29366 12.9202 4.73675 12.9607 5.23336C12.9993 5.70582 13 6.28616 13 6.9978C13.7117 6.99781 14.292 6.99848 14.7644 7.03708C15.2611 7.07765 15.7041 7.16384 16.1163 7.37383C16.7654 7.70459 17.2932 8.23237 17.624 8.88153C17.834 9.29366 17.9202 9.73675 17.9607 10.2334C18 10.7143 18 11.3069 18 12.0361L18 12.9638C18 13.6929 18 14.2856 17.9608 14.7665C17.9202 15.2631 17.834 15.7062 17.624 16.1183C17.2932 16.7675 16.7655 17.2953 16.1163 17.626C15.7042 17.836 15.2611 17.9222 14.7645 17.9628C14.2836 18.0021 13.6909 18.0021 12.9618 18.0021H12.0383C11.3092 18.0021 10.7165 18.0021 10.2356 17.9628C9.73896 17.9222 9.29587 17.836 8.88373 17.626C8.23457 17.2953 7.70679 16.7675 7.37603 16.1183C7.16604 15.7062 7.07985 15.2631 7.03928 14.7665C7.00068 14.294 7 13.7137 7 13.0021C6.28836 13.0021 5.70803 13.0014 5.23557 12.9628C4.73896 12.9222 4.29587 12.836 3.88373 12.626C3.23457 12.2953 2.70679 11.7675 2.37603 11.1183C2.16604 10.7062 2.07985 10.2631 2.03928 9.7665C1.99999 9.2856 1.99999 8.69293 2 7.96379V7.03608C1.99999 6.30694 1.99999 5.71428 2.03928 5.23337C2.07985 4.73676 2.16604 4.29367 2.37603 3.88154C2.70679 3.23238 3.23457 2.70459 3.88373 2.37383C4.29587 2.16384 4.73896 2.07765 5.23557 2.03708C5.71647 1.99779 6.30914 1.99779 7.03828 1.9978ZM7.00066 11.5021C7.00257 11.0106 7.01005 10.5911 7.03928 10.2334C7.07985 9.73676 7.16604 9.29367 7.37603 8.88154C7.70679 8.23238 8.23457 7.70459 8.88373 7.37383C9.29587 7.16384 9.73896 7.07765 10.2356 7.03708C10.5922 7.00794 11.0103 7.00042 11.5 6.99848C11.5 6.26721 11.4984 5.7556 11.4657 5.35551C11.4327 4.95167 11.3718 4.72795 11.2875 4.56252C11.1005 4.1956 10.8022 3.89729 10.4353 3.71034C10.2699 3.62605 10.0461 3.56509 9.6423 3.5321C9.22969 3.49839 8.69846 3.4978 7.93002 3.4978H7.07C6.30155 3.4978 5.77033 3.49839 5.35772 3.5321C4.95387 3.56509 4.73015 3.62605 4.56472 3.71034C4.1978 3.89729 3.89949 4.19561 3.71254 4.56252C3.62825 4.72795 3.56729 4.95167 3.53429 5.35552C3.50058 5.76813 3.5 6.29936 3.5 7.0678V7.93207C3.5 8.70052 3.50058 9.23175 3.53429 9.64435C3.56729 10.0482 3.62825 10.2719 3.71254 10.4374C3.89949 10.8043 4.1978 11.1026 4.56472 11.2895C4.73015 11.3738 4.95387 11.4348 5.35772 11.4678C5.7578 11.5005 6.2694 11.502 7.00066 11.5021ZM10.3577 8.5321C9.95387 8.56509 9.73015 8.62605 9.56472 8.71034C9.1978 8.89729 8.89949 9.19561 8.71254 9.56252C8.62825 9.72795 8.56729 9.95167 8.5343 10.3555C8.50058 10.7681 8.5 11.2994 8.5 12.0678V12.9321C8.5 13.7005 8.50058 14.2317 8.5343 14.6444C8.56729 15.0482 8.62825 15.2719 8.71254 15.4374C8.89949 15.8043 9.1978 16.1026 9.56472 16.2895C9.73015 16.3738 9.95387 16.4348 10.3577 16.4678C10.7703 16.5015 11.3016 16.5021 12.07 16.5021H12.93C13.6985 16.5021 14.2297 16.5015 14.6423 16.4678C15.0462 16.4348 15.2699 16.3738 15.4353 16.2895C15.8022 16.1026 16.1005 15.8043 16.2875 15.4373C16.3718 15.2719 16.4327 15.0482 16.4657 14.6443C16.4994 14.2317 16.5 13.7005 16.5 12.9321L16.5 12.0678C16.5 11.2993 16.4994 10.7681 16.4657 10.3555C16.4327 9.95167 16.3718 9.72795 16.2875 9.56252C16.1005 9.1956 15.8022 8.89729 15.4353 8.71034C15.2699 8.62605 15.0461 8.56509 14.6423 8.5321C14.2297 8.49839 13.6985 8.4978 12.93 8.4978H12.07C11.3016 8.4978 10.7703 8.49839 10.3577 8.5321Z"
+        fill={color ? color : 'currentColor'}
       />
     </svg>
   );

frontend/src/modules/issues/components/modals/modal-issue-item.tsx

@@ -28,7 +28,7 @@ export const ModalIssueItem = observer(({ issue }: ModalIssueItemProps) => {
         color={getWorkflowColor(workflow).color}
       />
       <div className="mr-3 font-mono min-w-[50px]">{`${team.identifier}-${issue.number}`}</div>
-      <div className="max-w-[300px]">
+      <div className="max-w-[500px]">
         <div className="truncate"> {issue.title}</div>
       </div>
     </div>

frontend/src/modules/issues/filters-view/filter-dropdowns/issue-label-filter.tsx

@@ -30,7 +30,7 @@ export const IssueLabelFilter = observer(
       : [];
 
     const change = (value: string[]) => {
-      onChange(value, FilterTypeEnum.INCLUDES_ANY);
+      onChange(value, FilterTypeEnum.INCLUDES);
     };
 
     return (

frontend/src/modules/issues/filters-view/filter-options-dropdown.tsx

@@ -12,10 +12,8 @@ import { FilterTypeEnum } from 'store/application';
 const FilterToName = {
   [FilterTypeEnum.IS]: 'is any of',
   [FilterTypeEnum.IS_NOT]: 'is not',
-  [FilterTypeEnum.INCLUDES]: 'includes all of',
-  [FilterTypeEnum.INCLUDES_ANY]: 'includes any of',
-  [FilterTypeEnum.EXCLUDES]: 'excludes all of',
-  [FilterTypeEnum.EXCLUDES_ANY]: 'excludes any of',
+  [FilterTypeEnum.INCLUDES]: 'includes',
+  [FilterTypeEnum.EXCLUDES]: 'excludes',
   [FilterTypeEnum.UNDEFINED]: 'undefined',
 };
 
@@ -33,12 +31,7 @@ export function FilterOptionsDropdown({
   isArray,
 }: FilterOptionsDropdownProps) {
   const options = isArray
-    ? [
-        FilterTypeEnum.INCLUDES,
-        FilterTypeEnum.INCLUDES_ANY,
-        FilterTypeEnum.EXCLUDES,
-        FilterTypeEnum.EXCLUDES_ANY,
-      ]
+    ? [FilterTypeEnum.INCLUDES, FilterTypeEnum.EXCLUDES]
     : [FilterTypeEnum.IS, FilterTypeEnum.IS_NOT];
 
   return (

frontend/src/modules/issues/filters-view/filters.tsx

@@ -119,7 +119,7 @@ export const Filters = observer(({ onClose }: FiltersProps) => {
 
   return (
     <div className="flex justify-between items-start border border-border p-1 rounded-md w-full">
-      <div className="flex gap-2 flex-wrap items-center h-full">
+      <div className="flex gap-2 flex-wrap items-center h-full grow">
         <AppliedFiltersView />
         {isLoading && (
           <div className="flex gap-2 items-center">
@@ -129,7 +129,7 @@ export const Filters = observer(({ onClose }: FiltersProps) => {
         )}
         {!isLoading && (
           <Command
-            className="border-none shadow-none relative overflow-visible w-fit h-fit"
+            className="border-none shadow-none relative overflow-visible h-fit w-auto"
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
             onBlur={(e) => {
               if (e.target.localName === 'button' && e.relatedTarget === null) {
@@ -142,7 +142,7 @@ export const Filters = observer(({ onClose }: FiltersProps) => {
               placeholder="Type for filters..."
               value={value}
               onValueChange={setValue}
-              containerClassName="border-0 rounded-md min-w-[300px] pl-0 py-1 bg-background-2"
+              containerClassName="border-0 rounded-md min-w-[400px] pl-0 py-1 bg-background-2"
               className="py-2 h-4 pl-1"
               autoFocus={isEmpty(filters)}
               ref={inputRef}

frontend/src/modules/issues/issues-utils.tsx

@@ -44,12 +44,8 @@ export function filterIssue(issue: IssueType, filter: FilterType) {
     case FilterTypeEnum.IS_NOT:
       return !castedValue.includes(fieldValue);
     case FilterTypeEnum.INCLUDES:
-      return fieldValue.includes(castedValue);
-    case FilterTypeEnum.INCLUDES_ANY:
       return castedValue.some((value) => fieldValue.includes(value));
     case FilterTypeEnum.EXCLUDES:
-      return !fieldValue.includes(castedValue);
-    case FilterTypeEnum.EXCLUDES_ANY:
       return !castedValue.some((value) => fieldValue.includes(value));
     case FilterTypeEnum.UNDEFINED:
       return fieldValue === null || fieldValue === undefined;

frontend/src/modules/issues/single-issue/left-side/activity/summary.tsx

@@ -34,7 +34,7 @@ export function IssueSummary({ onClose }: IssueSummaryProps) {
 
   return (
     <div className="bg-grayAlpha-100 p-3 pt-1 mt-2 rounded relative">
-      <ul className="ml-6 list-disc [&>li]:mt-2">
+      <ul className="ml-6 list-disc mt-2">
         {summary.map((text: string, index: number) => (
           <li key={index}>{text}</li>
         ))}

frontend/src/modules/issues/single-issue/left-side/similar-issues-view.tsx

@@ -1,6 +1,5 @@
 /** Copyright (c) 2024, Tegon, all rights reserved. **/
 
-import { RiArrowDownSFill, RiArrowRightSFill } from '@remixicon/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
@@ -16,7 +15,7 @@ import {
   CollapsibleTrigger,
 } from 'components/ui/collapsible';
 import { useCurrentWorkspace } from 'hooks/workspace';
-import { DuplicateLine2 } from 'icons';
+import { ChevronDown, ChevronRight, DuplicateLine2 } from 'icons';
 
 import { useGetSimilarIssuesQuery } from 'services/search';
 
@@ -44,7 +43,7 @@ export function SimilarIssuesView({ issueId }: SimilarIssuesViewProps) {
 
   return (
     <div
-      className={cn('rounded-md border p-2 mb-2 mx-6 bg-grayAlpha-100')}
+      className={cn('rounded-md p-2 mb-2 mx-6 bg-grayAlpha-100')}
       onClick={(e) => {
         e.stopPropagation();
       }}
@@ -58,13 +57,13 @@ export function SimilarIssuesView({ issueId }: SimilarIssuesViewProps) {
                 size="sm"
                 className="px-2 pr-2 !bg-transparent"
               >
+                <DuplicateLine2 size={16} className="mr-2" />
+                Similar Issues
                 {isOpen ? (
-                  <RiArrowDownSFill size={16} className="mr-2" />
+                  <ChevronDown size={16} className="mr-2" />
                 ) : (
-                  <RiArrowRightSFill size={16} className="mr-2" />
+                  <ChevronRight size={16} className="mr-2" />
                 )}
-                <DuplicateLine2 size={16} className="mr-2" />
-                Similar Issues
               </Button>
             </div>
           </CollapsibleTrigger>

frontend/src/modules/issues/triage/left-side/triage-category.tsx

@@ -53,6 +53,7 @@ export const TriageCategory = observer(
         <div className="flex gap-1 items-center">
           <CollapsibleTrigger asChild>
             <Button
+              size="lg"
               className="flex group items-center ml-6 w-fit rounded-2xl bg-grayAlpha-100 px-2"
               variant="ghost"
             >

frontend/src/modules/issues/triage/left-side/triage-other-category.tsx

@@ -47,6 +47,7 @@ export const TriageOtherCategory = observer(
           <div className="flex gap-1 items-center">
             <CollapsibleTrigger asChild>
               <Button
+                size="lg"
                 className="flex group items-center ml-6 w-fit rounded-2xl bg-grayAlpha-100 px-2"
                 variant="ghost"
               >

frontend/src/store/application/models.ts

@@ -4,25 +4,11 @@ import { types } from 'mobx-state-tree';
 
 export const FilterModel = types.model({
   value: types.union(types.array(types.string), types.array(types.number)),
-  filterType: types.enumeration([
-    'IS',
-    'IS_NOT',
-    'INCLUDES',
-    'INCLUDES_ANY',
-    'EXCLUDES',
-    'EXCLUDES_ANY',
-  ]),
+  filterType: types.enumeration(['IS', 'IS_NOT', 'INCLUDES', 'EXCLUDES']),
 });
 
 export const FilterBooleanModel = types.model({
-  filterType: types.enumeration([
-    'IS',
-    'IS_NOT',
-    'INCLUDES',
-    'INCLUDES_ANY',
-    'EXCLUDES',
-    'EXCLUDES_ANY',
-  ]),
+  filterType: types.enumeration(['IS', 'IS_NOT', 'INCLUDES', 'EXCLUDES']),
 });
 
 export const FiltersModel = types.model({

frontend/src/store/application/types.ts

@@ -21,9 +21,7 @@ export enum FilterTypeEnum {
   IS = 'IS',
   IS_NOT = 'IS_NOT',
   INCLUDES = 'INCLUDES',
-  INCLUDES_ANY = 'INCLUDES_ANY',
   EXCLUDES = 'EXCLUDES',
-  EXCLUDES_ANY = 'EXCLUDES_ANY',
   UNDEFINED = 'UNDEFINED',
 }
 

server/src/modules/issues/issues.interface.ts

@@ -350,40 +350,40 @@ summary: ["Lucas wants to discuss the project timeline.","The discussion will ta
 export const aiFilterPrompt = `Generate a filter json based on the text:
 
 Filters:
-- status: Issues with these status, [{{status}}], 
-- priority: Issues with these priority, ["Urgent", High", "Medium", "Low"]
+- status: Issues with these statuses, [{{status}}], 
+- priority: Issues with these priorities, ["Urgent", High", "Medium", "Low"]
 - assignee: Issues assigned to those users, [{{assignee}}]
 - labels: Issues with these Labels, [{{labels}}]
-- isBlocked: Issue is blocked another by another issue
+- isBlocked: The issue is blocked by another issue
 - isBlocking: an issue is blocking another issue
-- isParent: Issue is a parent of sub issue
+- isParent: Issue is a parent of sub-issue
+- isSubIssue: Issue is a sub issue of parent
 
 Filter Type:
 - IS
 - IS_NOT
 - INCLUDES
-- INCLUDES_ANY
 - EXCLUDES
-- EXCLUDES_ANY
 - UNDEFINED
 
 Guidelines:
 - User inputs a plain text of the filtered view
 - Filters data is an array value. 
-- Incorporate the relevant filter id to the final json.
+- Incorporate the relevant filter id into the final JSON.
 - Don't use the word Task instead use Issue
 - Give empty JSON when there is nothing matches with the filters data
 - for labels user filterType INCLUDES
-- Don't respond with anything other than the JSON output
+- Don't respond with anything other than the JSON output and not formatting
 
 Examples:
-- status: Issues with these status, ["Done", Triage", "Todo", "Backlog"], 
-- priority: Issues with these priority, ["Urgent", High", "Medium", "Low"]
+- status: Issues with these statuses, ["Done", Triage", "Todo", "Backlog"], 
+- priority: Issues with these priorities, ["Urgent", High", "Medium", "Low"]
 - assignee: Issues assigned to those users, ["Manik", "Manoj", "Harshith", "Rob"]
-- labels: Issues with these Labels, ["Backend", "Bug", "Feture", "Frontend"]
-- isBlocked: Issue is blocked another by another issue
+- labels: Issues with these Labels, ["Backend", "Bug", "Feature", "Frontend"]
+- isBlocked: The issue is blocked by another issue
 - isBlocking: an issue is blocking another issue
-- isParent: Issue is a parent of sub issue
+- isParent: Issue is a parent of sub-issue
+- isSubIssue: Issue is a sub issue of parent issue
 
 User: Show Harshith and Manik's issue
 Filters: {"assignee": {"filterType": "IS", "value": ["Harshith", "Manik"] }}
@@ -392,13 +392,16 @@ User: issues with bug and backend
 Filters: {"label": {"filterType": "INCLUDES", "value": ["Bug", "Backend"] }}
 
 User: Manoj's bugs
-Filters: {"label": {"filterType": "INCLUDES", "value": ["Bug"},  "assignee" : {"filterType": "IS", "value": ["Manoj"]}}
+Filters: {"label": {"filterType": "INCLUDES", "value": ["Bug"},  "assignee": {"filterType": "IS", "value": ["Manoj"]}}
 
 User: Parent Issues
 Filters: {"isParent": {"filterType": "IS"}}
 
-User: high priority blocked issues
+User: high-priority blocked issues
 Filters: {"isBlocked": {"filterType": "IS"}, "priority":  {"filterType": "IS", "value": ["High"]}}
 
+User: Sub Issues
+Filters: {"isSubIssue": {"filterType": "IS"}}
+
 User: Manoj blocked issues
 Filters: {"isBlocking": {"filterType": "IS"}, "assignee":  {"filterType": "IS", "value": ["Manoj"]}}`;

server/src/modules/issues/issues.utils.ts

@@ -136,7 +136,7 @@ export async function getAiFilter(
         { role: 'system', content: filterPrompt },
         { role: 'user', content: filterText },
       ],
-      model: 'gpt-4-turbo',
+      model: 'gpt-4o',
     });
     return JSON.parse(chatCompletion.choices[0].message.content);
   } catch (error) {

server/src/modules/views/views.interface.ts

@@ -20,10 +20,8 @@ export interface ViewsRequestBody {
 export enum FilterTypeEnum {
   IS = 'IS',
   IS_NOT = 'IS_NOT',
-  INCLUDES = 'INCLUDLES',
-  INCLUDES_ANY = 'INCLUDES_ANY',
+  INCLUDES = 'INCLUDES',
   EXCLUDES = 'EXCLUDES',
-  EXCLUDES_ANY = 'EXCLUDES_ANY',
   UNDEFINED = 'UNDEFINED',
 }
 
@@ -102,16 +100,14 @@ Filter Type:
 - IS
 - IS_NOT
 - INCLUDES
-- INCLUDES_ANY
 - EXCLUDES
-- EXCLUDES_ANY
 - UNDEFINED
 
 Guidelines:
 - The view name should be a concise and descriptive title that reflects the purpose of the view based on the selected filters. It should be no more than 5 words.
 - The view description should provide more details about the view and explain how the selected filters are used to create the view. It should be 1-2 sentences long and no more than 30 words.
 - Incorporate the relevant filter values and types into the generated view name and description to provide clarity and specificity.
-- Filter input will be in this format {"filter": {"filterType": "INCLUDLES", "value": ["value1", "value2", "value3"]}}
+- Filter input will be in this format {"filter": {"filterType": "INCLUDES", "value": ["value1", "value2", "value3"]}}
 - If a filter type is "UNDEFINED," exclude that filter from the generated view name and description.
 - Don't use the word Task instead use Issue
 - Don't join values of the filter in the output of view name and description
@@ -122,7 +118,7 @@ Filters: {"Status": {"filterType": "INCLUDES", "value": ["Open", "In Progress"]
 "Priority": {"filterType": "IS", "value": ["High"] }
 "Team": {"filterType": "IS", "value": ["Design"] }
 "Assignee": {"filterType": "UNDEFINED", "value": [] }
-"Labels": {"filterType": "INCLUDES_ANY", "value": ["Bug"] }
+"Labels": {"filterType": "INCLUDES", "value": ["Bug"] }
 }
 
 viewName: Open High-Priority Design Issues with Bug Label