4f:I[707087,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"RegistryDependencies"] 50:I[512940,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"Installation"] 51:I[314491,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"FilesView"] 52:T140c,"use client"; import { Card } from "@/components/ui/card"; import { useState } from "react"; import { Sheet, SheetClose, SheetContent } from "@/components/ui/sheet"; import ChatListing from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-listing"; import ChatContent from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-content"; import ChatMsgSent from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-msgsent"; import { Separator } from "@/components/ui/separator"; import { X } from 'lucide-react'; import { chatData as initialChatData } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/data"; import { Chat, CURRENT_USER_ID } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; const ApplicationShell01 = () => { const [isOpenChat, setIsOpenChat] = useState(false); const [chatData, setChatData] = useState(initialChatData); const [chatSearch, setChatSearch] = useState(""); const [activeChatId, setActiveChatId] = useState( initialChatData[0]?.id ?? null ); const selectedChat = chatData.find((chat) => chat.id === activeChatId) ?? null; const handleSelectChat = (chat: Chat) => { setActiveChatId(chat.id); setIsOpenChat(false); }; const handleSendMessage = (chatId: number, message: string) => { setChatData((prev) => prev.map((chat) => chat.id === chatId ? { ...chat, messages: [ ...chat.messages, { id: chat.messages.length + 1, senderId: CURRENT_USER_ID, msg: message, type: "text" as const, createdAt: new Date(), attachment: [], }, ], } : chat ) ); }; return (

{/* ------------------------------------------- */} {/* Left Part */} {/* ------------------------------------------- */} boolean) ) => setIsOpenChat(open)} >

{/* ------------------------------------------- */} {/* Right part */} {/* ------------------------------------------- */}

setIsOpenChat(true)} />

) } export default ApplicationShell01 53:T1ce0,import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, } from "@/components/ui/dropdown-menu"; import React from "react"; import { last } from "lodash"; import { formatDistanceToNowStrict } from "date-fns"; import SimpleBar from "simplebar-react"; import "simplebar-react/dist/simplebar.min.css"; import { cn } from "@/lib/utils"; import { AlignHorizontalSpaceAround, ChevronDown, EllipsisVertical, Keyboard, LogOut, SearchIcon } from "lucide-react"; import { Input } from "@/components/ui/input"; import { Chat, CURRENT_USER_ID } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; import { Settings, CircleQuestionMark } from 'lucide-react'; type Props = { chatData: Chat[]; chatSearch: string; setChatSearch: (value: string) => void; activeChatId: number | null; onSelectChat: (chat: Chat) => void; }; const ChatListing = ({ chatData, chatSearch, setChatSearch, activeChatId, onSelectChat, }: Props) => { const DropdownAction = [ { icon: Settings, listtitle: "Setting", divider: true, }, { icon: CircleQuestionMark, listtitle: "Help and feedback", divider: false, }, { icon: AlignHorizontalSpaceAround, listtitle: "Enable split View mode", divider: false, }, { icon: Keyboard, listtitle: "Keyboard shortcut", divider: true, }, { icon: LogOut, listtitle: "Sign Out", divider: false, }, ]; const lastActivity = (chat: Chat) => last(chat.messages)?.createdAt; const getDetails = (conversation: Chat) => { let displayText = ""; const lastMessage = conversation.messages[conversation.messages.length - 1]; if (lastMessage) { const sender = lastMessage.senderId === CURRENT_USER_ID ? "You: " : ""; const message = lastMessage.type === "image" ? "Sent a photo" : lastMessage.msg; displayText = `${sender}${message}`; } return displayText; }; const filteredChats = chatData.filter((chat) => chat.name.toLowerCase().includes(chatSearch.toLowerCase()) ); return ( <>

{/* Header */}

Cameron

Designer

{/* ShadCN Dropdown */} {DropdownAction.map((item, index) => ( {item.listtitle} {item.divider && } ))}

{/* Search Box */}

setChatSearch(e.target.value)} placeholder="Search Chats..." />

{/* Sorting Dropdown (Also converted to ShadCN) */}

}> Recent Chats Sort by Time Sort by Unread Sort by Favourites

