feat(editor): enable ticket mentions on new-ticket forms and fix @mention popup layering\n\n- New Ticket page/dialog/portal now support @ to link tickets\n- Mention popup uses fixed strategy + high z-index\n- Add minimal Tippy box styling to globals.css\n- Keeps existing server-side permissions for mentions
This commit is contained in:
parent
b0f57009ac
commit
904134604c
5 changed files with 25 additions and 2 deletions
|
|
@ -198,6 +198,7 @@ export function PortalTicketForm() {
|
|||
placeholder="Compartilhe passos para reproduzir, mensagens de erro ou informações adicionais."
|
||||
className="rounded-2xl border border-slate-200 shadow-sm focus-within:border-neutral-900 focus-within:ring-neutral-900/20"
|
||||
disabled={machineInactive || isSubmitting}
|
||||
ticketMention={{ enabled: allowTicketMentions }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -252,3 +253,4 @@ export function PortalTicketForm() {
|
|||
</Card>
|
||||
)
|
||||
}
|
||||
const allowTicketMentions = true
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ export function NewTicketDialog({ triggerClassName }: { triggerClassName?: strin
|
|||
},
|
||||
mode: "onTouched",
|
||||
})
|
||||
const { convexUserId, isStaff } = useAuth()
|
||||
const { convexUserId, isStaff, role } = useAuth()
|
||||
const queuesEnabled = Boolean(isStaff && convexUserId)
|
||||
const queueArgs = queuesEnabled
|
||||
? { tenantId: DEFAULT_TENANT_ID, viewerId: convexUserId as Id<"users"> }
|
||||
|
|
@ -297,6 +297,7 @@ export function NewTicketDialog({ triggerClassName }: { triggerClassName?: strin
|
|||
})
|
||||
}
|
||||
placeholder="Detalhe o problema, passos para reproduzir, links, etc."
|
||||
ticketMention={{ enabled: allowTicketMentions }}
|
||||
/>
|
||||
<FieldError
|
||||
errors={
|
||||
|
|
@ -440,3 +441,7 @@ export function NewTicketDialog({ triggerClassName }: { triggerClassName?: strin
|
|||
</Dialog>
|
||||
)
|
||||
}
|
||||
const allowTicketMentions = useMemo(() => {
|
||||
const normalized = (role ?? "").toLowerCase()
|
||||
return normalized === "admin" || normalized === "agent" || normalized === "collaborator"
|
||||
}, [role])
|
||||
|
|
|
|||
|
|
@ -16,6 +16,9 @@ import Placeholder from "@tiptap/extension-placeholder"
|
|||
import Mention from "@tiptap/extension-mention"
|
||||
import { ReactRenderer } from "@tiptap/react"
|
||||
import tippy, { type Instance, type Props as TippyProps } from "tippy.js"
|
||||
// Nota: o CSS do Tippy não é obrigatório, mas melhora muito a renderização
|
||||
// do popover de sugestões. O componente aplica um z-index alto e estratégia
|
||||
// "fixed" para evitar problemas de sobreposição/scrolling mesmo sem CSS global.
|
||||
import { cn } from "@/lib/utils"
|
||||
import sanitize from "sanitize-html"
|
||||
import { Button } from "@/components/ui/button"
|
||||
|
|
@ -357,6 +360,8 @@ const TicketMentionExtension = Mention.extend({
|
|||
interactive: true,
|
||||
trigger: "manual",
|
||||
placement: "bottom-start",
|
||||
zIndex: 99999,
|
||||
popperOptions: { strategy: "fixed" },
|
||||
})
|
||||
},
|
||||
onUpdate(props) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue