diff --git a/moon/apps/web/components/MarkdownEditor/MentionList.tsx b/moon/apps/web/components/MarkdownEditor/MentionList.tsx index d717788a1..59a982485 100644 --- a/moon/apps/web/components/MarkdownEditor/MentionList.tsx +++ b/moon/apps/web/components/MarkdownEditor/MentionList.tsx @@ -3,7 +3,7 @@ import { uniqBy } from 'remeda' import { Mention } from '@gitmono/editor/extensions' import { OrganizationMember, SyncOrganizationMember } from '@gitmono/types/generated' -import { UIText } from '@gitmono/ui' +import { GitCommitIcon, UIText } from '@gitmono/ui' import { AppBadge } from '@/components/AppBadge' import { GuestBadge } from '@/components/GuestBadge' @@ -19,23 +19,42 @@ type Props = Pick, 'editor'> & { export function MentionList({ editor, defaultMentions, modal }: Props) { return ( - { - const $from = state.doc.resolve(range.from) - const type = state.schema.nodes[Mention.name] - const allow = !!$from.parent.type.contentMatch.matchType(type) + <> + { + const $from = state.doc.resolve(range.from) + const type = state.schema.nodes[Mention.name] + const allow = !!$from.parent.type.contentMatch.matchType(type) - return allow - }} - minScore={0.2} - contentClassName='p-0 max-h-[min(480px,var(--radix-popover-content-available-height))] w-[min(350px,var(--radix-popover-content-available-width))]' - listClassName='p-1' - > - - + return allow + }} + minScore={0.2} + contentClassName='p-0 max-h-[min(480px,var(--radix-popover-content-available-height))] w-[min(350px,var(--radix-popover-content-available-width))]' + listClassName='p-1' + > + + + { + const $from = state.doc.resolve(range.from) + const type = state.schema.nodes[Mention.name] + const allow = !!$from.parent.type.contentMatch.matchType(type) + + return allow + }} + minScore={0.2} + contentClassName='p-0 max-h-[min(480px,var(--radix-popover-content-available-height))] w-[min(350px,var(--radix-popover-content-available-width))]' + listClassName='p-1' + > + + + ) } @@ -97,3 +116,48 @@ function InnerMentionList({ editor, defaultMentions }: Pick )) } + +function InnerIssueList({ editor }: Pick) { + const items = [ + { + role: 'app', + issue: { + hash: '#1234', + name: 'This is an issue example.' + } + }, + { + role: 'app', + issue: { + hash: '#5678', + name: 'Another issue example.' + } + } + ] + + return items.map((member) => ( + + editor.commands.insertMention({ + range, + id: member.issue.hash, + label: member.issue.hash, + username: '', + role: member.role === 'app' ? 'app' : 'member' + }) + } + > + +
+ {member.issue.name} + {member.issue.hash} +
+
+ )) +}