{/* Chat Listing */} {filteredChats.map((chat) => (

onSelectChat(chat)} >

{chat.name}

{getDetails(chat)}

{formatDistanceToNowStrict(new Date(lastActivity(chat)!), { addSuffix: false, }) .replace(/minutes?/, "mins") .replace(/hours?/, "hrs") .replace(/seconds?/, "secs")}

))}

); }; export default ChatListing; 54:T2350,"use client"; import React, { useState, Activity } from "react"; import { Button } from "@/components/ui/button"; import SimpleBar from "simplebar-react"; import "simplebar-react/dist/simplebar.min.css"; import { Menu, Phone, Video } from 'lucide-react'; import { formatDistanceToNowStrict } from "date-fns"; import { Sheet, SheetContent } from "@/components/ui/sheet"; import { Chat, ChatMessage } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; import ChatInsideSidebar from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chatinside-sidebar"; import { Separator } from "@/components/ui/separator"; import { cn } from "@/lib/utils"; type Props = { selectedChat: Chat | null; onClickMobile: (event: React.MouseEvent) => void; }; const ChatContent = ({ selectedChat, onClickMobile }: Props) => { const [isRightSide, setIsRightSide] = useState(true); const handleButtonClick = () => { setIsRightSide(!isRightSide); }; const handleClose = () => setIsOpenMedia(false); const [isOpenMedia, setIsOpenMedia] = useState(false); return ( <>

{selectedChat ? (

{selectedChat.name}

{selectedChat.status}

setIsOpenMedia(true)} >

) : null}

{/* Chat messages scroll container */}

