diff --git a/web/components/pages/create-update-block-inline.tsx b/web/components/pages/create-update-block-inline.tsx
index 45d4635557..1d0da50185 100644
--- a/web/components/pages/create-update-block-inline.tsx
+++ b/web/components/pages/create-update-block-inline.tsx
@@ -18,6 +18,7 @@ import { RichTextEditorWithRef } from "@plane/rich-text-editor";
import { IUser, IPageBlock } from "types";
// fetch-keys
import { PAGE_BLOCKS_LIST } from "constants/fetch-keys";
+import useEditorSuggestions from "hooks/use-editor-suggestions";
type Props = {
handleClose: () => void;
@@ -55,6 +56,8 @@ export const CreateUpdateBlockInline: FC = ({
const router = useRouter();
const { workspaceSlug, projectId, pageId } = router.query;
+ const editorSuggestion = useEditorSuggestions(workspaceSlug as string | undefined, projectId as string | undefined)
+
const { setToastAlert } = useToast();
const {
@@ -304,6 +307,8 @@ export const CreateUpdateBlockInline: FC = ({
onChange(description_html);
setValue("description", description);
}}
+ mentionHighlights={editorSuggestion.mentionHighlights}
+ mentionSuggestions={editorSuggestion.mentionSuggestions}
/>
);
else if (!value || !watch("description_html"))
diff --git a/web/components/pages/single-page-block.tsx b/web/components/pages/single-page-block.tsx
index 486984070b..32092c0362 100644
--- a/web/components/pages/single-page-block.tsx
+++ b/web/components/pages/single-page-block.tsx
@@ -26,6 +26,7 @@ import { copyTextToClipboard } from "helpers/string.helper";
import { IUser, IIssue, IPageBlock, IProject } from "types";
// fetch-keys
import { PAGE_BLOCKS_LIST } from "constants/fetch-keys";
+import useEditorSuggestions from "hooks/use-editor-suggestions";
type Props = {
block: IPageBlock;
@@ -63,6 +64,8 @@ export const SinglePageBlock: React.FC = ({ block, projectDetails, showBl
},
});
+ const editorSuggestion = useEditorSuggestions(workspaceSlug as string | undefined, projectId as string | undefined)
+
const updatePageBlock = async (formData: Partial) => {
if (!workspaceSlug || !projectId || !pageId) return;
@@ -423,6 +426,8 @@ export const SinglePageBlock: React.FC = ({ block, projectDetails, showBl
customClassName="text-sm min-h-[150px]"
noBorder
borderOnFocus={false}
+ mentionSuggestions={editorSuggestion.mentionSuggestions}
+ mentionHighlights={editorSuggestion.mentionHighlights}
/>
)
: block.description_stripped.length > 0 && (
diff --git a/web/components/profile/profile-issues-view.tsx b/web/components/profile/profile-issues-view.tsx
index 7c47235372..41daf4e88b 100644
--- a/web/components/profile/profile-issues-view.tsx
+++ b/web/components/profile/profile-issues-view.tsx
@@ -251,6 +251,7 @@ export const ProfileIssuesView = () => {
states={undefined}
clearAllFilters={() =>
setFilters({
+ mentions: null,
labels: null,
priority: null,
state_group: null,
diff --git a/web/components/views/select-filters.tsx b/web/components/views/select-filters.tsx
new file mode 100644
index 0000000000..8a5f9dd121
--- /dev/null
+++ b/web/components/views/select-filters.tsx
@@ -0,0 +1,278 @@
+import { useState } from "react";
+import { useRouter } from "next/router";
+import useSWR from "swr";
+// services
+import { ProjectStateService, ProjectService } from "services/project";
+import { IssueLabelService } from "services/issue";
+// ui
+import { Avatar, MultiLevelDropdown } from "components/ui";
+// icons
+import { PriorityIcon, StateGroupIcon } from "@plane/ui";
+// helpers
+import { getStatesList } from "helpers/state.helper";
+import { checkIfArraysHaveSameElements } from "helpers/array.helper";
+// types
+import { IIssueFilterOptions } from "types";
+// fetch-keys
+import { PROJECT_ISSUE_LABELS, PROJECT_MEMBERS, STATES_LIST } from "constants/fetch-keys";
+// constants
+import { PRIORITIES } from "constants/project";
+import { DATE_FILTER_OPTIONS } from "constants/filters";
+
+type Props = {
+ filters: Partial;
+ onSelect: (option: any) => void;
+ direction?: "left" | "right";
+ height?: "sm" | "md" | "rg" | "lg";
+};
+
+const projectService = new ProjectService();
+const projectStateService = new ProjectStateService();
+const issueLabelService = new IssueLabelService();
+
+export const SelectFilters: React.FC = ({ filters, onSelect, direction = "right", height = "md" }) => {
+ const [isDateFilterModalOpen, setIsDateFilterModalOpen] = useState(false);
+ const [dateFilterType, setDateFilterType] = useState<{
+ title: string;
+ type: "start_date" | "target_date";
+ }>({
+ title: "",
+ type: "start_date",
+ });
+
+ const router = useRouter();
+ const { workspaceSlug, projectId } = router.query;
+
+ const { data: states } = useSWR(
+ workspaceSlug && projectId ? STATES_LIST(projectId as string) : null,
+ workspaceSlug && projectId
+ ? () => projectStateService.getStates(workspaceSlug as string, projectId as string)
+ : null
+ );
+ const statesList = getStatesList(states);
+
+ const { data: members } = useSWR(
+ projectId ? PROJECT_MEMBERS(projectId as string) : null,
+ workspaceSlug && projectId
+ ? () => projectService.fetchProjectMembers(workspaceSlug as string, projectId as string)
+ : null
+ );
+
+ const { data: issueLabels } = useSWR(
+ projectId ? PROJECT_ISSUE_LABELS(projectId.toString()) : null,
+ workspaceSlug && projectId
+ ? () => issueLabelService.getProjectIssueLabels(workspaceSlug as string, projectId.toString())
+ : null
+ );
+
+ const projectFilterOption = [
+ {
+ id: "priority",
+ label: "Priority",
+ value: PRIORITIES,
+ hasChildren: true,
+ children: PRIORITIES.map((priority) => ({
+ id: priority === null ? "null" : priority,
+ label: (
+
+
+ {priority ?? "None"}
+
+
+ {state.name}
+
+ ),
+ value: {
+ key: "state",
+ value: state.id,
+ },
+ selected: filters?.state?.includes(state.id),
+ })),
+ },
+ {
+ id: "assignees",
+ label: "Assignees",
+ value: members,
+ hasChildren: true,
+ children: members?.map((member) => ({
+ id: member.member.id,
+ label: (
+
+
+ {member.member.display_name}
+
+
+ {member.member.display_name}
+
+
+ {member.member.display_name}
+
+
+ {comment.actor_detail.avatar && comment.actor_detail.avatar !== "" ? (
+
+ ) : (
+
+ {comment.actor_detail.is_bot
+ ? comment.actor_detail.first_name.charAt(0)
+ : comment.actor_detail.display_name.charAt(0)}
+
+ )}
+
+
+
+
+
+
+
+
+ {comment.actor_detail.is_bot ? comment.actor_detail.first_name + " Bot" : comment.actor_detail.display_name}
+
+
commented {timeAgo(comment.created_at)}
+
+
+
+
+ {showAccessSpecifier && (
+
+ {comment.access === "INTERNAL" ? : }
+
+ )}
+
+
+
+
+
+ {user?.id === comment.actor && !disabled && (
+
+ setIsEditing(true)} className="flex items-center gap-1">
+
+ Edit comment
+
+ {showAccessSpecifier && (
+ <>
+ {comment.access === "INTERNAL" ? (
+ onSubmit(comment.id, { access: "EXTERNAL" })}
+ className="flex items-center gap-1"
+ >
+
+ Switch to public comment
+
+ ) : (
+ onSubmit(comment.id, { access: "INTERNAL" })}
+ className="flex items-center gap-1"
+ >
+
+ Switch to private comment
+
+ )}
+
+ )}
+ {
+ handleCommentDeletion(comment.id);
+ }}
+ className="flex items-center gap-1"
+ >
+
+ Delete comment
+
+
+ )}
+
+
+
+ {isAllowed ? (
+ (
+