organify-ui 0.3.2 → 0.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chat-mock-data-DST5Tn_H.d.ts → ai-chat-sidebar-BYphYj2N.d.ts} +34 -2
- package/dist/{chunk-GQZMW7XN.js → chunk-NUA6OPJV.js} +675 -242
- package/dist/chunk-NUA6OPJV.js.map +1 -0
- package/dist/components/chat/index.d.ts +53 -3
- package/dist/components/chat/index.js +1 -1
- package/dist/index.d.ts +36 -8
- package/dist/index.js +436 -215
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
- package/src/globals.css +33 -0
- package/dist/chunk-GQZMW7XN.js.map +0 -1
|
@@ -175,12 +175,12 @@ var buttonVariants = cva(
|
|
|
175
175
|
{
|
|
176
176
|
variants: {
|
|
177
177
|
variant: {
|
|
178
|
-
default: "bg-primary text-white hover:bg-primary/90",
|
|
179
|
-
destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20",
|
|
180
|
-
outline: "border bg-background border-input text-
|
|
181
|
-
secondary: "bg-secondary text-
|
|
182
|
-
ghost: "text-
|
|
183
|
-
link: "text-primary underline-offset-4 hover:underline"
|
|
178
|
+
default: "bg-primary !text-white hover:bg-primary/90",
|
|
179
|
+
destructive: "!bg-destructive !text-white hover:bg-destructive/90 focus-visible:ring-destructive/20",
|
|
180
|
+
outline: "border bg-background border-input !text-white hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:text-white dark:hover:bg-input/50",
|
|
181
|
+
secondary: "bg-secondary !text-white hover:bg-secondary/80 !dark:text-white",
|
|
182
|
+
ghost: "!text-white hover:bg-accent hover:text-accent-foreground !dark:text-white dark:hover:bg-accent/50",
|
|
183
|
+
link: "!text-primary underline-offset-4 hover:underline"
|
|
184
184
|
},
|
|
185
185
|
size: {
|
|
186
186
|
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
@@ -1530,7 +1530,7 @@ function ChatMessages({
|
|
|
1530
1530
|
/* @__PURE__ */ jsx("p", { className: "text-sm text-theme-muted", children: "Ainda sem mensagens." }),
|
|
1531
1531
|
/* @__PURE__ */ jsx("p", { className: "text-xs text-theme-muted mt-1", children: "Comece a conversa!" })
|
|
1532
1532
|
] }) : messages.map((msg, idx) => {
|
|
1533
|
-
const isCurrentUser = msg.authorId === currentUserId;
|
|
1533
|
+
const isCurrentUser = !!currentUserId && String(msg.authorId) === String(currentUserId);
|
|
1534
1534
|
const replyToMessage = msg.replyToId || msg.parentId ? messagesById.get(msg.replyToId || msg.parentId || "") : null;
|
|
1535
1535
|
return /* @__PURE__ */ jsxs(React6.Fragment, { children: [
|
|
1536
1536
|
shouldShowDateSeparator(messages, idx) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 py-3", children: [
|
|
@@ -1687,9 +1687,8 @@ function DialogContent({
|
|
|
1687
1687
|
{
|
|
1688
1688
|
"data-slot": "dialog-content",
|
|
1689
1689
|
className: cn(
|
|
1690
|
-
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl border
|
|
1691
|
-
"bg-
|
|
1692
|
-
"dark:shadow-[0_24px_80px_-15px_rgba(0,0,0,0.8)]",
|
|
1690
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl border p-6 shadow-2xl duration-[400ms] sm:max-w-lg",
|
|
1691
|
+
"[background:var(--org-bg-elevated)] [color:var(--org-text)] [border-color:var(--org-glass-border)]",
|
|
1693
1692
|
className
|
|
1694
1693
|
),
|
|
1695
1694
|
...props,
|
|
@@ -1805,11 +1804,11 @@ function DrawerContent({
|
|
|
1805
1804
|
},
|
|
1806
1805
|
className: cn(
|
|
1807
1806
|
"fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border-2",
|
|
1808
|
-
"
|
|
1807
|
+
"[background:var(--org-bg-elevated)] [color:var(--org-text)] [border-color:var(--org-glass-border)]",
|
|
1809
1808
|
className
|
|
1810
1809
|
),
|
|
1811
1810
|
children: [
|
|
1812
|
-
/* @__PURE__ */ jsx("div", { className: "mx-auto mt-4 h-2 w-[100px] rounded-full bg-
|
|
1811
|
+
/* @__PURE__ */ jsx("div", { className: "mx-auto mt-4 h-2 w-[100px] rounded-full bg-theme-subtle" }),
|
|
1813
1812
|
children
|
|
1814
1813
|
]
|
|
1815
1814
|
}
|
|
@@ -1891,17 +1890,11 @@ function ResponsiveDialog({
|
|
|
1891
1890
|
return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
|
|
1892
1891
|
DialogContent,
|
|
1893
1892
|
{
|
|
1894
|
-
className: cn(
|
|
1895
|
-
"max-w-2xl max-h-[85vh] overflow-y-auto",
|
|
1896
|
-
"border-2 bg-white text-gray-900 border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:text-white",
|
|
1897
|
-
"dark:shadow-[0_24px_80px_-15px_rgba(0,0,0,0.8)]",
|
|
1898
|
-
"shadow-xl",
|
|
1899
|
-
contentClassName
|
|
1900
|
-
),
|
|
1893
|
+
className: cn("max-w-2xl max-h-[85vh] overflow-y-auto", contentClassName),
|
|
1901
1894
|
children: [
|
|
1902
1895
|
(title || description) && /* @__PURE__ */ jsxs(DialogHeader, { children: [
|
|
1903
1896
|
title && /* @__PURE__ */ jsx(DialogTitle, { className: "text-lg", children: title }),
|
|
1904
|
-
description && /* @__PURE__ */ jsx(DialogDescription, { className: "text-muted
|
|
1897
|
+
description && /* @__PURE__ */ jsx(DialogDescription, { className: "text-theme-muted text-sm", children: description })
|
|
1905
1898
|
] }),
|
|
1906
1899
|
/* @__PURE__ */ jsx("div", { className, children }),
|
|
1907
1900
|
footer && /* @__PURE__ */ jsx(DialogFooter, { children: footer })
|
|
@@ -1909,24 +1902,14 @@ function ResponsiveDialog({
|
|
|
1909
1902
|
}
|
|
1910
1903
|
) });
|
|
1911
1904
|
}
|
|
1912
|
-
return /* @__PURE__ */ jsx(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
className:
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
children: [
|
|
1921
|
-
(title || description) && /* @__PURE__ */ jsxs(DrawerHeader, { className: "text-left", children: [
|
|
1922
|
-
title && /* @__PURE__ */ jsx(DrawerTitle, { className: "text-lg", children: title }),
|
|
1923
|
-
description && /* @__PURE__ */ jsx(DrawerDescription, { className: "text-muted-foreground text-sm", children: description })
|
|
1924
|
-
] }),
|
|
1925
|
-
/* @__PURE__ */ jsx("div", { className: cn("overflow-y-auto px-4 pb-4", className), children }),
|
|
1926
|
-
footer && /* @__PURE__ */ jsx(DrawerFooter, { children: footer })
|
|
1927
|
-
]
|
|
1928
|
-
}
|
|
1929
|
-
) });
|
|
1905
|
+
return /* @__PURE__ */ jsx(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DrawerContent, { className: cn("max-h-[90vh]", contentClassName), children: [
|
|
1906
|
+
(title || description) && /* @__PURE__ */ jsxs(DrawerHeader, { className: "text-left", children: [
|
|
1907
|
+
title && /* @__PURE__ */ jsx(DrawerTitle, { className: "text-lg", children: title }),
|
|
1908
|
+
description && /* @__PURE__ */ jsx(DrawerDescription, { className: "text-theme-muted text-sm", children: description })
|
|
1909
|
+
] }),
|
|
1910
|
+
/* @__PURE__ */ jsx("div", { className: cn("overflow-y-auto px-4 pb-4", className), children }),
|
|
1911
|
+
footer && /* @__PURE__ */ jsx(DrawerFooter, { children: footer })
|
|
1912
|
+
] }) });
|
|
1930
1913
|
}
|
|
1931
1914
|
ResponsiveDialog.displayName = "ResponsiveDialog";
|
|
1932
1915
|
var Tabs = TabsPrimitive.Root;
|
|
@@ -3691,6 +3674,230 @@ function Alert({
|
|
|
3691
3674
|
)
|
|
3692
3675
|
] });
|
|
3693
3676
|
}
|
|
3677
|
+
function useMediaQuery2(query) {
|
|
3678
|
+
const [matches, setMatches] = React6.useState(false);
|
|
3679
|
+
React6.useEffect(() => {
|
|
3680
|
+
const mql = window.matchMedia(query);
|
|
3681
|
+
setMatches(mql.matches);
|
|
3682
|
+
const handler = (e) => setMatches(e.matches);
|
|
3683
|
+
mql.addEventListener("change", handler);
|
|
3684
|
+
return () => mql.removeEventListener("change", handler);
|
|
3685
|
+
}, [query]);
|
|
3686
|
+
return matches;
|
|
3687
|
+
}
|
|
3688
|
+
function OrganifyChat({
|
|
3689
|
+
workspaceRole,
|
|
3690
|
+
workspaceMembers,
|
|
3691
|
+
workspaceProjects,
|
|
3692
|
+
initialRooms,
|
|
3693
|
+
initialMessages,
|
|
3694
|
+
className
|
|
3695
|
+
}) {
|
|
3696
|
+
const user = useOrganifyUser();
|
|
3697
|
+
const userId = user?.id ?? "";
|
|
3698
|
+
const stableWorkspaceMembers = React6.useMemo(
|
|
3699
|
+
() => workspaceMembers ?? [],
|
|
3700
|
+
[workspaceMembers]
|
|
3701
|
+
);
|
|
3702
|
+
const stableWorkspaceProjects = React6.useMemo(
|
|
3703
|
+
() => workspaceProjects ?? [],
|
|
3704
|
+
[workspaceProjects]
|
|
3705
|
+
);
|
|
3706
|
+
const chat = useChat({
|
|
3707
|
+
workspaceRole,
|
|
3708
|
+
initialRooms,
|
|
3709
|
+
initialMessages,
|
|
3710
|
+
workspaceMembers: stableWorkspaceMembers
|
|
3711
|
+
});
|
|
3712
|
+
const isMobile = !useMediaQuery2("(min-width: 768px)");
|
|
3713
|
+
const [createDialogOpen, setCreateDialogOpen] = React6.useState(false);
|
|
3714
|
+
const [managementOpen, setManagementOpen] = React6.useState(false);
|
|
3715
|
+
const [mobileView, setMobileView] = React6.useState("sidebar");
|
|
3716
|
+
const activeRoom = React6.useMemo(
|
|
3717
|
+
() => chat.rooms.find((r) => r.id === chat.activeRoomId),
|
|
3718
|
+
[chat.rooms, chat.activeRoomId]
|
|
3719
|
+
);
|
|
3720
|
+
const handleRoomSelect = (roomId) => {
|
|
3721
|
+
chat.selectRoom(roomId);
|
|
3722
|
+
if (isMobile) {
|
|
3723
|
+
setMobileView("room");
|
|
3724
|
+
}
|
|
3725
|
+
};
|
|
3726
|
+
const handleBackToSidebar = () => {
|
|
3727
|
+
setMobileView("sidebar");
|
|
3728
|
+
};
|
|
3729
|
+
const handleOpenManagement = () => {
|
|
3730
|
+
if (isMobile) {
|
|
3731
|
+
setMobileView("management");
|
|
3732
|
+
} else {
|
|
3733
|
+
setManagementOpen(true);
|
|
3734
|
+
}
|
|
3735
|
+
};
|
|
3736
|
+
const handleCloseManagement = () => {
|
|
3737
|
+
if (isMobile) {
|
|
3738
|
+
setMobileView("room");
|
|
3739
|
+
} else {
|
|
3740
|
+
setManagementOpen(false);
|
|
3741
|
+
}
|
|
3742
|
+
};
|
|
3743
|
+
return /* @__PURE__ */ jsxs(
|
|
3744
|
+
"div",
|
|
3745
|
+
{
|
|
3746
|
+
className: cn(
|
|
3747
|
+
"relative flex h-full min-h-[500px]",
|
|
3748
|
+
"bg-theme-surface border border-theme-subtle rounded-xl overflow-hidden",
|
|
3749
|
+
className
|
|
3750
|
+
),
|
|
3751
|
+
children: [
|
|
3752
|
+
chat.error && /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 z-50 px-4 pt-2 animate-in slide-in-from-top-2 duration-[400ms]", children: /* @__PURE__ */ jsx(
|
|
3753
|
+
Alert,
|
|
3754
|
+
{
|
|
3755
|
+
variant: "error",
|
|
3756
|
+
title: "Erro",
|
|
3757
|
+
description: chat.error,
|
|
3758
|
+
className: "py-3 text-xs"
|
|
3759
|
+
}
|
|
3760
|
+
) }),
|
|
3761
|
+
!isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3762
|
+
/* @__PURE__ */ jsx("div", { className: "w-[260px] shrink-0", children: /* @__PURE__ */ jsx(
|
|
3763
|
+
ChatSidebar,
|
|
3764
|
+
{
|
|
3765
|
+
rooms: chat.rooms,
|
|
3766
|
+
activeRoomId: chat.activeRoomId,
|
|
3767
|
+
loading: chat.loadingRooms,
|
|
3768
|
+
onSelectRoom: chat.selectRoom,
|
|
3769
|
+
onCreateRoom: () => setCreateDialogOpen(true)
|
|
3770
|
+
}
|
|
3771
|
+
) }),
|
|
3772
|
+
/* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx(
|
|
3773
|
+
ChatMessages,
|
|
3774
|
+
{
|
|
3775
|
+
room: activeRoom,
|
|
3776
|
+
messages: chat.messages,
|
|
3777
|
+
loading: chat.loadingMessages,
|
|
3778
|
+
typingUsers: chat.typingUsers,
|
|
3779
|
+
currentUserId: userId,
|
|
3780
|
+
permissions: chat.permissions,
|
|
3781
|
+
onSendMessage: chat.sendMessage,
|
|
3782
|
+
onEditMessage: chat.editMessage,
|
|
3783
|
+
onDeleteMessage: chat.deleteMessage,
|
|
3784
|
+
onReactToMessage: chat.reactToMessage,
|
|
3785
|
+
onTyping: chat.sendTyping,
|
|
3786
|
+
onStopTyping: chat.sendTyping,
|
|
3787
|
+
onOpenManagement: () => setManagementOpen(true),
|
|
3788
|
+
isMobile: false,
|
|
3789
|
+
mentionUsers: stableWorkspaceMembers,
|
|
3790
|
+
mentionProjects: stableWorkspaceProjects,
|
|
3791
|
+
hasMore: chat.hasMoreMessages,
|
|
3792
|
+
onLoadMore: chat.loadMoreMessages,
|
|
3793
|
+
loadingMore: chat.loadingMoreMessages
|
|
3794
|
+
}
|
|
3795
|
+
) }),
|
|
3796
|
+
managementOpen && activeRoom && /* @__PURE__ */ jsx("div", { className: "w-[300px] shrink-0 border-l border-theme-subtle bg-theme-glass", children: /* @__PURE__ */ jsx(
|
|
3797
|
+
RoomManagementPanel,
|
|
3798
|
+
{
|
|
3799
|
+
room: activeRoom,
|
|
3800
|
+
members: chat.roomMembers,
|
|
3801
|
+
currentUserId: userId,
|
|
3802
|
+
permissions: chat.permissions,
|
|
3803
|
+
onClose: () => setManagementOpen(false),
|
|
3804
|
+
onUpdateRoom: chat.updateRoom,
|
|
3805
|
+
onArchiveRoom: chat.archiveRoom,
|
|
3806
|
+
onLeaveRoom: chat.leaveRoom,
|
|
3807
|
+
onRemoveMember: chat.removeMember,
|
|
3808
|
+
onUpdateMemberRole: chat.updateMemberRole
|
|
3809
|
+
}
|
|
3810
|
+
) })
|
|
3811
|
+
] }),
|
|
3812
|
+
isMobile && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3813
|
+
mobileView === "sidebar" && /* @__PURE__ */ jsx("div", { className: "w-full animate-in fade-in-0 slide-in-from-left-5 duration-[400ms]", children: /* @__PURE__ */ jsx(
|
|
3814
|
+
ChatSidebar,
|
|
3815
|
+
{
|
|
3816
|
+
rooms: chat.rooms,
|
|
3817
|
+
activeRoomId: chat.activeRoomId,
|
|
3818
|
+
loading: chat.loadingRooms,
|
|
3819
|
+
onSelectRoom: handleRoomSelect,
|
|
3820
|
+
onCreateRoom: () => setCreateDialogOpen(true)
|
|
3821
|
+
}
|
|
3822
|
+
) }),
|
|
3823
|
+
mobileView === "room" && activeRoom && /* @__PURE__ */ jsx("div", { className: "w-full animate-in fade-in-0 slide-in-from-right-5 duration-[400ms]", children: /* @__PURE__ */ jsx(
|
|
3824
|
+
ChatMessages,
|
|
3825
|
+
{
|
|
3826
|
+
room: activeRoom,
|
|
3827
|
+
messages: chat.messages,
|
|
3828
|
+
loading: chat.loadingMessages,
|
|
3829
|
+
typingUsers: chat.typingUsers,
|
|
3830
|
+
currentUserId: userId,
|
|
3831
|
+
permissions: chat.permissions,
|
|
3832
|
+
onSendMessage: chat.sendMessage,
|
|
3833
|
+
onEditMessage: chat.editMessage,
|
|
3834
|
+
onDeleteMessage: chat.deleteMessage,
|
|
3835
|
+
onReactToMessage: chat.reactToMessage,
|
|
3836
|
+
onTyping: chat.sendTyping,
|
|
3837
|
+
onStopTyping: chat.sendTyping,
|
|
3838
|
+
onOpenManagement: handleOpenManagement,
|
|
3839
|
+
onBack: handleBackToSidebar,
|
|
3840
|
+
isMobile: true,
|
|
3841
|
+
mentionUsers: stableWorkspaceMembers,
|
|
3842
|
+
mentionProjects: stableWorkspaceProjects,
|
|
3843
|
+
hasMore: chat.hasMoreMessages,
|
|
3844
|
+
onLoadMore: chat.loadMoreMessages,
|
|
3845
|
+
loadingMore: chat.loadingMoreMessages
|
|
3846
|
+
}
|
|
3847
|
+
) }),
|
|
3848
|
+
mobileView === "management" && activeRoom && /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 z-50 flex", children: [
|
|
3849
|
+
/* @__PURE__ */ jsx(
|
|
3850
|
+
"div",
|
|
3851
|
+
{
|
|
3852
|
+
className: "flex-1 bg-black/50 backdrop-blur-sm",
|
|
3853
|
+
onClick: handleCloseManagement
|
|
3854
|
+
}
|
|
3855
|
+
),
|
|
3856
|
+
/* @__PURE__ */ jsx("div", { className: "w-[85%] max-w-sm h-full bg-white/[0.03] backdrop-blur-[40px] border-l border-white/10 animate-in slide-in-from-right-5 duration-[400ms]", children: /* @__PURE__ */ jsx(
|
|
3857
|
+
RoomManagementPanel,
|
|
3858
|
+
{
|
|
3859
|
+
room: activeRoom,
|
|
3860
|
+
members: chat.roomMembers,
|
|
3861
|
+
currentUserId: userId,
|
|
3862
|
+
permissions: chat.permissions,
|
|
3863
|
+
onClose: handleCloseManagement,
|
|
3864
|
+
onUpdateRoom: chat.updateRoom,
|
|
3865
|
+
onArchiveRoom: chat.archiveRoom,
|
|
3866
|
+
onLeaveRoom: chat.leaveRoom,
|
|
3867
|
+
onRemoveMember: chat.removeMember,
|
|
3868
|
+
onUpdateMemberRole: chat.updateMemberRole
|
|
3869
|
+
}
|
|
3870
|
+
) })
|
|
3871
|
+
] })
|
|
3872
|
+
] }),
|
|
3873
|
+
/* @__PURE__ */ jsx(
|
|
3874
|
+
CreateRoomDialog,
|
|
3875
|
+
{
|
|
3876
|
+
open: createDialogOpen,
|
|
3877
|
+
onOpenChange: setCreateDialogOpen,
|
|
3878
|
+
onCreateChannel: async (data) => {
|
|
3879
|
+
const room = await chat.createRoom({
|
|
3880
|
+
name: data.name,
|
|
3881
|
+
type: "CHANNEL",
|
|
3882
|
+
visibility: data.visibility,
|
|
3883
|
+
description: data.description,
|
|
3884
|
+
memberIds: data.memberIds
|
|
3885
|
+
});
|
|
3886
|
+
if (room) chat.selectRoom(room.id);
|
|
3887
|
+
return room;
|
|
3888
|
+
},
|
|
3889
|
+
onCreateDM: async (targetUserId) => {
|
|
3890
|
+
const room = await chat.createDirectMessage(targetUserId);
|
|
3891
|
+
if (room) chat.selectRoom(room.id);
|
|
3892
|
+
return room;
|
|
3893
|
+
},
|
|
3894
|
+
workspaceMembers: stableWorkspaceMembers
|
|
3895
|
+
}
|
|
3896
|
+
)
|
|
3897
|
+
]
|
|
3898
|
+
}
|
|
3899
|
+
);
|
|
3900
|
+
}
|
|
3694
3901
|
|
|
3695
3902
|
// src/components/chat/chat-mock-data.ts
|
|
3696
3903
|
var MOCK_USERS = [
|
|
@@ -3917,226 +4124,452 @@ var typingIndicator = new TypingIndicatorMock();
|
|
|
3917
4124
|
if (typeof window !== "undefined") {
|
|
3918
4125
|
typingIndicator.simulateRandomTyping();
|
|
3919
4126
|
}
|
|
3920
|
-
function
|
|
3921
|
-
|
|
3922
|
-
|
|
3923
|
-
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
|
-
|
|
3927
|
-
|
|
3928
|
-
|
|
3929
|
-
return matches;
|
|
3930
|
-
}
|
|
3931
|
-
function OrganifyChat({
|
|
3932
|
-
workspaceRole,
|
|
3933
|
-
workspaceMembers,
|
|
3934
|
-
initialRooms,
|
|
3935
|
-
initialMessages,
|
|
3936
|
-
className
|
|
4127
|
+
function AiChatSidebar({
|
|
4128
|
+
open,
|
|
4129
|
+
onOpenChange,
|
|
4130
|
+
messages,
|
|
4131
|
+
onSend,
|
|
4132
|
+
loading = false,
|
|
4133
|
+
userName,
|
|
4134
|
+
contextLabel,
|
|
4135
|
+
placeholder = "Pergunte ao assistente IA..."
|
|
3937
4136
|
}) {
|
|
3938
|
-
const
|
|
3939
|
-
const
|
|
3940
|
-
const
|
|
3941
|
-
|
|
3942
|
-
|
|
3943
|
-
);
|
|
3944
|
-
|
|
3945
|
-
|
|
3946
|
-
|
|
3947
|
-
|
|
3948
|
-
|
|
3949
|
-
|
|
3950
|
-
|
|
3951
|
-
|
|
3952
|
-
|
|
3953
|
-
const [mobileView, setMobileView] = React6.useState("sidebar");
|
|
3954
|
-
const activeRoom = React6.useMemo(
|
|
3955
|
-
() => chat.rooms.find((r) => r.id === chat.activeRoomId),
|
|
3956
|
-
[chat.rooms, chat.activeRoomId]
|
|
3957
|
-
);
|
|
3958
|
-
const handleRoomSelect = (roomId) => {
|
|
3959
|
-
chat.selectRoom(roomId);
|
|
3960
|
-
if (isMobile) {
|
|
3961
|
-
setMobileView("room");
|
|
3962
|
-
}
|
|
3963
|
-
};
|
|
3964
|
-
const handleBackToSidebar = () => {
|
|
3965
|
-
setMobileView("sidebar");
|
|
4137
|
+
const [input, setInput] = React6.useState("");
|
|
4138
|
+
const messagesEndRef = React6.useRef(null);
|
|
4139
|
+
const inputRef = React6.useRef(null);
|
|
4140
|
+
React6.useEffect(() => {
|
|
4141
|
+
messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
4142
|
+
}, [messages]);
|
|
4143
|
+
React6.useEffect(() => {
|
|
4144
|
+
if (open) inputRef.current?.focus();
|
|
4145
|
+
}, [open]);
|
|
4146
|
+
const handleSubmit = (e) => {
|
|
4147
|
+
e.preventDefault();
|
|
4148
|
+
const trimmed = input.trim();
|
|
4149
|
+
if (!trimmed || loading) return;
|
|
4150
|
+
onSend(trimmed);
|
|
4151
|
+
setInput("");
|
|
3966
4152
|
};
|
|
3967
|
-
const
|
|
3968
|
-
if (
|
|
3969
|
-
|
|
3970
|
-
|
|
3971
|
-
setManagementOpen(true);
|
|
4153
|
+
const handleKeyDown = (e) => {
|
|
4154
|
+
if (e.key === "Enter" && !e.shiftKey) {
|
|
4155
|
+
e.preventDefault();
|
|
4156
|
+
handleSubmit(e);
|
|
3972
4157
|
}
|
|
3973
4158
|
};
|
|
3974
|
-
|
|
3975
|
-
|
|
3976
|
-
|
|
3977
|
-
|
|
3978
|
-
|
|
4159
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
4160
|
+
open && /* @__PURE__ */ jsx(
|
|
4161
|
+
"div",
|
|
4162
|
+
{
|
|
4163
|
+
className: "fixed inset-0 z-50 bg-black/40 backdrop-blur-sm transition-opacity",
|
|
4164
|
+
onClick: () => onOpenChange(false)
|
|
4165
|
+
}
|
|
4166
|
+
),
|
|
4167
|
+
/* @__PURE__ */ jsxs(
|
|
4168
|
+
"div",
|
|
4169
|
+
{
|
|
4170
|
+
className: cn(
|
|
4171
|
+
"fixed right-0 top-0 z-50 flex h-full w-[420px] max-w-[90vw] flex-col border-l border-white/10 bg-[#0a0a0f]/95 backdrop-blur-[60px] shadow-2xl",
|
|
4172
|
+
"transition-transform duration-300 ease-in-out",
|
|
4173
|
+
open ? "translate-x-0" : "translate-x-full"
|
|
4174
|
+
),
|
|
4175
|
+
children: [
|
|
4176
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-white/10 px-4 py-3", children: [
|
|
4177
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
4178
|
+
/* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-gradient-to-br from-blue-500 to-purple-600 text-sm font-bold text-white", children: "AI" }),
|
|
4179
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
4180
|
+
/* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-white", children: "Assistente IA" }),
|
|
4181
|
+
contextLabel && /* @__PURE__ */ jsx("p", { className: "text-[11px] text-white/50", children: contextLabel })
|
|
4182
|
+
] })
|
|
4183
|
+
] }),
|
|
4184
|
+
/* @__PURE__ */ jsx(
|
|
4185
|
+
"button",
|
|
4186
|
+
{
|
|
4187
|
+
onClick: () => onOpenChange(false),
|
|
4188
|
+
className: "rounded-md p-1.5 text-white/50 hover:bg-white/10 hover:text-white transition-colors",
|
|
4189
|
+
children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" }) })
|
|
4190
|
+
}
|
|
4191
|
+
)
|
|
4192
|
+
] }),
|
|
4193
|
+
/* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto px-4 py-3 space-y-4", children: [
|
|
4194
|
+
messages.length === 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center h-full text-center space-y-3", children: [
|
|
4195
|
+
/* @__PURE__ */ jsx("div", { className: "flex h-14 w-14 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500/20 to-purple-600/20 border border-white/10", children: /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", className: "text-blue-400", children: /* @__PURE__ */ jsx("path", { d: "M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z" }) }) }),
|
|
4196
|
+
/* @__PURE__ */ jsxs("p", { className: "text-sm text-white/60", children: [
|
|
4197
|
+
userName ? `Ol\xE1 ${userName}!` : "Ol\xE1!",
|
|
4198
|
+
" Como posso ajudar?"
|
|
4199
|
+
] }),
|
|
4200
|
+
/* @__PURE__ */ jsxs("div", { className: "space-y-1.5 text-[11px] text-white/40", children: [
|
|
4201
|
+
/* @__PURE__ */ jsx("p", { children: '"Cria uma task para corrigir o bug do login"' }),
|
|
4202
|
+
/* @__PURE__ */ jsx("p", { children: '"Mostra o resumo do sprint atual"' }),
|
|
4203
|
+
/* @__PURE__ */ jsx("p", { children: '"Quem tem mais tarefas atribu\xEDdas?"' })
|
|
4204
|
+
] })
|
|
4205
|
+
] }),
|
|
4206
|
+
messages.map((msg) => /* @__PURE__ */ jsxs(
|
|
4207
|
+
"div",
|
|
4208
|
+
{
|
|
4209
|
+
className: cn(
|
|
4210
|
+
"flex flex-col gap-1",
|
|
4211
|
+
msg.role === "user" ? "items-end" : "items-start"
|
|
4212
|
+
),
|
|
4213
|
+
children: [
|
|
4214
|
+
/* @__PURE__ */ jsx(
|
|
4215
|
+
"div",
|
|
4216
|
+
{
|
|
4217
|
+
className: cn(
|
|
4218
|
+
"max-w-[85%] rounded-xl px-3 py-2 text-sm leading-relaxed",
|
|
4219
|
+
msg.role === "user" ? "bg-blue-600/80 text-white" : "bg-white/[0.06] text-white/90 border border-white/5",
|
|
4220
|
+
msg.loading && "animate-pulse"
|
|
4221
|
+
),
|
|
4222
|
+
children: msg.content
|
|
4223
|
+
}
|
|
4224
|
+
),
|
|
4225
|
+
msg.actions && msg.actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-1 space-y-1 max-w-[85%]", children: msg.actions.map((action, i) => /* @__PURE__ */ jsxs(
|
|
4226
|
+
"div",
|
|
4227
|
+
{
|
|
4228
|
+
className: "flex items-center gap-2 rounded-lg bg-white/[0.04] border border-white/5 px-2.5 py-1.5 text-[11px]",
|
|
4229
|
+
children: [
|
|
4230
|
+
/* @__PURE__ */ jsx("span", { className: cn(
|
|
4231
|
+
"h-1.5 w-1.5 rounded-full",
|
|
4232
|
+
action.applied ? "bg-green-400" : "bg-yellow-400"
|
|
4233
|
+
) }),
|
|
4234
|
+
/* @__PURE__ */ jsx("span", { className: "text-white/70", children: action.label })
|
|
4235
|
+
]
|
|
4236
|
+
},
|
|
4237
|
+
i
|
|
4238
|
+
)) }),
|
|
4239
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/30 px-1", children: msg.timestamp.toLocaleTimeString("pt-PT", { hour: "2-digit", minute: "2-digit" }) })
|
|
4240
|
+
]
|
|
4241
|
+
},
|
|
4242
|
+
msg.id
|
|
4243
|
+
)),
|
|
4244
|
+
loading && /* @__PURE__ */ jsx("div", { className: "flex items-start gap-2", children: /* @__PURE__ */ jsx("div", { className: "bg-white/[0.06] rounded-xl px-3 py-2 border border-white/5", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
|
|
4245
|
+
/* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "0ms" } }),
|
|
4246
|
+
/* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "150ms" } }),
|
|
4247
|
+
/* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "300ms" } })
|
|
4248
|
+
] }) }) }),
|
|
4249
|
+
/* @__PURE__ */ jsx("div", { ref: messagesEndRef })
|
|
4250
|
+
] }),
|
|
4251
|
+
/* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "border-t border-white/10 p-3", children: [
|
|
4252
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2 rounded-xl bg-white/[0.04] border border-white/10 px-3 py-2 focus-within:border-blue-500/50 transition-colors", children: [
|
|
4253
|
+
/* @__PURE__ */ jsx(
|
|
4254
|
+
"textarea",
|
|
4255
|
+
{
|
|
4256
|
+
ref: inputRef,
|
|
4257
|
+
value: input,
|
|
4258
|
+
onChange: (e) => setInput(e.target.value),
|
|
4259
|
+
onKeyDown: handleKeyDown,
|
|
4260
|
+
placeholder,
|
|
4261
|
+
rows: 1,
|
|
4262
|
+
className: "flex-1 resize-none bg-transparent text-sm text-white placeholder-white/30 outline-none max-h-32",
|
|
4263
|
+
style: { minHeight: "24px" }
|
|
4264
|
+
}
|
|
4265
|
+
),
|
|
4266
|
+
/* @__PURE__ */ jsx(
|
|
4267
|
+
"button",
|
|
4268
|
+
{
|
|
4269
|
+
type: "submit",
|
|
4270
|
+
disabled: !input.trim() || loading,
|
|
4271
|
+
className: cn(
|
|
4272
|
+
"flex h-7 w-7 items-center justify-center rounded-lg transition-colors",
|
|
4273
|
+
input.trim() && !loading ? "bg-blue-600 text-white hover:bg-blue-500" : "bg-white/5 text-white/20"
|
|
4274
|
+
),
|
|
4275
|
+
children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z" }) })
|
|
4276
|
+
}
|
|
4277
|
+
)
|
|
4278
|
+
] }),
|
|
4279
|
+
/* @__PURE__ */ jsx("p", { className: "mt-1.5 text-[10px] text-white/30 text-center", children: "IA pode cometer erros. Verifique informa\xE7\xF5es importantes." })
|
|
4280
|
+
] })
|
|
4281
|
+
]
|
|
4282
|
+
}
|
|
4283
|
+
)
|
|
4284
|
+
] });
|
|
4285
|
+
}
|
|
4286
|
+
function CommandBar({
|
|
4287
|
+
open,
|
|
4288
|
+
onOpenChange,
|
|
4289
|
+
items,
|
|
4290
|
+
onAiPrompt,
|
|
4291
|
+
aiLoading = false,
|
|
4292
|
+
aiResponse,
|
|
4293
|
+
placeholder = "Escreva um comando ou pergunte \xE0 IA..."
|
|
4294
|
+
}) {
|
|
4295
|
+
const [query, setQuery] = React6.useState("");
|
|
4296
|
+
const [selectedIndex, setSelectedIndex] = React6.useState(0);
|
|
4297
|
+
const inputRef = React6.useRef(null);
|
|
4298
|
+
const filtered = React6.useMemo(() => {
|
|
4299
|
+
if (!query.trim()) return items;
|
|
4300
|
+
const q = query.toLowerCase();
|
|
4301
|
+
return items.filter(
|
|
4302
|
+
(item) => item.label.toLowerCase().includes(q) || item.description?.toLowerCase().includes(q) || item.category?.toLowerCase().includes(q)
|
|
4303
|
+
);
|
|
4304
|
+
}, [items, query]);
|
|
4305
|
+
const grouped = React6.useMemo(() => {
|
|
4306
|
+
const groups = /* @__PURE__ */ new Map();
|
|
4307
|
+
for (const item of filtered) {
|
|
4308
|
+
const cat = item.category || "Geral";
|
|
4309
|
+
if (!groups.has(cat)) groups.set(cat, []);
|
|
4310
|
+
groups.get(cat).push(item);
|
|
4311
|
+
}
|
|
4312
|
+
return groups;
|
|
4313
|
+
}, [filtered]);
|
|
4314
|
+
React6.useEffect(() => {
|
|
4315
|
+
const handler = (e) => {
|
|
4316
|
+
if ((e.metaKey || e.ctrlKey) && e.key === "k") {
|
|
4317
|
+
e.preventDefault();
|
|
4318
|
+
onOpenChange(!open);
|
|
4319
|
+
}
|
|
4320
|
+
if (e.key === "Escape" && open) {
|
|
4321
|
+
onOpenChange(false);
|
|
4322
|
+
}
|
|
4323
|
+
};
|
|
4324
|
+
window.addEventListener("keydown", handler);
|
|
4325
|
+
return () => window.removeEventListener("keydown", handler);
|
|
4326
|
+
}, [open, onOpenChange]);
|
|
4327
|
+
React6.useEffect(() => {
|
|
4328
|
+
if (open) {
|
|
4329
|
+
setQuery("");
|
|
4330
|
+
setSelectedIndex(0);
|
|
4331
|
+
setTimeout(() => inputRef.current?.focus(), 50);
|
|
4332
|
+
}
|
|
4333
|
+
}, [open]);
|
|
4334
|
+
React6.useEffect(() => {
|
|
4335
|
+
setSelectedIndex(0);
|
|
4336
|
+
}, [query]);
|
|
4337
|
+
const flatItems = React6.useMemo(() => {
|
|
4338
|
+
const flat = [];
|
|
4339
|
+
for (const group of grouped.values()) flat.push(...group);
|
|
4340
|
+
return flat;
|
|
4341
|
+
}, [grouped]);
|
|
4342
|
+
const handleKeyDown = (e) => {
|
|
4343
|
+
switch (e.key) {
|
|
4344
|
+
case "ArrowDown":
|
|
4345
|
+
e.preventDefault();
|
|
4346
|
+
setSelectedIndex((i) => Math.min(i + 1, flatItems.length - 1));
|
|
4347
|
+
break;
|
|
4348
|
+
case "ArrowUp":
|
|
4349
|
+
e.preventDefault();
|
|
4350
|
+
setSelectedIndex((i) => Math.max(i - 1, 0));
|
|
4351
|
+
break;
|
|
4352
|
+
case "Enter":
|
|
4353
|
+
e.preventDefault();
|
|
4354
|
+
if (flatItems[selectedIndex]) {
|
|
4355
|
+
flatItems[selectedIndex].onSelect();
|
|
4356
|
+
onOpenChange(false);
|
|
4357
|
+
} else if (query.trim() && onAiPrompt) {
|
|
4358
|
+
onAiPrompt(query.trim());
|
|
4359
|
+
}
|
|
4360
|
+
break;
|
|
3979
4361
|
}
|
|
3980
4362
|
};
|
|
3981
|
-
|
|
3982
|
-
|
|
3983
|
-
|
|
3984
|
-
|
|
3985
|
-
|
|
3986
|
-
"
|
|
3987
|
-
|
|
3988
|
-
|
|
3989
|
-
|
|
3990
|
-
|
|
3991
|
-
|
|
4363
|
+
if (!open) return null;
|
|
4364
|
+
return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-[100] flex items-start justify-center pt-[15vh]", children: [
|
|
4365
|
+
/* @__PURE__ */ jsx(
|
|
4366
|
+
"div",
|
|
4367
|
+
{
|
|
4368
|
+
className: "absolute inset-0 bg-black/60 backdrop-blur-sm",
|
|
4369
|
+
onClick: () => onOpenChange(false)
|
|
4370
|
+
}
|
|
4371
|
+
),
|
|
4372
|
+
/* @__PURE__ */ jsxs("div", { className: "relative w-full max-w-[560px] rounded-2xl border border-white/10 bg-[#0c0c14]/95 backdrop-blur-[60px] shadow-2xl overflow-hidden animate-in fade-in slide-in-from-top-4 duration-200", children: [
|
|
4373
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 border-b border-white/10 px-4 py-3", children: [
|
|
4374
|
+
/* @__PURE__ */ jsxs(
|
|
4375
|
+
"svg",
|
|
3992
4376
|
{
|
|
3993
|
-
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
4377
|
+
width: "18",
|
|
4378
|
+
height: "18",
|
|
4379
|
+
viewBox: "0 0 24 24",
|
|
4380
|
+
fill: "none",
|
|
4381
|
+
stroke: "currentColor",
|
|
4382
|
+
strokeWidth: "2",
|
|
4383
|
+
className: "text-white/40 shrink-0",
|
|
4384
|
+
children: [
|
|
4385
|
+
/* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "8" }),
|
|
4386
|
+
/* @__PURE__ */ jsx("path", { d: "M21 21l-4.35-4.35" })
|
|
4387
|
+
]
|
|
3997
4388
|
}
|
|
3998
|
-
)
|
|
3999
|
-
|
|
4000
|
-
|
|
4001
|
-
|
|
4002
|
-
|
|
4003
|
-
|
|
4004
|
-
|
|
4005
|
-
|
|
4006
|
-
|
|
4007
|
-
|
|
4008
|
-
|
|
4009
|
-
|
|
4010
|
-
|
|
4011
|
-
|
|
4012
|
-
|
|
4013
|
-
|
|
4014
|
-
|
|
4015
|
-
|
|
4016
|
-
|
|
4017
|
-
|
|
4018
|
-
|
|
4019
|
-
|
|
4020
|
-
|
|
4021
|
-
|
|
4022
|
-
|
|
4023
|
-
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
isMobile: false,
|
|
4027
|
-
mentionUsers: stableWorkspaceMembers,
|
|
4028
|
-
mentionProjects: MOCK_PROJECTS,
|
|
4029
|
-
hasMore: chat.hasMoreMessages,
|
|
4030
|
-
onLoadMore: chat.loadMoreMessages,
|
|
4031
|
-
loadingMore: chat.loadingMoreMessages
|
|
4032
|
-
}
|
|
4033
|
-
) }),
|
|
4034
|
-
managementOpen && activeRoom && /* @__PURE__ */ jsx("div", { className: "w-[300px] shrink-0 border-l border-theme-subtle bg-theme-glass", children: /* @__PURE__ */ jsx(
|
|
4035
|
-
RoomManagementPanel,
|
|
4389
|
+
),
|
|
4390
|
+
/* @__PURE__ */ jsx(
|
|
4391
|
+
"input",
|
|
4392
|
+
{
|
|
4393
|
+
ref: inputRef,
|
|
4394
|
+
value: query,
|
|
4395
|
+
onChange: (e) => setQuery(e.target.value),
|
|
4396
|
+
onKeyDown: handleKeyDown,
|
|
4397
|
+
placeholder,
|
|
4398
|
+
className: "flex-1 bg-transparent text-sm text-white placeholder-white/30 outline-none"
|
|
4399
|
+
}
|
|
4400
|
+
),
|
|
4401
|
+
query && /* @__PURE__ */ jsx(
|
|
4402
|
+
"button",
|
|
4403
|
+
{
|
|
4404
|
+
onClick: () => setQuery(""),
|
|
4405
|
+
className: "text-white/30 hover:text-white/60 transition-colors",
|
|
4406
|
+
children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" }) })
|
|
4407
|
+
}
|
|
4408
|
+
),
|
|
4409
|
+
/* @__PURE__ */ jsx("kbd", { className: "hidden sm:inline-flex h-5 items-center rounded border border-white/10 bg-white/5 px-1.5 text-[10px] text-white/30", children: "ESC" })
|
|
4410
|
+
] }),
|
|
4411
|
+
/* @__PURE__ */ jsx("div", { className: "max-h-[320px] overflow-y-auto py-2", children: flatItems.length > 0 ? Array.from(grouped.entries()).map(([category, groupItems]) => /* @__PURE__ */ jsxs("div", { children: [
|
|
4412
|
+
/* @__PURE__ */ jsx("div", { className: "px-4 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-white/30", children: category }),
|
|
4413
|
+
groupItems.map((item) => {
|
|
4414
|
+
const globalIdx = flatItems.indexOf(item);
|
|
4415
|
+
return /* @__PURE__ */ jsxs(
|
|
4416
|
+
"button",
|
|
4036
4417
|
{
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
|
|
4040
|
-
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4044
|
-
|
|
4045
|
-
|
|
4046
|
-
|
|
4047
|
-
|
|
4048
|
-
|
|
4418
|
+
onClick: () => {
|
|
4419
|
+
item.onSelect();
|
|
4420
|
+
onOpenChange(false);
|
|
4421
|
+
},
|
|
4422
|
+
onMouseEnter: () => setSelectedIndex(globalIdx),
|
|
4423
|
+
className: cn(
|
|
4424
|
+
"flex w-full items-center gap-3 px-4 py-2.5 text-left transition-colors",
|
|
4425
|
+
globalIdx === selectedIndex ? "bg-white/[0.08] text-white" : "text-white/70 hover:bg-white/[0.04]"
|
|
4426
|
+
),
|
|
4427
|
+
children: [
|
|
4428
|
+
item.icon && /* @__PURE__ */ jsx("span", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-white/[0.06] text-white/60", children: item.icon }),
|
|
4429
|
+
/* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
|
|
4430
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium truncate", children: item.label }),
|
|
4431
|
+
item.description && /* @__PURE__ */ jsx("p", { className: "text-[11px] text-white/40 truncate", children: item.description })
|
|
4432
|
+
] }),
|
|
4433
|
+
item.shortcut && /* @__PURE__ */ jsx("kbd", { className: "text-[10px] text-white/30 border border-white/10 rounded px-1.5 py-0.5 bg-white/5", children: item.shortcut })
|
|
4434
|
+
]
|
|
4435
|
+
},
|
|
4436
|
+
item.id
|
|
4437
|
+
);
|
|
4438
|
+
})
|
|
4439
|
+
] }, category)) : query.trim() ? /* @__PURE__ */ jsx("div", { className: "px-4 py-6 text-center", children: onAiPrompt ? /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
|
|
4440
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm text-white/50", children: "Nenhum comando encontrado" }),
|
|
4441
|
+
/* @__PURE__ */ jsxs(
|
|
4442
|
+
"button",
|
|
4443
|
+
{
|
|
4444
|
+
onClick: () => {
|
|
4445
|
+
onAiPrompt(query.trim());
|
|
4446
|
+
},
|
|
4447
|
+
className: "inline-flex items-center gap-2 rounded-lg bg-blue-600/20 border border-blue-500/30 px-3 py-1.5 text-sm text-blue-400 hover:bg-blue-600/30 transition-colors",
|
|
4448
|
+
children: [
|
|
4449
|
+
/* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsx("path", { d: "M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z" }) }),
|
|
4450
|
+
'Perguntar \xE0 IA: "',
|
|
4451
|
+
query,
|
|
4452
|
+
'"'
|
|
4453
|
+
]
|
|
4454
|
+
}
|
|
4455
|
+
)
|
|
4456
|
+
] }) : /* @__PURE__ */ jsx("p", { className: "text-sm text-white/50", children: "Nenhum resultado encontrado" }) }) : /* @__PURE__ */ jsx("div", { className: "px-4 py-4 text-center text-sm text-white/40", children: "Comece a escrever para pesquisar..." }) }),
|
|
4457
|
+
(aiLoading || aiResponse) && /* @__PURE__ */ jsx("div", { className: "border-t border-white/10 px-4 py-3", children: aiLoading ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-white/50", children: [
|
|
4458
|
+
/* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
|
|
4459
|
+
/* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "0ms" } }),
|
|
4460
|
+
/* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "150ms" } }),
|
|
4461
|
+
/* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-blue-400 animate-bounce", style: { animationDelay: "300ms" } })
|
|
4049
4462
|
] }),
|
|
4050
|
-
|
|
4051
|
-
|
|
4052
|
-
|
|
4053
|
-
|
|
4054
|
-
|
|
4055
|
-
|
|
4056
|
-
|
|
4057
|
-
|
|
4058
|
-
|
|
4059
|
-
|
|
4060
|
-
|
|
4061
|
-
|
|
4062
|
-
|
|
4463
|
+
"A pensar..."
|
|
4464
|
+
] }) : aiResponse ? /* @__PURE__ */ jsx("p", { className: "text-sm text-white/80 leading-relaxed", children: aiResponse }) : null }),
|
|
4465
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-t border-white/10 px-4 py-2 text-[10px] text-white/25", children: [
|
|
4466
|
+
/* @__PURE__ */ jsx("span", { children: "\u2191\u2193 navegar \xB7 Enter selecionar \xB7 Esc fechar" }),
|
|
4467
|
+
/* @__PURE__ */ jsx("span", { children: "\u2318K para abrir" })
|
|
4468
|
+
] })
|
|
4469
|
+
] })
|
|
4470
|
+
] });
|
|
4471
|
+
}
|
|
4472
|
+
function InlineAiButton({
|
|
4473
|
+
onTrigger,
|
|
4474
|
+
loading = false,
|
|
4475
|
+
suggestion,
|
|
4476
|
+
onAccept,
|
|
4477
|
+
onDismiss,
|
|
4478
|
+
size = "sm",
|
|
4479
|
+
className
|
|
4480
|
+
}) {
|
|
4481
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("relative inline-flex flex-col", className), children: [
|
|
4482
|
+
/* @__PURE__ */ jsxs(
|
|
4483
|
+
"button",
|
|
4484
|
+
{
|
|
4485
|
+
type: "button",
|
|
4486
|
+
onClick: () => onTrigger(),
|
|
4487
|
+
disabled: loading,
|
|
4488
|
+
className: cn(
|
|
4489
|
+
"inline-flex items-center gap-1 rounded-md border border-white/10 bg-white/[0.04] text-white/50 hover:bg-white/[0.08] hover:text-white/80 hover:border-blue-500/30 transition-all",
|
|
4490
|
+
size === "sm" ? "px-1.5 py-0.5 text-[10px]" : "px-2 py-1 text-xs",
|
|
4491
|
+
loading && "animate-pulse"
|
|
4492
|
+
),
|
|
4493
|
+
title: "Assistente IA (Alt+I)",
|
|
4494
|
+
children: [
|
|
4495
|
+
/* @__PURE__ */ jsx(
|
|
4496
|
+
"svg",
|
|
4063
4497
|
{
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
onEditMessage: chat.editMessage,
|
|
4072
|
-
onDeleteMessage: chat.deleteMessage,
|
|
4073
|
-
onReactToMessage: chat.reactToMessage,
|
|
4074
|
-
onTyping: chat.sendTyping,
|
|
4075
|
-
onStopTyping: chat.sendTyping,
|
|
4076
|
-
onOpenManagement: handleOpenManagement,
|
|
4077
|
-
onBack: handleBackToSidebar,
|
|
4078
|
-
isMobile: true,
|
|
4079
|
-
mentionUsers: stableWorkspaceMembers,
|
|
4080
|
-
mentionProjects: MOCK_PROJECTS,
|
|
4081
|
-
hasMore: chat.hasMoreMessages,
|
|
4082
|
-
onLoadMore: chat.loadMoreMessages,
|
|
4083
|
-
loadingMore: chat.loadingMoreMessages
|
|
4498
|
+
width: size === "sm" ? 10 : 12,
|
|
4499
|
+
height: size === "sm" ? 10 : 12,
|
|
4500
|
+
viewBox: "0 0 24 24",
|
|
4501
|
+
fill: "none",
|
|
4502
|
+
stroke: "currentColor",
|
|
4503
|
+
strokeWidth: "2",
|
|
4504
|
+
children: /* @__PURE__ */ jsx("path", { d: "M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z" })
|
|
4084
4505
|
}
|
|
4085
|
-
)
|
|
4086
|
-
|
|
4087
|
-
|
|
4088
|
-
|
|
4089
|
-
|
|
4090
|
-
|
|
4091
|
-
|
|
4092
|
-
|
|
4093
|
-
|
|
4094
|
-
|
|
4095
|
-
|
|
4096
|
-
|
|
4097
|
-
room: activeRoom,
|
|
4098
|
-
members: chat.roomMembers,
|
|
4099
|
-
currentUserId: userId,
|
|
4100
|
-
permissions: chat.permissions,
|
|
4101
|
-
onClose: handleCloseManagement,
|
|
4102
|
-
onUpdateRoom: chat.updateRoom,
|
|
4103
|
-
onArchiveRoom: chat.archiveRoom,
|
|
4104
|
-
onLeaveRoom: chat.leaveRoom,
|
|
4105
|
-
onRemoveMember: chat.removeMember,
|
|
4106
|
-
onUpdateMemberRole: chat.updateMemberRole
|
|
4107
|
-
}
|
|
4108
|
-
) })
|
|
4109
|
-
] })
|
|
4110
|
-
] }),
|
|
4506
|
+
),
|
|
4507
|
+
loading ? "A pensar..." : "IA"
|
|
4508
|
+
]
|
|
4509
|
+
}
|
|
4510
|
+
),
|
|
4511
|
+
suggestion && /* @__PURE__ */ jsxs("div", { className: "absolute top-full left-0 z-50 mt-1.5 w-72 rounded-xl border border-white/10 bg-[#0c0c14]/95 backdrop-blur-[40px] shadow-xl p-3 animate-in fade-in slide-in-from-top-2 duration-200", children: [
|
|
4512
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mb-2", children: [
|
|
4513
|
+
/* @__PURE__ */ jsx("div", { className: "h-4 w-4 rounded bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center", children: /* @__PURE__ */ jsx("svg", { width: "8", height: "8", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "3", children: /* @__PURE__ */ jsx("path", { d: "M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25" }) }) }),
|
|
4514
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10px] font-medium text-white/50 uppercase tracking-wider", children: "Sugest\xE3o IA" })
|
|
4515
|
+
] }),
|
|
4516
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm text-white/80 leading-relaxed mb-3", children: suggestion }),
|
|
4517
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
4111
4518
|
/* @__PURE__ */ jsx(
|
|
4112
|
-
|
|
4519
|
+
"button",
|
|
4113
4520
|
{
|
|
4114
|
-
|
|
4115
|
-
|
|
4116
|
-
|
|
4117
|
-
|
|
4118
|
-
|
|
4119
|
-
|
|
4120
|
-
|
|
4121
|
-
|
|
4122
|
-
|
|
4123
|
-
|
|
4124
|
-
|
|
4125
|
-
return room;
|
|
4126
|
-
},
|
|
4127
|
-
onCreateDM: async (targetUserId) => {
|
|
4128
|
-
const room = await chat.createDirectMessage(targetUserId);
|
|
4129
|
-
if (room) chat.selectRoom(room.id);
|
|
4130
|
-
return room;
|
|
4131
|
-
},
|
|
4132
|
-
workspaceMembers: stableWorkspaceMembers
|
|
4521
|
+
onClick: () => onAccept?.(suggestion),
|
|
4522
|
+
className: "flex-1 rounded-lg bg-blue-600/80 px-2 py-1.5 text-xs font-medium text-white hover:bg-blue-500 transition-colors",
|
|
4523
|
+
children: "Aceitar"
|
|
4524
|
+
}
|
|
4525
|
+
),
|
|
4526
|
+
/* @__PURE__ */ jsx(
|
|
4527
|
+
"button",
|
|
4528
|
+
{
|
|
4529
|
+
onClick: onDismiss,
|
|
4530
|
+
className: "flex-1 rounded-lg bg-white/[0.06] px-2 py-1.5 text-xs text-white/50 hover:bg-white/10 hover:text-white/70 transition-colors",
|
|
4531
|
+
children: "Descartar"
|
|
4133
4532
|
}
|
|
4134
4533
|
)
|
|
4135
|
-
]
|
|
4136
|
-
}
|
|
4534
|
+
] })
|
|
4535
|
+
] })
|
|
4536
|
+
] });
|
|
4537
|
+
}
|
|
4538
|
+
function useAiInline({ gatewayUrl, workspaceId, projectId }) {
|
|
4539
|
+
const [loading, setLoading] = React6.useState(false);
|
|
4540
|
+
const [suggestion, setSuggestion] = React6.useState();
|
|
4541
|
+
const requestSuggestion = React6.useCallback(
|
|
4542
|
+
async (context, fieldType) => {
|
|
4543
|
+
setLoading(true);
|
|
4544
|
+
setSuggestion(void 0);
|
|
4545
|
+
try {
|
|
4546
|
+
const res = await fetch(`${gatewayUrl}/api/ai/suggest`, {
|
|
4547
|
+
method: "POST",
|
|
4548
|
+
headers: { "Content-Type": "application/json" },
|
|
4549
|
+
credentials: "include",
|
|
4550
|
+
body: JSON.stringify({
|
|
4551
|
+
prompt: context,
|
|
4552
|
+
workspaceId,
|
|
4553
|
+
projectId,
|
|
4554
|
+
context: { fieldType }
|
|
4555
|
+
})
|
|
4556
|
+
});
|
|
4557
|
+
if (!res.ok) throw new Error("AI request failed");
|
|
4558
|
+
const data = await res.json();
|
|
4559
|
+
setSuggestion(data.suggestion || data.response || data.message);
|
|
4560
|
+
} catch (err) {
|
|
4561
|
+
console.error("AI inline error:", err);
|
|
4562
|
+
setSuggestion(void 0);
|
|
4563
|
+
} finally {
|
|
4564
|
+
setLoading(false);
|
|
4565
|
+
}
|
|
4566
|
+
},
|
|
4567
|
+
[gatewayUrl, workspaceId, projectId]
|
|
4137
4568
|
);
|
|
4569
|
+
const dismiss = React6.useCallback(() => setSuggestion(void 0), []);
|
|
4570
|
+
return { loading, suggestion, requestSuggestion, dismiss };
|
|
4138
4571
|
}
|
|
4139
4572
|
|
|
4140
|
-
export { Alert, Button, ChatMessages, ChatSidebar, CreateRoomDialog, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, Input, Label, MOCK_PROJECTS, MOCK_USERS, MentionPopover, MessageBubble, MessageInput, OrgLoader, OrgLoaderInline, OrganifyChat, ResponsiveDialog, RoomManagementPanel, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TypingIndicatorMock, alertVariants, buttonVariants, generateAutoReplies, getMockMentionOptions, getRoomPermissions, inputVariants, orgLoaderVariants, typingIndicator, useChat };
|
|
4141
|
-
//# sourceMappingURL=chunk-
|
|
4142
|
-
//# sourceMappingURL=chunk-
|
|
4573
|
+
export { AiChatSidebar, Alert, Button, ChatMessages, ChatSidebar, CommandBar, CreateRoomDialog, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, InlineAiButton, Input, Label, MOCK_PROJECTS, MOCK_USERS, MentionPopover, MessageBubble, MessageInput, OrgLoader, OrgLoaderInline, OrganifyChat, ResponsiveDialog, RoomManagementPanel, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TypingIndicatorMock, alertVariants, buttonVariants, generateAutoReplies, getMockMentionOptions, getRoomPermissions, inputVariants, orgLoaderVariants, typingIndicator, useAiInline, useChat };
|
|
4574
|
+
//# sourceMappingURL=chunk-NUA6OPJV.js.map
|
|
4575
|
+
//# sourceMappingURL=chunk-NUA6OPJV.js.map
|