{selectedChat?.messages?.map((msg: ChatMessage) => (

{selectedChat.id === msg.senderId ? (

{msg.type === "text" ? (

{selectedChat.name},{" "} {formatDistanceToNowStrict( new Date(msg.createdAt || new Date()), { addSuffix: false, } )}{" "} ago

{msg.msg}

) : null} {msg.type === "image" ? ( user

) : null}

) : (

{msg.createdAt ? (

{formatDistanceToNowStrict( new Date(msg.createdAt), { addSuffix: false, } )}{" "} ago

) : null} {msg.type === "text" ? (

{msg.msg}

) : null} {msg.type === "image" ? ( user

) : null}

)}

))}

); }; export default ChatContent; 55:Tab7,"use client"; import { Input } from "@/components/ui/input"; import React, { ChangeEvent, SubmitEvent, useState } from "react"; import { Send, Smile, Image, Paperclip, Mic } from 'lucide-react'; import { Chat } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; type Props = { selectedChat: Chat | null; onSendMessage: (chatId: number, message: string) => void; }; const ChatMsgSent = ({ selectedChat, onSendMessage }: Props) => { const [msg, setMsg] = useState(""); const handleChatMsgChange = (e: ChangeEvent) => { setMsg(e.target.value); }; const onChatMsgSubmit = (e: SubmitEvent) => { e.preventDefault(); if (!msg.trim() || !selectedChat) return; onSendMessage(selectedChat.id, msg.trim()); setMsg(""); }; return ( <> ); }; export default ChatMsgSent; 56:Te47,import React from "react"; import { uniq, flatten } from "lodash"; import SimpleBar from "simplebar-react"; import "simplebar-react/dist/simplebar.min.css"; import { Download } from 'lucide-react'; import { Chat } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; type Props = { selectedChat: Chat | null; }; const ChatInsideSidebar = ({ selectedChat }: Props) => { const totalAttachment = uniq( flatten(selectedChat?.messages.map((item) => item.attachment)) ).length; const totalMedia = uniq( flatten( selectedChat?.messages.map((item) => item?.type === "image" ? item.msg : null ) ) ).length - 1; return ( <>

{/* Media */}

Media ({totalMedia})

<> {selectedChat?.messages.map((c, index) => { return (

{c?.type === "image" ? (

) : null}

); })}

{/* Files */}

Attachments ({totalAttachment})

{selectedChat?.messages.map((c, index) => { return (

{c?.attachment?.map((a, index) => { return (

{a.file}

{a.fileSize}

); })}

); }; export default ChatInsideSidebar; 57:T3fe5,import { sub } from "date-fns"; import { Chat, CURRENT_USER_ID } from "@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types"; export const chatData: Chat[] = [ { id: 1, name: "James Johnson", status: "online", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-5.webp", excerpt: "Theme Developer", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Hey James, can you share the latest files for the service task?", type: "text", createdAt: sub(new Date(), { hours: 1 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-chrome.svg", file: "homepage-design.fig", fileSize: "3MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-figma.svg", file: "about-us.html", fileSize: "1KB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "Also let me know once the homepage design review is done, no rush.", type: "text", createdAt: sub(new Date(), { minutes: 30 }), attachment: [], }, { id: 3, senderId: 1, msg: "Sure, sending it over in a minute.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, { id: 4, senderId: 1, msg: "https://images.shadcnspace.com/assets/blog/blog-img1.jpg", type: "image", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, { id: 5, senderId: CURRENT_USER_ID, msg: "Looks great, thanks!", type: "text", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, ], }, { id: 2, name: "Maria Hernandez", status: "away", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-9.webp", excerpt: "Doctor", messages: [ { id: 1, senderId: 2, msg: "Hi, I've attached the reports you asked for.", type: "text", createdAt: sub(new Date(), { hours: 1 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-chrome.svg", file: "homepage-design.fig", fileSize: "3MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: 2, msg: "Let me know if anything else is needed before the appointment.", type: "text", createdAt: sub(new Date(), { minutes: 30 }), attachment: [], }, { id: 3, senderId: CURRENT_USER_ID, msg: "Got it, thank you Maria.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, { id: 4, senderId: CURRENT_USER_ID, msg: "https://images.shadcnspace.com/assets/blog/blog-img1.jpg", type: "image", createdAt: sub(new Date(), { minutes: 2 }), attachment: [], }, { id: 5, senderId: 2, msg: "Perfect, see you then!", type: "text", createdAt: sub(new Date(), { minutes: 1 }), attachment: [], }, ], }, { id: 3, name: "David Smith", status: "busy", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-3.webp", excerpt: "Hacker", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "David, can you review the security patch today?", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "It's a bit urgent, client is asking for an update.", type: "text", createdAt: sub(new Date(), { minutes: 30 }), attachment: [], }, { id: 3, senderId: 3, msg: "On it, will get back to you shortly.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, { id: 4, senderId: 3, msg: "Patch reviewed, looks good to deploy.", type: "text", createdAt: sub(new Date(), { minutes: 2 }), attachment: [], }, ], }, { id: 4, name: "Maria Rodriguez", status: "offline", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-2.webp", excerpt: "Please wait outside of the house", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Hi Maria, are we still on for the delivery today?", type: "text", createdAt: sub(new Date(), { hours: 11 }), attachment: [], }, { id: 2, senderId: 4, msg: "Yes, here are the project files.", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 3, senderId: CURRENT_USER_ID, msg: "https://images.shadcnspace.com/assets/blog/blog-img1.jpg", type: "image", createdAt: sub(new Date(), { hours: 1 }), attachment: [], }, { id: 4, senderId: 4, msg: "Thanks, please leave it by the front desk.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, { id: 5, senderId: 4, msg: "Will let you know once it's picked up.", type: "text", createdAt: sub(new Date(), { minutes: 1 }), attachment: [], }, ], }, { id: 5, name: "Robert Smith", status: "online", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-5.webp", excerpt: "Front End Developer", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Robert, could you push the latest UI changes?", type: "text", createdAt: sub(new Date(), { hours: 1 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-chrome.svg", file: "homepage-design.fig", fileSize: "3MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-figma.svg", file: "about-us.html", fileSize: "1KB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "Also check the responsive layout on smaller screens.", type: "text", createdAt: sub(new Date(), { minutes: 30 }), attachment: [], }, { id: 3, senderId: 5, msg: "Pushed already, take a look.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, { id: 4, senderId: 5, msg: "https://images.shadcnspace.com/assets/blog/blog-img1.jpg", type: "image", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, { id: 5, senderId: 5, msg: "Let me know if it needs more tweaks.", type: "text", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, ], }, { id: 6, name: "Joseph Sarah", status: "busy", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-10.webp", excerpt: "Graphics Designer", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Joseph, the client loved the new mockups.", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-chrome.svg", file: "homepage-design.fig", fileSize: "3MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "https://images.shadcnspace.com/assets/blog/blog-img1.jpg", type: "image", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, { id: 3, senderId: 6, msg: "Glad to hear that, thanks!", type: "text", createdAt: sub(new Date(), { minutes: 2 }), attachment: [], }, ], }, { id: 7, name: "Thomas Smith", status: "away", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-8.webp", excerpt: "Back End Developer", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Thomas, the API is throwing a 500 on checkout.", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-chrome.svg", file: "homepage-design.fig", fileSize: "3MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "Can you take a look when you get a chance?", type: "text", createdAt: sub(new Date(), { hours: 1 }), attachment: [], }, { id: 3, senderId: 7, msg: "Looking into it now.", type: "text", createdAt: sub(new Date(), { minutes: 15 }), attachment: [], }, { id: 4, senderId: 7, msg: "Found it, a migration was missing. Fixing now.", type: "text", createdAt: sub(new Date(), { minutes: 10 }), attachment: [], }, ], }, { id: 8, name: "David Elizabeth", status: "offline", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-3.webp", excerpt: "Theme Developer", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "David, the new theme is ready for review.", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: 8, msg: "Awesome, checking it now.", type: "text", createdAt: sub(new Date(), { hours: 6 }), attachment: [], }, { id: 3, senderId: CURRENT_USER_ID, msg: "Take your time, no rush.", type: "text", createdAt: sub(new Date(), { hours: 6 }), attachment: [], }, { id: 4, senderId: 8, msg: "Reviewed, just a couple of small tweaks needed.", type: "text", createdAt: sub(new Date(), { minutes: 1 }), attachment: [], }, ], }, { id: 9, name: "Charles Martha", status: "online", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-4.webp", excerpt: "Administrator", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Charles, can you grant access to the new hire?", type: "text", createdAt: sub(new Date(), { hours: 10 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-javascript.svg", file: "work-project.zip", fileSize: "20MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: CURRENT_USER_ID, msg: "They start Monday.", type: "text", createdAt: sub(new Date(), { hours: 8 }), attachment: [], }, { id: 3, senderId: 9, msg: "Sure, setting it up now.", type: "text", createdAt: sub(new Date(), { minutes: 5 }), attachment: [], }, { id: 4, senderId: 9, msg: "Done, access granted.", type: "text", createdAt: sub(new Date(), { minutes: 2 }), attachment: [], }, ], }, { id: 10, name: "Samuel Eliza", status: "online", thumb: "https://images.shadcnspace.com/assets/shadcn-dashboard/profile/user-5.webp", excerpt: "Doctor", messages: [ { id: 1, senderId: CURRENT_USER_ID, msg: "Samuel, sending over the patient records.", type: "text", createdAt: sub(new Date(), { hours: 11 }), attachment: [ { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-adobe.svg", file: "service-task.pdf", fileSize: "2MB" }, { icon: "https://images.shadcnspace.com/assets/shadcn-dashboard/icon/icon-zip-folder.svg", file: "custom.js", fileSize: "2MB" }, ], }, { id: 2, senderId: 10, msg: "Received, thank you.", type: "text", createdAt: sub(new Date(), { hours: 6 }), attachment: [], }, { id: 3, senderId: 10, msg: "Scheduling the follow-up for next week.", type: "text", createdAt: sub(new Date(), { hours: 6 }), attachment: [], }, { id: 4, senderId: 10, msg: "Let me know if that time works for you.", type: "text", createdAt: sub(new Date(), { minutes: 6 }), attachment: [], }, ], }, ]; 4b:["$","div",null,{"className":"flex flex-col gap-12","children":[["$","div",null,{"className":"pt-10 flex flex-col gap-4","children":[["$","ul",null,{"className":"flex gap-2 flex-wrap","children":[["$","li","lucide-react",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"lucide-react"}]]}]}],["$","li","simplebar-react",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/simplebar-react","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"simplebar-react"}]]}]}],["$","li","date-fns",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/date-fns","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"date-fns"}]]}]}],["$","li","lodash",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/lodash","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"lodash"}]]}]}]]}],["$","$L4f",null,{"registryDependencies":["card","sheet","separator","dropdown-menu","input","button"]}]]}],["$","$L50",null,{"sourceUrl":"https://shadcndashboard.dev/r/application-shell-01.json","proxyUrl":"https://shadcnregistry.com/r/shadcn-dashboard/application-shell-01","itemId":"@shadcn-dashboard/application-shell-01"}],["$","section",null,{"className":"flex flex-col gap-4","id":"files","children":[["$","h2",null,{"className":"text-lg md:text-2xl font-bold font-mono","children":"Files"}],["$","$L51",null,{"files":[{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/page.tsx","content":"import ApplicationShell01 from \"@/components/shadcn-dashboard/blocks/application-shell/application-shell-01/index\";\r\n\r\nexport default function page() {\r\n return (\r\n \r\n );\r\n}\r\n","type":"registry:page","target":"app/application-shell-01/page.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/index.tsx","content":"$52","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/index.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-listing.tsx","content":"$53","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-listing.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-content.tsx","content":"$54","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-content.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-msgsent.tsx","content":"$55","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/chat-msgsent.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/chatinside-sidebar.tsx","content":"$56","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/chatinside-sidebar.tsx"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/data.ts","content":"$57","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/data.ts"},{"path":"src/components/shadcn-dashboard/blocks/application-shell/application-shell-01/types.ts","content":"export type ChatStatus = \"online\" | \"offline\" | \"busy\" | \"away\";\r\n\r\nexport type MessageAttachment = {\r\n icon: string;\r\n file: string;\r\n fileSize: string;\r\n};\r\n\r\nexport type ChatMessage = {\r\n id: number;\r\n senderId: number;\r\n msg: string;\r\n type: \"text\" | \"image\";\r\n createdAt: Date;\r\n attachment: MessageAttachment[];\r\n};\r\n\r\nexport type Chat = {\r\n id: number;\r\n name: string;\r\n status: ChatStatus;\r\n thumb: string;\r\n excerpt: string;\r\n messages: ChatMessage[];\r\n};\r\n\r\n// Id used for the current logged-in user (\"Cameron\") when sending a message.\r\nexport const CURRENT_USER_ID = 0;\r\n","type":"registry:component","target":"components/shadcn-dashboard/blocks/application-shell/application-shell-01/types.ts"}]}]]}],"$L58"]}]

Chat Application Shell 01

Installation

Files

app

components

Styles