@satek-team-intern/chatbot-widget 0.10.4 → 0.10.6
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/chatbot-widget.es.js +841 -827
- package/dist/chatbot-widget.umd.js +7 -7
- package/dist/src/components/modals/UpdateGroup.d.ts +0 -3
- package/dist/src/components/shared/AvatarFallBack.d.ts +5 -0
- package/dist/src/components/shared/index.d.ts +1 -1
- package/dist/src/components/sidebar/ChatList.d.ts +1 -4
- package/dist/src/components/view/ChatListItem.d.ts +9 -0
- package/dist/src/components/view/GroupList.d.ts +0 -1
- package/dist/src/components/view/MessageItem.d.ts +2 -1
- package/dist/src/components/view/index.d.ts +1 -0
- package/dist/src/utils/chat.utils.d.ts +1 -0
- package/package.json +1 -1
|
@@ -7,7 +7,7 @@ import { createMp3Encoder as C } from "wasm-media-encoders";
|
|
|
7
7
|
import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
|
|
8
8
|
//#endregion
|
|
9
9
|
//#region src/styles/index.ts
|
|
10
|
-
var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family:Inter,-apple-system,sans-serif;font-size:16px;font-weight:400;line-height:24px;display:block;position:fixed;bottom:0;right:0}#chat-internal-root *{box-sizing:border-box;pointer-events:auto}#chat-internal-root ::-webkit-scrollbar{width:5px;height:5px}#chat-internal-root ::-webkit-scrollbar-thumb{background-color:#0000001a;border-radius:4px}#chat-internal-root ::-webkit-scrollbar-thumb:hover{background-color:#0003}.chatbot-container{width:100%;height:100%;position:relative}\n .floating-button{background:var(--primary);-webkit-backdrop-filter:blur(25px)saturate(150%);color:#fff;cursor:pointer;z-index:99999;border:1px solid #fff6;border-radius:20px;outline:none;justify-content:center;align-items:center;width:64px;height:64px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 12px 40px #0000000d,inset 0 0 0 1px #fff6}.floating-button:hover{transform:scale(1.1)rotate(5deg)}.floating-button:active{transform:scale(.95)}.floating-button .ping{pointer-events:none;background:#fff3;border-radius:16px;animation:2s cubic-bezier(0,0,.2,1) infinite ping;position:absolute;inset:0}@keyframes ping{75%,to{opacity:0;transform:scale(1.5)}}.floating-button .icon{z-index:10;font-size:24px;position:relative}\n .chat-window{--primary:#155dfc;--chat-bg:#fff;--chat-text:#101828;--chat-subtext:#6a7282;--chat-header-bg:#fff;--chat-border:#e5e7eb;--sidebar-bg:#fff}.chat-window.dark-theme{--chat-bg:color-mix(in srgb, var(--primary), #0f172a99 85%);--chat-text:#f8fafc;--chat-subtext:#94a3b8;--chat-header-bg:color-mix(in srgb, var(--primary), #1e293b99 80%);--chat-border:#334155;--sidebar-bg:color-mix(in srgb, var(--primary), #0f172a66 95%)}.chat-window{background:var(--chat-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--chat-border);z-index:99998;width:420px;height:640px;color:var(--chat-text);transform-origin:100% 100%;border-radius:14px;flex-direction:column;max-width:100%;max-height:100%;margin:0;transition:none;animation:.6s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;position:fixed;bottom:90px;right:20px;overflow:hidden;transform:none;box-shadow:0 8px 32px #0000005e,inset 0 0 0 1px #ffffff0d}.chat-window.fullpage{--chat-bg:#fff;--chat-header-bg:#fff;--chat-border:#f1f5f9;--sidebar-bg:#fff;--app-sidebar-bg:#f9f9f9;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;border-radius:16px;flex-direction:column;display:flex;transform:none}.chat-main-layout{--chat-bg:#fff;--chat-header-bg:#fff;--chat-border:#f1f5f9;--sidebar-bg:#fff;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;background-color:var(--app-sidebar-bg);border-radius:0;flex-direction:row;flex:1;width:100%;max-width:none;height:100vh;display:flex;inset:0;overflow:hidden;transform:none}.chat-window.fullpage.dark-theme{--chat-bg:#0f172a;--chat-header-bg:#1e293b;--chat-border:#334155;--sidebar-bg:#0f172a;--app-sidebar-bg:#1e293b;--active-item-bg:#334155;overflow:hidden}.chat-header{background:var(--chat-header-bg);color:var(--chat-text);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.header-info{align-items:center;gap:8px;display:flex}.header-logo{flex-shrink:0;justify-content:center;align-items:center;padding-left:6px;padding-right:8px;display:flex}.header-logo img,.header-logo .satek-icon{object-fit:contain;width:22px;height:22px}.back-btn{color:#64748b;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin-right:8px;padding:0;font-size:20px;display:flex}.header-info-text{align-items:center;gap:6px;min-width:0;display:flex}.header-dot{color:var(--chat-subtext);opacity:.6}.header-title{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.header-subtitle{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;font-size:16px;font-weight:400;overflow:hidden}.chat-body-container{border-top-left-radius:8px;flex-direction:row;flex:1;display:flex;position:relative;overflow:hidden}.chat-sidebar{background:var(--sidebar-bg);border-right:1px solid #0000000d;flex-direction:column;width:100%;transition:all .3s;display:flex}.chat-sidebar.is-full{flex-shrink:0;width:320px}.chat-search-bar{background:0 0;align-items:center;gap:4px;padding:12px 12px 4px;display:flex}.search-input-wrapper{flex:1;align-items:center;display:flex;position:relative}.search-icon{color:#94a3b8;pointer-events:none;width:16px;height:16px;position:absolute;left:12px}.search-input{color:#1e293b;background:#f3f4f6;border:1px solid #0000;border-radius:8px;outline:none;width:100%;padding:8px 36px;font-size:14px;transition:all .3s}.search-input:focus{background:#fff;border-color:#a855f74d;box-shadow:0 4px 12px #00000008}.clear-search{color:#94a3b8;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:18px;display:flex;position:absolute;right:10px}.clear-search:hover{color:#64748b}.sidebar-scroll{flex:1;padding:0 8px 20px;overflow-y:auto}.chat-filter-tabs{gap:24px;margin:0 12px;display:flex;position:relative}.chat-filter-tabs:before{content:\"\";background-color:#0000000d;height:1px;position:absolute;bottom:0;left:0;right:0}.chat-filter-tabs button{cursor:pointer;color:#667085;background:0 0;border:none;align-items:center;gap:6px;padding:8px 0;font-size:13px;font-weight:500;transition:all .2s;display:flex;position:relative}.chat-filter-tabs button.active{color:#155dfc;font-weight:600}.chat-filter-tabs button.active:after{content:\"\";z-index:1;background-color:#155dfc;border-radius:2px;height:2px;position:absolute;bottom:0;left:0;right:0}.filter-unread-badge-container{align-items:center;gap:6px;display:flex}.filter-unread-badge{color:#fff;background-color:#f04438;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:11px;font-weight:600;display:flex}.sidebar-scroll::-webkit-scrollbar{width:5px;margin-left:10px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#0000000d;border-radius:10px}.member-search-section{border-top:1px solid #00000008;margin-top:10px;padding:20px 0;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.member-search-section .section-header{color:var(--chat-text);text-transform:uppercase;letter-spacing:1px;padding:0 20px 12px;font-size:11px;font-weight:700}.member-search-section .members-list{max-height:none;padding:0 10px}.member-search-section .member-item{background:0 0;border:none;margin-bottom:4px;padding:10px 12px}.member-search-section .member-item:hover{background:#fff6}.chat-main{background:#ffffff1a;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.drag-overlay-full{pointer-events:none;z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;border:3px dashed #a855f7cc;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:absolute;inset:0}.drag-overlay-full .drag-content{color:#fff;text-shadow:0 2px 4px #0000004d;flex-direction:row;align-items:center;gap:12px;display:flex}.drag-overlay-full .drag-icon{font-size:20px;animation:.6s ease-in-out infinite bounce}.chat-list{background:0 0;flex:1;overflow-y:auto}.chat-item{cursor:pointer;border-radius:8px;align-items:center;gap:12px;height:64px;padding:8px;transition:background .1s ease-in-out;display:flex;position:relative}.chat-item:hover{background:#eff6ff99}.chat-item.active{background:#eff6ff}.chat-item-avatar{justify-content:center;align-items:center;width:32px;height:32px;font-size:22px;display:flex;position:relative}.online-indicator{z-index:1;background-color:#22c55e;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;bottom:-3px;right:2px}.chat-item-info{flex:1;overflow:hidden}.chat-item-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-item-last{flex:1;min-width:0}.last-message-text{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;display:block;overflow:hidden}.info-bottom-right{flex-shrink:0;align-items:center;gap:4px;margin-top:4px;display:flex}.mute-icon-list{color:#94a3b8;flex-shrink:0}.chat-item.active .chat-item-last{color:var(--chat-text)}.unread-badge{color:#fff;z-index:2;background:linear-gradient(135deg,#f43f5e,#e11d48);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;min-width:18px;height:18px;padding:10px 7px;font-size:10px;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px;box-shadow:0 2px 4px #0000001a}.chat-item-time{color:var(--chat-subtext);white-space:nowrap}.chat-list-section{margin-bottom:16px}.empty-chat-list{padding:12px 8px 4px}.section-header{color:#64748b;text-transform:none;align-items:center;gap:6px;padding:12px 8px 4px;display:flex}.section-icon{color:#94a3b8}.info-top-row{justify-content:space-between;align-items:baseline;margin-bottom:2px;display:flex}.info-bottom-row{justify-content:space-between;align-items:center;display:flex}.unread-badge-circle{color:#fff;background-color:#3b82f6;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:8px;padding:0 5px;font-size:10px;font-weight:600;display:flex}.chat-options-wrapper{opacity:0;pointer-events:none;z-index:100;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)scale(.8)}.chat-item:hover .chat-options-wrapper,.chat-item.has-open-dropdown .chat-options-wrapper{opacity:1;pointer-events:auto;transform:translateY(-50%)scale(1)}.chat-options-btn{-webkit-backdrop-filter:blur(8px);color:#64748b;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.chat-options-btn:hover,.chat-options-btn.active{color:#1e293b;background:#ffffff4d;border-color:#fff6;transform:scale(1.05)}.chat-options-btn svg{width:18px;height:18px}.chat-options-dropdown{-webkit-backdrop-filter:blur(20px)saturate(160%);z-index:1000;background:#ffffffe6;border:1px solid #fff9;border-radius:14px;flex-direction:column;gap:4px;min-width:160px;padding:6px;animation:.2s cubic-bezier(.4,0,.2,1) dropdownFadeIn;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.dropdown-item{color:#334155;cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{color:#0f172a;background:#0000000a}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{color:#dc2626;background:#ef444414}.dropdown-icon{flex-shrink:0;width:16px;height:16px}.header-actions{gap:4px;display:flex}.action-btn{color:#667085;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#101828;background:#f2f4f7}.action-btn.close-btn:hover{color:#ef4444;background:#fee2e2}.add-group-btn{color:#667085;cursor:pointer;background:#f9fafb;border:1px solid #f2f4f7;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .2s;display:flex}.add-group-btn:hover{color:#101828;background:#f2f4f7;border-color:#eaecf0}.dark-theme .add-group-btn{color:#f8fafc;background:#1e293b66;border-color:#ffffff1a}.dark-theme .add-group-btn:hover{background:#1e293bcc;border-color:#fff3}.theme-toggle{background:#fff6;border:1px solid #ffffff80;border-radius:12px;font-size:16px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000000d}.theme-toggle:hover{background:#fff;box-shadow:0 8px 20px #0000001a;transform:rotate(15deg)scale(1.1)!important}.dark-theme .theme-toggle{color:#f8fafc;background:#1e293b66;border-color:#ffffff1a}.dark-theme .theme-toggle:hover{background:#1e293bcc;border-color:#fff3}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100000;background:#0006;justify-content:center;align-items:center;animation:.3s modalFadeIn;display:flex;position:absolute;inset:0}.modal-content{background:color-mix(in srgb, var(--primary), #ffffffb3 92%);-webkit-backdrop-filter:blur(30px)saturate(150%);border:1px solid #fffc;border-radius:36px;width:90%;max-width:380px;height:85%;padding:32px;animation:.4s cubic-bezier(.175,.885,.32,1.275) modalPopUp;overflow-y:auto;box-shadow:0 30px 60px #00000014}.dark-theme .modal-content{background:color-mix(in srgb, var(--primary), #1e293bb3 90%);color:#f8fafc;border-color:#ffffff1a}.modal-content::-webkit-scrollbar-track{margin:10px 0}.modal-title{color:var(--chat-text);text-align:center;letter-spacing:-.5px;margin-bottom:24px;font-size:22px;font-weight:800}.modal-input{color:#1e293b;background:#fff;border:1px solid #0000000d;border-radius:18px;outline:none;width:100%;margin-bottom:28px;padding:16px 20px;font-size:15px;transition:all .3s}.modal-input:focus{background:#ffffff14;border-color:#155dfc;box-shadow:0 0 0 4px #155dfc26}.members-section{margin-bottom:24px}.section-title{color:#64748b;text-transform:uppercase;letter-spacing:1px;padding-left:4px;font-size:11px;font-weight:700;display:block}.members-list{max-height:250px;margin:0 -4px;padding:4px;overflow-y:auto}.members-list::-webkit-scrollbar{width:5px}.members-list::-webkit-scrollbar-thumb{background:#4f46e533;border-radius:10px}.member-item{cursor:pointer;background:#fff6;border:1px solid #0000;border-radius:16px;align-items:center;gap:14px;padding:12px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.member-item:hover{background:#fffc}.remove-member-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;margin-left:auto;padding:6px;transition:all .2s;display:flex}.remove-member-btn:hover{color:#ef4444;background:#ef44441a;transform:scale(1.1)}.remove-member-btn svg{width:18px;height:18px}.member-avatar{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;display:flex;box-shadow:0 2px 5px #0000000d}.member-name{color:var(--chat-text);flex:1;font-size:14px;font-weight:600}.member-check{color:#fff;border:2px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.member-item.selected .member-check{background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#4f46e5;transform:scale(1.1)}.modal-actions{gap:12px;margin-top:8px;display:flex}.modal-btn{cursor:pointer;border:none;border-radius:16px;flex:1;padding:14px;font-size:14px;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1)}.modal-btn.cancel{color:#64748b;background:#f1f5f9cc}.modal-btn.cancel:hover{color:#0f172a;background:#f1f5f9}.modal-btn.confirm{color:#fff;background:linear-gradient(135deg,#6366f1,#4f46e5);box-shadow:0 10px 20px -5px #4f46e566}.modal-btn.confirm:hover{transform:translateY(-2px);box-shadow:0 15px 25px -5px #4f46e580}.modal-btn.disabled{color:#cbd5e1;cursor:not-allowed;box-shadow:none;background:#f1f5f9}.empty-chat-state h3{color:#1e293b;margin-bottom:8px;font-size:20px;font-weight:700}.empty-chat-state p{opacity:.8;font-size:15px}.modal-search-wrapper{margin-bottom:20px}.no-members-found{text-align:center;text-align:center;color:#9ca3af;background:#ffffff4d;border:1px dashed #0000000d;border-radius:16px;padding:20px;font-size:14px}.member-item.loading{cursor:not-allowed;opacity:.6}.member-add-action{color:#6366f1;background:#6366f11a;border-radius:6px;margin-left:auto;padding:4px 12px;font-size:13px;font-weight:700;transition:all .2s}.member-item:hover .member-add-action{color:#fff;background:#6366f1}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalPopUp{0%{opacity:0;transform:scale(.8)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.theme-modal{max-width:300px!important;height:auto!important;padding:24px!important}.modal-header{justify-content:space-between;align-items:center;display:flex}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px;font-size:24px;line-height:1}.theme-section{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.section-desc{color:#64748b;margin:0;font-size:13px;line-height:1.5}.color-presets{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:8px;display:grid}.color-preset-btn{aspect-ratio:1;cursor:pointer;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;padding:0;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 2px 8px #0000001a}.color-preset-btn:hover{transform:scale(1.1);box-shadow:0 4px 12px #00000026}.color-preset-btn.active{border-color:#334155;transform:scale(1.15)}.check-icon{color:#fff;text-shadow:0 0 2px #00000080;font-size:14px;font-weight:700}.custom-color-picker{background:#fff;border:1px solid #0000000d;border-radius:12px;align-items:center;gap:12px;margin-top:8px;padding:8px 12px;display:flex}.color-input{cursor:pointer;background:0 0;border:none;border-radius:6px;width:32px;height:32px;padding:0;overflow:hidden}.color-input::-webkit-color-swatch-wrapper{padding:0}.color-input::-webkit-color-swatch{border:none;border-radius:6px}.color-hex-code{color:#64748b;font-weight:600}.contact-categories{flex-direction:column;gap:8px;padding:8px;display:flex}.category-item{cursor:pointer;color:var(--chat-text);border-radius:8px;align-items:center;gap:12px;width:100%;height:40px;padding:10px 12px;font-weight:500;transition:all .2s;display:flex}.category-item:hover{color:#1e293b;background:#f1f5f9}.category-item.active{color:#1447e6;background:#eff6ff}.category-item .count{color:#99a1af;border-radius:10px;margin-left:auto;padding:2px 8px}.contact-list-view{background:#fff;flex-direction:column;flex:1;height:100%;display:flex}.contact-list-header{color:var(--chat-text);border-bottom:1px solid #f1f5f9;height:45px;padding:10px 16px}.contact-list-toolbar{justify-content:space-between;align-items:center;padding:12px 16px 20px;display:flex}.toolbar-left{align-items:center;gap:20px;display:flex}.toolbar-left span{color:#64748b;font-weight:500}.toolbar-search{background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;width:300px;height:36px;padding:12px;display:flex}.toolbar-search input{background:0 0;border:none;outline:none;width:100%;font-size:14px}.toolbar-right{gap:12px;height:36px;display:flex}.filter-select{cursor:pointer;color:#1e293b;background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;padding:9px 12px;font-size:14px;display:flex}.dropdown-select{z-index:10;background:#fff;border:1px solid #e2e8f0;border-radius:8px;min-width:150px;margin-top:8px;position:absolute;top:100%;right:0;box-shadow:0 4px 6px #0000001a}.dropdown-select .dropdown-item{cursor:pointer;border-bottom:1px solid #e2e8f0;border-radius:0;align-items:center;gap:8px;height:40px;padding:12px 16px;display:flex}.dropdown-select .dropdown-item div{padding-top:3px}.contact-scroll-area{flex:1;padding:0 16px 16px;overflow-y:auto}.letter-title{color:var(--chat-subtext)}.contact-item-row{justify-content:space-between;align-items:center;height:64px;padding:12px 0;display:flex}.contact-item-left{align-items:center;gap:16px;display:flex}.contact-avatar{width:32px;height:32px;position:relative}.contact-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.contact-avatar .online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.contact-info{flex-direction:column;display:flex}.contact-name{color:var(--chat-text)}.contact-role{color:var(--chat-subtext)}.contact-item-actions{gap:8px;display:flex}.contact-action-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.contact-action-btn:hover{color:#1e293b;background:#f1f5f9;border-color:#cbd5e1}.chat-window.fullpage .chat-body-container{background:#fff;overflow:hidden;flex:1!important;width:100%!important;height:100%!important;display:flex!important}.chat-window.fullpage .chat-sidebar{border-right:1px solid var(--chat-border);background:#fff;flex-direction:column;flex-shrink:0;width:312px;display:flex}.chat-window.fullpage .chat-main{background:#fff;flex-direction:column;flex:1;display:flex;position:relative}.chat-main-header{border-bottom:1px solid var(--chat-border);background:#fff;flex-shrink:0;justify-content:space-between;align-items:center;min-height:64px;padding:12px 16px;display:flex}.chat-main-info{align-items:center;gap:10px;min-width:0;display:flex}.chat-main-avatar{flex-shrink:0;width:40px;height:40px}.chat-main-text{flex-direction:column;min-width:0;display:flex}.chat-main-text-container{align-items:center;gap:6px;display:flex}.chat-main-name{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;line-height:1.2;overflow:hidden}.chat-main-status{color:#94a3b8;margin-top:1px;font-size:13px}.chat-main-actions{flex-shrink:0;gap:4px;display:flex}.main-action-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;transition:all .2s;display:flex}.main-action-btn:hover{color:var(--primary);background:#f1f5f9}.chat-window.fullpage .chat-main-header{min-height:72px;padding:16px 24px}.chat-window.fullpage .chat-main-name{font-size:18px}.chat-window.fullpage .chat-main-actions{gap:8px;display:flex}.chat-window.fullpage .header-info-text{flex-direction:row;align-items:center;gap:6px}.chat-window.fullpage .header-subtitle{margin-top:0;font-size:16px}.chat-window.fullpage .chat-header .action-btn.theme-toggle{box-shadow:none;background:0 0}.chat-window.fullpage .chat-header{background-color:var(--app-sidebar-bg);height:45px;padding:8px 12px}.empty-chat-state{color:#94a3b8;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px;display:flex}.empty-icon{opacity:.5;margin-bottom:24px;font-size:64px}.empty-chat-state h3{color:#1e293b;margin-bottom:8px;font-size:20px}.empty-chat-state p{max-width:280px;font-size:14px;line-height:1.5}.search-section-title{color:#1e293b;align-items:center;gap:8px;margin-bottom:12px;font-size:16px;font-weight:700;display:flex}.search-count{color:#3b82f6;font-size:14px;font-weight:500}.search-section-content{flex-direction:column;gap:8px;display:flex}.search-result-item{cursor:pointer;border-radius:12px;align-items:center;gap:12px;height:64px;padding:8px;transition:all .2s;display:flex}.search-result-item:hover{background:#00000008}.search-result-avatar{border-radius:50%;flex-shrink:0;width:32px;height:32px;overflow:hidden}.search-result-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.avatar-placeholder{color:#fff;background:linear-gradient(135deg,#3b82f6,#2563eb);justify-content:center;align-items:center;width:100%;height:100%;font-size:18px;font-weight:600;display:flex}.search-result-info{flex:1;min-width:0}.search-result-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.search-result-sub{color:#64748b;margin-top:2px;font-size:12px}.search-view-all{color:#64748b;cursor:pointer;background:#00000008;border:none;border-radius:8px;width:100%;margin-top:12px;padding:10px;font-size:13px;font-weight:500;transition:all .2s}.search-view-all:hover{color:#1e293b;background:#0000000f}.message-result .search-result-top{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.search-result-date{color:#94a3b8;font-size:11px}.search-result-text{color:#475569;-webkit-line-clamp:2;line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.file-icon-wrapper{color:#3b82f6;background:#3b82f61a;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.highlight-match{color:var(--primary);font-weight:500}.resize-handle.ne{cursor:ne-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;right:0}.resize-handle.nw{cursor:nw-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;left:0}.resize-handle.se{cursor:se-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;right:0}.resize-handle.sw{cursor:sw-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;left:0}\n .chat-input-area{background:#fff;border-top:1px solid #e5e7eb;align-items:center;gap:12px;padding:12px 16px;transition:all .3s;display:flex;position:relative}.chat-input-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.action-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#374151;background:#f3f4f6}.action-btn.active{color:var(--primary);background:#f3f4f6}.chat-input-container{flex:1;align-items:center;display:flex}.chat-input{color:#1f2937;background:#f3f4f6;border:1px solid #0000;border-radius:8px;outline:none;width:100%;padding:10px 16px;font-size:14px;transition:all .2s}.chat-input::placeholder{color:#9ca3af}.chat-input:focus{background:#f3f4f6;border-color:#3b82f64d}.chat-input:disabled{opacity:.6;cursor:not-allowed}.send-btn{cursor:pointer;color:#fff;background:var(--primary,#8aaeff);width:36px;height:36px;box-shadow:none;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.send-btn:hover:not(:disabled){filter:brightness(.9);transform:translateY(-1px)}.send-btn:disabled{opacity:.6;cursor:not-allowed;background:#d1d5db}.send-btn svg{width:18px;height:18px}.emoji-picker{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:20px;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px;padding:12px;animation:.3s cubic-bezier(.34,1.56,.64,1) emojiSlideUp;display:grid;position:absolute;bottom:100%;left:16px;box-shadow:0 10px 30px #0000001a}@keyframes emojiSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.emoji-btn{cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:4px;font-size:20px;transition:all .2s;display:flex}.emoji-btn:hover{background:#fff;transform:scale(1.2);box-shadow:0 2px 5px #0000000d}.selected-files-list{background:#ffffff1a;border-bottom:1px solid #fff3;flex-wrap:nowrap;gap:12px;height:100px;padding:12px 20px;display:flex;overflow:auto hidden}.selected-file-item{background:#fef2f280;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:8px;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 8px #00000014}.selected-file-item.other-file{flex-direction:row}.selected-file-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.file-preview-image{object-fit:cover;border-radius:8px;width:54px;height:54px;display:block}.file-content-wrapper{flex-direction:row;align-items:center;gap:6px;display:flex}.file-icon{background:#f1f5f9;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:24px;display:flex}.file-info{flex-direction:column;gap:2px;min-width:0;display:flex}.file-name{color:#475569;white-space:nowrap;text-overflow:ellipsis;width:400px;max-width:100%;font-size:12px;overflow:hidden}.file-size{color:#94a3b8;white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-size:11px;overflow:hidden}.remove-file-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;transition:all .2s;display:flex;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 8px #ef44444d}.remove-file-btn:hover{background:#dc2626;transform:scale(1.1);box-shadow:0 4px 12px #ef444466}.remove-file-btn:disabled{opacity:.5;cursor:not-allowed}.selected-file-item.error-file-item{border:2px solid #ef4444;animation:.3s ease-in-out errorShake}@keyframes errorShake{0%{transform:translate(-3px)}50%{transform:translate(3px)}to{transform:translate(0)}}.selected-file-item.error-file-item:hover{background:#fef2f2b3;border-color:#dc2626}.file-size.error-size{color:#ef4444;font-weight:500}.reply-input-preview{background:#eff6ff;border-left:2px solid #2b7fff;border-top-left-radius:2px;border-bottom-left-radius:2px;justify-content:space-between;align-items:center;margin:0 10px 10px;padding:5px 20px;animation:.3s slideUp;display:flex;position:relative}.reply-content{flex-direction:column;flex:1;gap:2px;min-width:0;padding-left:18px;display:flex}.reply-user{color:#155dfc;margin-bottom:2px;font-size:.85rem;font-weight:700}.reply-user span{color:var(--primary,#155dfc)}.reply-text{color:#4a5565;white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.close-reply{color:#9ca3af;cursor:pointer;background:0 0;border:none;font-size:14px;transition:all .2s;position:absolute;top:0;right:0}.reply-icon{color:#155dfc;position:absolute;top:6px;left:10px}.close-reply:hover{color:#ef4444;transform:scale(1.1)}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.voice-recording-container{background:linear-gradient(135deg,#ef44441a,#ef44440d);border:1px solid #ef444433;flex:1;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recording-info{flex:1;align-items:center;gap:8px;display:flex}.recording-indicator{color:#374151;align-items:center;gap:6px;font-size:13px;font-weight:500;display:flex}.recording-dot{background:#ef4444;border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite recordingPulse}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}.recording-duration{color:#374151;text-align:right;min-width:45px;font-size:13px;font-weight:600}.voice-recorded-container{background:linear-gradient(135deg,#3b82f61a,#3b82f60d);border:1px solid #3b82f633;flex:1;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recorded-info{flex:1;align-items:center;gap:8px;font-size:13px;display:flex}.voice-label{color:#1f2937;white-space:nowrap;font-weight:500}.voice-duration{color:#3b82f6;text-align:right;min-width:45px;margin-left:auto;font-weight:600}.voice-control-btn{color:#1f2937;cursor:pointer;background:#fff;border:1px solid #0000001a;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;transition:all .2s;display:flex}.voice-control-btn:hover{background:#f9fafb;transform:scale(1.05)}.voice-control-btn.cancel-btn{color:#ef4444;background:#ef44440d;border-color:#ef44441a}.voice-control-btn.add-btn{color:#fff;background:#8aaeff;border-color:#8aaeff}\n .message-list-wrapper{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.message-list{background:#f9fafb80;flex-direction:column-reverse;flex:1;gap:20px;padding:24px 20px;display:flex;overflow:hidden auto}.chat-date-divider{justify-content:center;align-items:center;width:100%;margin:20px 0;display:flex}.chat-date-divider span{color:#64748b;background:#f1f5f9;border-radius:20px;padding:4px 16px;font-size:12px;font-weight:500;box-shadow:0 1px 2px #0000000d}.message-item{gap:4px 8px;max-width:70%;display:flex;position:relative}.message-content{flex-direction:column;gap:4px;width:fit-content;max-width:100%;display:flex}.message-item.current-user .message-content{align-items:flex-end}.message-item.other-user .message-content{align-items:flex-start}.message-content-container{flex-direction:column;gap:12px;display:flex;position:relative}.message-item.current-user{flex-direction:row-reverse;align-self:flex-end}.message-item.other-user{align-self:flex-start}.message-bubble.current-user{background:#155dfc;align-self:flex-end}.message-bubble.other-user{background:#f3f4f6;border-radius:8px 16px 16px;align-self:flex-start}.message-avatar{object-fit:cover;border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:transform .2s;box-shadow:0 4px 12px #00000026}.message-bubble{border-radius:16px 8px 16px 16px;grid-template-columns:minmax(0,1fr);padding:10px 16px;font-size:15px;line-height:1.6;display:grid;position:relative}.message-files{grid-template-columns:repeat(2,minmax(145px,1fr));align-content:start;gap:8px;max-width:100%;display:grid}.message-files>*{aspect-ratio:1.5;width:100%}.message-item .message-files>:last-child:nth-child(odd){grid-column:span 2}.message-item.current-user .message-files{align-self:flex-end}.message-item.other-user .message-files{align-self:flex-start}.file-item{cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:8px;align-items:center;gap:10px;max-height:60px;padding:8px 12px;text-decoration:none;transition:all .2s;display:flex}.file-item:hover{background:#ffffff40;border-color:#ffffff4d;transform:translate(4px)}.file-icon{flex-shrink:0;font-size:18px}.file-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.file-size{opacity:.7;color:inherit;font-size:11px}.file-image-wrapper{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:288px;margin-top:0;display:flex;position:relative;overflow:hidden}.file-image{object-fit:cover;cursor:pointer;border:1px solid #fff3;border-radius:8px;width:100%;height:100%;transition:transform .2s}.file-image:hover{transform:scale(1.05)}.image-overlay-more{cursor:pointer;background:#00000080;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;transition:all .2s;display:flex;position:absolute;top:0;left:0}.image-overlay-more:hover{background:#000000a6}.image-overlay-text{color:#fff;text-shadow:0 2px 4px #0000004d;font-size:28px;font-weight:600}.user .file-image{border-color:#ffffff4d}.message-actions-bar{-webkit-backdrop-filter:none;box-shadow:none;opacity:0;pointer-events:none;z-index:100;background:0 0;border:none;gap:2px;padding:0;transition:all .2s;display:flex;position:absolute;bottom:0}.message-item:hover .message-actions-bar{opacity:1;pointer-events:auto}.message-item.current-user .message-actions-bar{right:calc(100% + 8px)}.message-item.other-user .message-actions-bar{left:calc(100% + 8px)}.chat-window:not(.fullpage) .message-list{overflow-x:hidden}.chat-window:not(.fullpage) .message-item.current-user .message-actions-bar,.chat-window:not(.fullpage) .message-item.other-user .message-actions-bar{-webkit-backdrop-filter:blur(8px);background:#ffffffe6;border:1px solid #0000000d;border-radius:20px;gap:2px;padding:2px 6px;display:flex;inset:auto 0 -22px auto;transform:none;box-shadow:0 2px 8px #00000014}.chat-window:not(.fullpage) .message-item.other-user .message-member-name{margin-right:0}.chat-window:not(.fullpage) .action-icon svg{width:13px;height:13px}.chat-window:not(.fullpage) .action-icon{width:26px;height:26px}.action-icon{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.action-icon svg{stroke-width:2.2px;width:16px;height:16px}.action-icon:hover{background:#0000000d;transform:translateY(-2px)}.action-icon[title=Xóa]:hover,.action-icon[title=Thu\\ hồi]:hover{color:#ef4444;background:#ef44441a}.action-icon[title=Trả\\ lời]:hover{color:#3b82f6;background:#3b82f61a}.action-icon[title=Thích]:hover{color:#f59e0b;background:#f59e0b1a}.action-icon[title=Yêu\\ thích]:hover{color:#ec4899;background:#ec48991a}.message-reactions-badge{z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:10px;align-items:center;gap:2px;padding:2px 6px;font-size:13px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;bottom:-11px;box-shadow:0 2px 8px #0000001a}.message-reactions-badge span{line-height:1}.message-item.current-user .message-reactions-badge{right:8px}.message-item.other-user .message-reactions-badge{left:8px}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.message-reply-preview{cursor:pointer;background:#0000001a;border-left:3px solid #ffffff80;border-radius:8px;min-width:120px;margin-bottom:8px;padding:6px 10px;font-size:.8rem;transition:all .2s}.message-bubble.other-user .message-reply-preview{border-left-color:var(--primary,#155dfc);background:#0000000d}.message-reply-preview:hover{background:#00000026}.reply-user-name{color:#fffffff2;white-space:nowrap;text-overflow:ellipsis;margin-bottom:2px;font-size:.75rem;font-weight:700;overflow:hidden}.message-bubble.other-user .reply-user-name{color:var(--primary,#155dfc)}.reply-content-text{color:#fffc;white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.message-bubble.other-user .reply-content-text{color:#475569}.message-text{overflow-wrap:break-word;word-break:break-word;width:auto;display:inline-block}.message-bubble.other-user .message-text{color:var(--chat-text)}.message-bubble.current-user .message-text{color:var(--primary-contrast,#f8fafc)}.message-bubble.other-user.revoked .message-text,.message-bubble.current-user.revoked .message-text{color:color-mix(in srgb, var(--chat-text), transparent 50%)}.message-member-name{color:#475569;white-space:nowrap;text-overflow:ellipsis;min-width:0;margin-bottom:4px;font-size:15px;font-weight:500;overflow:hidden}.scroll-bottom-btn{-webkit-backdrop-filter:blur(8px);cursor:pointer;color:#4f46e5;z-index:1000;background:#ffffffb3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;transition:all .3s cubic-bezier(.4,0,.2,1);animation:.3s fadeInPop;display:flex;position:absolute;bottom:20px;right:20px;box-shadow:0 4px 15px #00000026}.scroll-bottom-btn:hover{background:#fff;transform:translateY(-4px);box-shadow:0 6px 20px #0003}.unread-dot{background-color:#ff4d4f;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:0;right:0}@keyframes fadeInPop{0%{opacity:0;transform:scale(.5)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.message-time{color:var(--chat-text);margin-top:2px;font-size:10px;font-weight:500}.message-item.current-user .message-time{text-align:right;margin-right:4px}.message-item.other-user .message-time{text-align:left;margin-left:4px}.message-item-status{color:var(--chat-text);margin-left:4px;font-size:10px;font-weight:400}.message-item-status.seen{color:#3b82f6;font-weight:600}.message-item-status.seen svg{margin-bottom:-2px}.message-bubble.revoked{opacity:.8;background:#ffffff0d;border:1px dashed #fff3;font-style:italic}@keyframes highlight-fade{0%{background-color:rgba(var(--primary-rgb), .2);transform:scale(1.02)}to{background-color:#0000;transform:scale(1)}}.highlight-message .message-bubble{animation:2s ease-out highlight-fade}.see-more-btn{color:#3b82f6;cursor:pointer;margin-left:8px;font-size:.85em;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.message-bubble.current-user .see-more-btn{color:#ffffffe6;text-decoration:underline}.see-more-btn:hover{filter:brightness(1.1);text-decoration:underline}.message-bubble.current-user .see-more-btn:hover{color:#fff}\n .file-viewer-overlay{z-index:100001;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000e6;justify-content:center;align-items:center;animation:.2s ease-in-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.file-viewer-content{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-out slideUp;display:flex;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.file-viewer-main{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:70vh;display:flex;position:relative;overflow:hidden}.file-viewer-image{object-fit:contain;border-radius:8px;max-width:100%;max-height:70vh;box-shadow:0 10px 40px #0000004d}.file-viewer-main:has(.file-viewer-video){overflow:visible}.file-viewer-video{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}.video-container{justify-content:center;width:85vw;height:78vh;display:flex;overflow:visible}.file-viewer-close{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:24px;transition:all .2s;display:flex;position:absolute;top:30px;right:70px}.file-viewer-close:hover{background:#ffffff4d;border-color:#fff6;transform:scale(1.1)}.file-viewer-close:active{transform:scale(.95)}.file-viewer-nav{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#ffffff26;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:32px;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.file-viewer-nav:hover{background:#ffffff40;border-color:#ffffff4d}.file-viewer-nav:active{transform:translateY(-50%)scale(.95)}.file-viewer-prev{left:70px}.file-viewer-next{right:70px}@media (width<=768px){.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}}.file-viewer-counter{color:#fff;white-space:nowrap;z-index:100001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00000080;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:500;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.file-viewer-thumbnails-container{z-index:100001;opacity:0;pointer-events:none;visibility:hidden;justify-content:center;align-items:center;gap:2rem;width:100%;padding-bottom:3.5rem;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.file-viewer-thumbnails{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0000004d;border-radius:8px;gap:8px;max-width:60%;padding-top:12px;padding-bottom:12px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%)}.file-viewer-counter:hover~.file-viewer-thumbnails-container,.file-viewer-thumbnails-container:hover{opacity:1;visibility:visible;pointer-events:auto}.file-viewer-thumbnails::-webkit-scrollbar{height:4px}.file-viewer-thumbnails::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.file-viewer-thumbnails::-webkit-scrollbar-thumb:hover{background:#ffffff80}.file-viewer-thumbnails-scroll-btn{color:#fff;cursor:pointer;z-index:100002;-webkit-backdrop-filter:blur(10px)saturate(180%);backdrop-filter:blur(10px)saturate(180%);background:#fff3;border:1px solid #ffffff4d;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:18px;transition:all .3s;display:flex;box-shadow:0 8px 32px #1f26875e}.file-viewer-thumbnails-scroll-btn:hover{background:#ffffff4d;border-color:#ffffff80;transform:scale(1.05);box-shadow:0 8px 32px #1f268780}.file-viewer-thumbnails-scroll-btn:active{transform:scale(.95)}.file-viewer-thumbnail{cursor:pointer;background:#0000004d;border:2px solid #0000;border-radius:4px;width:60px;min-width:60px;height:60px;padding:0;transition:all .2s;overflow:hidden}.file-viewer-thumbnail:hover{background:#0006;border-color:#ffffff80}.file-viewer-thumbnail.active{background:#0003;border-color:#fffc}.thumbnail-image{object-fit:cover;width:100%;height:100%}.thumbnail-video{object-fit:cover;z-index:1;cursor:pointer;width:100%;height:100%}.video-thumbnail-container{border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.play-icon-overlay{z-index:2;pointer-events:none;cursor:pointer;background-color:#00000080;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:absolute}.play-arrow{color:#fff;margin-bottom:3px;margin-left:2px;font-size:18px}.file-viewer-overlay:has(.file-viewer-audio){background:0 0}.file-viewer-main:has(.file-viewer-audio){overflow:visible}.audio-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:visible}.audio-player-wrapper{-webkit-backdrop-filter:blur(30px)saturate(150%);backdrop-filter:blur(30px)saturate(150%);color:#1e293b;z-index:1000;background:#ffffff4d;border:1px solid #ffffff80;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:12px;width:100%;max-width:500px;padding:24px 20px;display:flex;position:relative;box-shadow:0 0 0 100vmax #000000e6}.file-viewer-audio{width:100%;height:40px}.file-viewer-audio::-webkit-media-controls-panel{background-color:#ffffff1a}.audio-name{color:#000;text-align:center;word-break:break-word;max-width:100%;margin:0;font-size:16px}.audio-thumbnail-container{background:linear-gradient(135deg,#6496ff80 0%,#c864ff80 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.audio-thumbnail-icon{font-size:28px}.pdf-thumbnail-container{background:linear-gradient(135deg,#f5222dcc 0%,#ff7a45cc 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.pdf-thumbnail-icon{font-size:28px}@media (width<=1024px){.file-viewer-content{max-width:95%}.file-viewer-image{max-height:60vh}.file-viewer-nav{width:40px;height:40px;font-size:24px}}@media (width<=600px){.file-viewer-overlay{inset:0}.file-viewer-content{max-width:100%;max-height:100vh}.file-viewer-main,.file-viewer-image{max-height:50vh}.file-viewer-nav{width:36px;height:36px;font-size:20px}.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{width:36px;height:36px;font-size:20px;top:10px;right:10px}.file-viewer-counter{padding:6px 12px;font-size:12px;bottom:60px}.file-viewer-thumbnails{max-width:100%;padding:8px}.file-viewer-thumbnails-scroll-btn{width:32px;height:32px;font-size:16px}.file-viewer-thumbnail{width:50px;min-width:50px;height:50px}}.file-viewer-main:has(.file-viewer-pdf){overflow:visible}.file-viewer-content:has(.file-viewer-pdf) .file-viewer-close{top:5rem}.pdf-container{justify-content:center;width:100vw;height:100vh;display:flex;overflow:visible}.file-viewer-pdf{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}\n .toast-container{z-index:100000;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:24px;right:24px}.toast-item{pointer-events:auto;-webkit-backdrop-filter:blur(15px)saturate(150%);color:#1e293b;background:#fffc;border:1px solid #fff9;border-radius:20px;align-items:center;gap:12px;min-width:500px;max-width:calc(100% - 40px);padding:12px 16px;font-size:14px;font-weight:500;animation:.4s cubic-bezier(.175,.885,.32,1.275) toast-pop-in;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d,0 10px 15px -3px #0000001a}.toast-item:before{content:\"\";width:4px;transition:background .3s;position:absolute;top:0;bottom:0;left:0}.toast-item.success:before{background:#10b981}.toast-item.error:before{background:#ef4444}.toast-item.info:before{background:#3b82f6}.toast-item.warning:before{background:#f59e0b}.toast-item span{background:#00000008;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:16px;display:flex}.toast-item button{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.toast-item button:hover{color:#1e293b;background:#0000000d}@keyframes toast-pop-in{0%{opacity:0;transform:translate(20px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}.dark-theme .toast-item{color:#f8fafc;background:#1e293bb3;border-color:#ffffff14;box-shadow:0 20px 25px -5px #0003}.dark-theme .toast-item span{background:#ffffff0d}.toast-message{flex:1}.toast-actions{gap:8px;margin-top:10px;display:flex}.toast-btn{cursor:pointer;border-radius:4px;padding:4px 10px;font-size:12px;transition:all .2s}.toast-btn.cancel{color:inherit;background:#ffffff1a;border:1px solid #ffffff4d}.toast-btn.confirm{color:#fff;border:none;font-weight:700}.toast-item.warning .toast-btn.confirm{background:#ff9800}.toast-item.success .toast-btn.confirm,.toast-item.info .toast-btn.confirm{background:#2196f3}.toast-close-btn{cursor:pointer;opacity:.5;color:inherit;background:0 0;border:none;justify-content:center;align-items:center;padding:0 0 0 8px;font-size:16px;display:flex}\n .side-bar-info-chat{border-left:1px solid var(--chat-border);background:#fff;flex-direction:column;flex-shrink:0;width:320px;display:flex}.info-header{justify-content:flex-end;padding:16px;display:flex}.close-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px}.close-info-btn:hover{background:#f1f5f9}.info-content-scroll{flex-direction:column;flex:1;padding:0 20px 20px;display:flex;overflow-y:auto}.info-content-scroll::-webkit-scrollbar{width:4px}.info-content-scroll::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.info-basic-section{text-align:center;flex-direction:column;align-items:center;display:flex}.info-avatar-large{width:80px;height:80px}.info-avatar-large .chat-avatar{font-size:24px}.info-main-details{flex-direction:column;display:flex}.info-chat-name{color:#1e293b;justify-content:center;align-items:center;gap:8px;margin-top:12px;margin-bottom:4px;font-size:18px;font-weight:700;display:flex}.info-status-icons{color:#94a3b8;gap:4px;display:flex}.info-member-count{color:#64748b;margin-top:0;margin-bottom:10px;font-size:14px}.info-quick-actions{justify-content:space-around;margin-bottom:24px;display:flex}.action-item{cursor:pointer;flex-direction:column;align-items:center;gap:8px;display:flex}.action-icon-info{color:#475569;background:#f8fafc;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:80px;height:60px;transition:all .2s;display:flex}.action-item:hover .action-icon-info{color:var(--primary);background:#f1f5f9}.action-item span{color:#475569;font-size:13px;font-weight:500}.menu-item{cursor:pointer;color:#1e293b;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:15px;font-weight:500;display:flex}.menu-item:hover{background:#f8fafc}.menu-left{align-items:center;gap:12px;display:flex}.info-members-section{padding:16px 0}.section-title-row{color:#64748b;justify-content:space-between;align-items:center;margin-bottom:12px;padding:0 4px;font-size:14px;font-weight:600;display:flex}.title-actions{color:#94a3b8;gap:8px;display:flex}.title-actions svg{cursor:pointer}.arrow-icon{transition:transform .2s}.arrow-icon.collapsed{transform:rotate(-180deg)}.member-item-left.clickable{cursor:pointer}.members-compact-list{flex-direction:column;display:flex}.members-facepile{align-items:center;padding:8px 4px;display:flex}.facepile-item{z-index:1;border:2px solid #fff;border-radius:50%;width:32px;height:32px;margin-left:-8px;transition:transform .2s;position:relative}.facepile-item:first-child{margin-left:0}.facepile-item:hover{z-index:10;transform:translateY(-4px)}.facepile-item .member-avatar-small{width:100%;height:100%}.facepile-item .online-status{border-width:1.5px;width:8px;height:8px;bottom:0;right:0}.facepile-more{color:#64748b;z-index:0;cursor:pointer;background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;margin-left:-8px;font-size:11px;font-weight:700;display:flex}.facepile-more:hover{background:#e2e8f0}.member-compact-item{border-radius:8px;justify-content:space-between;align-items:center;padding:8px;transition:background .2s;display:flex;position:relative}.member-compact-item:hover{background:#f8fafc}.member-item-left{align-items:center;gap:8px;display:flex}.member-avatar-small{border-radius:50%;width:32px;height:32px;position:relative}.member-avatar-small img,.member-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.member-initials{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:12px;font-weight:600;display:flex}.member-info{flex-direction:column;gap:2px;display:flex}.member-options-container{align-items:center;display:flex;position:relative}.member-options-btn{color:#94a3b8;cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.member-compact-item:hover .member-options-btn{opacity:1}.member-options-btn:hover{color:#475569;background:#e2e8f0}.member-dropdown-menu{z-index:100;background:#fff;border:1px solid #f1f5f9;border-radius:12px;width:190px;margin-top:4px;padding:6px;animation:.2s fadeIn;position:absolute;top:100%;right:0;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{color:#1e293b;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;padding:10px 12px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{background:#f1f5f9}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{background:#fef2f2}.dropdown-item svg{flex-shrink:0}.member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.member-role{color:#64748b;font-size:12px}.online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.info-summary-section{padding:16px 0}.info-summary-section .section-title{color:#64748b;margin-bottom:12px;font-size:14px;font-weight:600}.summary-tabs{background:#f1f5f9;border-radius:8px;margin-bottom:16px;padding:4px;display:flex}.tab-item{text-align:center;color:#64748b;cursor:pointer;border-radius:6px;flex:1;padding:6px;font-size:13px}.tab-item.active{color:#1e293b;background:#fff;font-weight:600;box-shadow:0 1px 3px #0000001a}.file-item{border-radius:8px;align-items:center;gap:12px;padding:8px;display:flex}.file-item:hover{background:#f8fafc}.file-icon{background:#f1f5f9;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.file-details{flex-direction:column;flex:1;min-width:0;display:flex}.file-name{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:500;overflow:hidden}.file-size{color:#94a3b8;font-size:12px}.file-download-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px}.file-download-btn:hover{color:var(--primary)}.group-management-view,.main-info-view{animation:.25s ease-out fadeInSlide}@keyframes fadeInSlide{0%{opacity:0;transform:translate(15px)}to{opacity:1;transform:translate(0)}}.header-left{flex:1;align-items:center;gap:12px;display:flex}.back-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.back-info-btn:hover{background:#f1f5f9}.management-section{padding:16px 0}.management-section.border-top{border-top:1px solid #f1f5f9}.section-subtitle{color:#64748b;margin-bottom:16px;padding:0 4px;font-size:14px}.settings-list{flex-direction:column;display:flex}.setting-item{cursor:pointer;justify-content:space-between;align-items:center;padding:12px 4px;transition:background .2s;display:flex}.setting-item span{color:#1e293b;flex:1;padding-right:12px;font-size:14px;line-height:1.4}.setting-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.setting-item-switch{justify-content:space-between;align-items:center;padding:12px 4px;display:flex}.setting-info{flex:1;align-items:center;gap:8px;display:flex}.setting-info span{color:#1e293b;max-width:200px;font-size:14px;line-height:1.4}.help-icon{color:#94a3b8;cursor:pointer}.switch{flex-shrink:0;width:36px;height:20px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#e2e8f0;transition:all .4s;position:absolute;inset:0}.slider:before{content:\"\";background-color:#fff;width:14px;height:14px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(16px)}.slider.round{border-radius:20px}.slider.round:before{border-radius:50%}.management-menu{flex-direction:column;display:flex}.management-menu .menu-item{padding:12px 4px}.management-menu .menu-left svg{color:#64748b}.info-panel-clear-history{color:#d4183d;cursor:pointer;background:0 0;border:none;place-self:center;gap:4px;padding:7px 12px;display:flex}.info-panel-clear-history>span{margin-top:1px}\n .app-sidebar{background:var(--app-sidebar-bg);flex-direction:column;flex-shrink:0;align-items:center;gap:32px;width:64px;padding:12px 12px 24px;display:flex}.app-nav{flex-direction:column;flex:1;gap:16px;display:flex}.nav-item{color:#64748b;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.nav-item:hover{background:var(--active-item-bg);color:var(--primary)}.nav-item.active{background:var(--primary);color:var(--primary-contrast)}.nav-separator{opacity:.8;background:#98a8b3;width:40px;height:1px;margin:4px 0}.app-sidebar-footer{flex-direction:column;align-items:center;gap:20px;padding-bottom:8px;display:flex}.app-avatar{background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000d}.app-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.app-avatar-fallback{color:#64748b;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;font-weight:700;display:flex}\n .modal-overlay{z-index:9999;-webkit-backdrop-filter:blur();backdrop-filter:blur();background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.profile-modal-content{background:#fff;border-radius:20px;width:400px;padding:30px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScaleUp;position:relative;box-shadow:0 20px 40px #0003}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:5px;transition:all .2s;display:flex;position:absolute;top:20px;right:20px}.close-modal-btn:hover{color:#475569;background:#f1f5f9}.profile-header{text-align:center;margin-bottom:25px}.profile-avatar-wrapper{width:90px;height:90px;margin:0 auto 15px;position:relative}.profile-avatar-wrapper img{object-fit:cover;border:4px solid #f8fafc;border-radius:50%;width:100%;height:100%}.profile-avatar-placeholder{color:#fff;background:#3b82f6;border:4px solid #f8fafc;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:36px;font-weight:600;display:flex}.profile-online-status{background:#22c55e;border:3px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;bottom:5px;right:5px}.profile-name{color:#1e293b;margin-bottom:4px;font-size:20px;font-weight:700}.status-text{color:#64748b;font-size:13px}.profile-actions{gap:12px;margin-bottom:30px;display:flex}.profile-action-btn{cursor:pointer;color:#475569;background:#f8fafc;border:none;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:12px 8px;transition:all .2s;display:flex}.profile-action-btn:hover{color:#3b82f6;background:#f1f5f9;transform:translateY(-2px)}.profile-action-btn svg{color:#64748b;transition:color .2s}.profile-action-btn:hover svg{color:#3b82f6}.profile-action-btn span{font-size:13px;font-weight:600}.profile-details{border-top:1px solid #f1f5f9;padding-top:10px}.detail-item{border-bottom:1px solid #f1f5f9;justify-content:flex-start;align-items:center;padding:12px 0;font-size:14px;display:flex}.detail-item:last-child{border-bottom:none}.detail-item .label{color:#64748b;flex-shrink:0;width:110px}.detail-item .value{color:#1e293b;font-size:16px;font-weight:400}.value.email,.value.phone{color:#3b82f6;cursor:pointer}.value.email:hover,.value.phone:hover{text-decoration:underline}\n .modal-content.add-chat-modal{background:#fff;border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:450px;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;overflow:hidden;box-shadow:0 10px 40px #0000001a}.add-chat-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.add-chat-modal .modal-title{color:#1f2937;text-align:left;margin:0;font-size:18px;font-weight:600}.add-chat-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.add-chat-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.add-chat-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.add-chat-modal .group-info-section{align-items:center;gap:16px;display:flex}.add-chat-modal .group-avatar-upload{flex-shrink:0}.add-chat-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.add-chat-modal .upload-icon{color:#6b7280;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex;position:absolute;bottom:-2px;right:-2px}.add-chat-modal .preview-avatar{object-fit:cover;border-radius:100%;width:100%;height:100%}.add-chat-modal .group-name-input{border:none;border-bottom:1px solid #e5e7eb;outline:none;flex:1;padding:8px 0;font-size:16px;transition:border-color .2s}.add-chat-modal .group-name-input:focus{border-bottom-color:#3b82f6}.add-chat-modal .search-section .chat-search-bar{padding:0}.add-chat-modal .search-section .search-input{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:10px 16px 10px 40px;font-size:15px}.add-chat-modal .search-section .search-icon{left:16px}.add-chat-modal .selected-members-tags{flex-wrap:wrap;gap:8px;display:flex}.add-chat-modal .member-tag{color:#2563eb;background:#eff6ff;border-radius:100px;align-items:center;gap:6px;padding:4px 10px;font-size:14px;font-weight:500;display:flex}.add-chat-modal .member-tag>span{margin-bottom:-4px}.add-chat-modal .remove-tag-btn{color:#2563eb;cursor:pointer;opacity:.7;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;transition:opacity .2s;display:flex}.add-chat-modal .remove-tag-btn:hover{opacity:1}.modal-content.add-chat-modal.has-tags{height:550px}.add-chat-modal .members-list-container{border-top:1px solid #f3f4f6;flex:1;margin:0 -20px;padding:0 7px;overflow-y:hidden}.add-chat-modal .members-list{margin:0;padding:12px 0}.add-chat-modal .member-item{cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.add-chat-modal .member-item.selected{background:#f0f7ff}.add-chat-modal .member-item:hover{background:#f9fafb}.add-chat-modal .member-item.selected:hover{background:#e0efff}.add-chat-modal .member-checkbox{flex-shrink:0}.add-chat-modal .checkbox-custom{border:1.5px solid #d1d5db;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex}.add-chat-modal .checkbox-custom.checked{background:#3b82f6;border-color:#3b82f6}.add-chat-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.add-chat-modal .member-avatar{color:#4b5563;background:#f3f4f6;border:none;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;font-weight:600;display:flex;overflow:hidden}.add-chat-modal .member-avatar img{object-fit:cover;width:100%;height:100%}.add-chat-modal .avatar-letter{color:#fff;background:linear-gradient(135deg,#6366f1,#a855f7);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.add-chat-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.add-chat-modal .member-name{color:#374151;font-size:15px;font-weight:500}.add-chat-modal .modal-footer{border-top:1px solid #f3f4f6;justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.add-chat-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;font-size:15px;font-weight:600;transition:all .2s}.add-chat-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.add-chat-modal .footer-btn.cancel:hover{background:#e5e7eb}.add-chat-modal .footer-btn.confirm{color:#fff;background:#3b82f6}.add-chat-modal .footer-btn.confirm:hover:not(.disabled){background:#7a9ce9}.add-chat-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.display-none{display:none}.modal-content.update-group-modal{background:#fff;border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:450px;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;overflow:hidden;box-shadow:0 10px 40px #0000001a}.update-group-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.update-group-modal .modal-title{color:#1f2937;text-align:left;margin:0;font-size:18px;font-weight:600}.update-group-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.update-group-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.update-group-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.update-group-modal .group-info-section{align-items:center;gap:16px;display:flex}.update-group-modal .group-avatar-upload{cursor:pointer;flex-shrink:0}.update-group-modal .group-avatar-upload input{display:none}.update-group-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.update-group-modal .avatar-placeholder img{object-fit:cover;border-radius:50%;width:100%;height:100%}.update-group-modal .group-name-input{border:none;border-bottom:1px solid #e5e7eb;outline:none;flex:1;padding:8px 0;font-size:16px;transition:border-color .2s}.update-group-modal .group-name-input:focus{border-bottom-color:#3b82f6}.update-group-modal .members-section{margin-top:8px}.update-group-modal .section-title{padding-left:0;display:block}.update-group-modal .members-list-container{border-top:none;flex:1;height:240px;margin:0 -20px;padding:0 7px;overflow-y:hidden}.update-group-modal .members-list{margin:0;padding:12px 0}.update-group-modal .member-item{cursor:default;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.update-group-modal .member-item:hover{background:#f9fafb}.update-group-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.update-group-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.update-group-modal .member-info-wrapper{flex-direction:column;flex:1;gap:2px;display:flex}.update-group-modal .member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.update-group-modal .member-name{color:#1e293b;font-size:15px;font-weight:500}.update-group-modal .owner-icon{color:#64748b}.update-group-modal .member-role{color:#64748b;font-size:13px}.update-group-modal .remove-member-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:14px;display:flex}.update-group-modal .modal-footer{border-top:1px solid #f3f4f6;justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.update-group-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;font-size:15px;font-weight:600;transition:all .2s}.update-group-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.update-group-modal .footer-btn.cancel:hover{background:#e5e7eb}.update-group-modal .footer-btn.confirm{color:#fff;background:#3b82f6}.update-group-modal .footer-btn.confirm:hover:not(.disabled){background:#7a9ce9}.update-group-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}\n .contact-list-header>div{align-items:center;gap:8px;display:flex}.contact-list-toolbar{gap:12px}.toolbar-search{flex:1}.filter-select{position:relative}.avatar-placeholder{color:#fff;background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;font-weight:600;display:flex}.online-status.is-online{background:#22c55e}.online-status.is-offline{background:#94a3b8}.contact-action-btn{background:0 0;border:none}\n .chat-avatar-emoji{background-color:#fff;border-radius:100%;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.chat-avatar-img{object-fit:cover;border-radius:100%;width:100%;height:100%}\n", O = (e, t = 0, n = "Hội thoại không tên") => e ? e.name ? e.name : e.type === "group" ? n : e.members?.find((e) => e.id !== t)?.name ?? n : n, k = new Set([
|
|
10
|
+
var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family:Inter,-apple-system,sans-serif;font-size:16px;font-weight:400;line-height:24px;display:block;position:fixed;bottom:0;right:0}#chat-internal-root *{box-sizing:border-box;pointer-events:auto}#chat-internal-root ::-webkit-scrollbar{width:5px;height:5px}#chat-internal-root ::-webkit-scrollbar-thumb{background-color:#0000001a;border-radius:4px}#chat-internal-root ::-webkit-scrollbar-thumb:hover{background-color:#0003}.chatbot-container{width:100%;height:100%;position:relative}\n .floating-button{background:var(--primary);-webkit-backdrop-filter:blur(25px)saturate(150%);color:#fff;cursor:pointer;z-index:99999;border:1px solid #fff6;border-radius:20px;outline:none;justify-content:center;align-items:center;width:64px;height:64px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 12px 40px #0000000d,inset 0 0 0 1px #fff6}.floating-button:hover{transform:scale(1.1)rotate(5deg)}.floating-button:active{transform:scale(.95)}.floating-button .ping{pointer-events:none;background:#fff3;border-radius:16px;animation:2s cubic-bezier(0,0,.2,1) infinite ping;position:absolute;inset:0}@keyframes ping{75%,to{opacity:0;transform:scale(1.5)}}.floating-button .icon{z-index:10;font-size:24px;position:relative}\n .chat-window{--primary:#155dfc;--chat-bg:#fff;--chat-text:#101828;--chat-subtext:#6a7282;--chat-header-bg:#fff;--chat-border:#e5e7eb;--sidebar-bg:#fff}.chat-window.dark-theme{--chat-bg:color-mix(in srgb, var(--primary), #0f172a99 85%);--chat-text:#f8fafc;--chat-subtext:#94a3b8;--chat-header-bg:color-mix(in srgb, var(--primary), #1e293b99 80%);--chat-border:#334155;--sidebar-bg:color-mix(in srgb, var(--primary), #0f172a66 95%)}.chat-window{background:var(--chat-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--chat-border);z-index:99998;width:420px;height:640px;color:var(--chat-text);transform-origin:100% 100%;border-radius:14px;flex-direction:column;max-width:100%;max-height:100%;margin:0;transition:none;animation:.6s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;position:fixed;bottom:90px;right:20px;overflow:hidden;transform:none;box-shadow:0 8px 32px #0000005e,inset 0 0 0 1px #ffffff0d}.chat-window.fullpage{--chat-bg:#fff;--chat-header-bg:#fff;--chat-border:#f1f5f9;--sidebar-bg:#fff;--app-sidebar-bg:#f9f9f9;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;border-radius:16px;flex-direction:column;display:flex;transform:none}.chat-main-layout{--chat-bg:#fff;--chat-header-bg:#fff;--chat-border:#f1f5f9;--sidebar-bg:#fff;--active-item-bg:#f1f5f9;-webkit-backdrop-filter:none;z-index:9999;background-color:var(--app-sidebar-bg);border-radius:0;flex-direction:row;flex:1;width:100%;max-width:none;height:100vh;display:flex;inset:0;overflow:hidden;transform:none}.chat-window.fullpage.dark-theme{--chat-bg:#0f172a;--chat-header-bg:#1e293b;--chat-border:#334155;--sidebar-bg:#0f172a;--app-sidebar-bg:#1e293b;--active-item-bg:#334155;overflow:hidden}.chat-header{background:var(--chat-header-bg);color:var(--chat-text);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.header-info{align-items:center;gap:8px;display:flex}.header-logo{flex-shrink:0;justify-content:center;align-items:center;padding-left:6px;padding-right:8px;display:flex}.header-logo img,.header-logo .satek-icon{object-fit:contain;width:22px;height:22px}.back-btn{color:#64748b;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin-right:8px;padding:0;font-size:20px;display:flex}.header-info-text{align-items:center;gap:6px;min-width:0;display:flex}.header-dot{color:var(--chat-subtext);opacity:.6}.header-title{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.header-subtitle{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;font-size:16px;font-weight:400;overflow:hidden}.chat-body-container{border-top-left-radius:8px;flex-direction:row;flex:1;display:flex;position:relative;overflow:hidden}.chat-sidebar{background:var(--sidebar-bg);border-right:1px solid #0000000d;flex-direction:column;width:100%;transition:all .3s;display:flex}.chat-sidebar.is-full{flex-shrink:0;width:320px}.chat-search-bar{background:0 0;align-items:center;gap:4px;padding:12px 12px 4px;display:flex}.search-input-wrapper{flex:1;align-items:center;display:flex;position:relative}.search-icon{color:#94a3b8;pointer-events:none;width:16px;height:16px;position:absolute;left:12px}.search-input{color:#1e293b;background:#f3f4f6;border:1px solid #0000;border-radius:8px;outline:none;width:100%;padding:8px 36px;font-size:14px;transition:all .3s}.search-input:focus{background:#fff;border-color:#a855f74d;box-shadow:0 4px 12px #00000008}.clear-search{color:#94a3b8;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:18px;display:flex;position:absolute;right:10px}.clear-search:hover{color:#64748b}.sidebar-scroll{flex:1;padding:0 8px 20px;overflow-y:auto}.chat-filter-tabs{gap:24px;margin:0 12px;display:flex;position:relative}.chat-filter-tabs:before{content:\"\";background-color:#0000000d;height:1px;position:absolute;bottom:0;left:0;right:0}.chat-filter-tabs button{cursor:pointer;color:#667085;background:0 0;border:none;align-items:center;gap:6px;padding:8px 0;font-size:13px;font-weight:500;transition:all .2s;display:flex;position:relative}.chat-filter-tabs button.active{color:#155dfc;font-weight:600}.chat-filter-tabs button.active:after{content:\"\";z-index:1;background-color:#155dfc;border-radius:2px;height:2px;position:absolute;bottom:0;left:0;right:0}.filter-unread-badge-container{align-items:center;gap:6px;display:flex}.filter-unread-badge{color:#fff;background-color:#f04438;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:11px;font-weight:600;display:flex}.sidebar-scroll::-webkit-scrollbar{width:5px;margin-left:10px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#0000000d;border-radius:10px}.member-search-section{border-top:1px solid #00000008;margin-top:10px;padding:20px 0;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.member-search-section .section-header{color:var(--chat-text);text-transform:uppercase;letter-spacing:1px;padding:0 20px 12px;font-size:11px;font-weight:700}.member-search-section .members-list{max-height:none;padding:0 10px}.member-search-section .member-item{background:0 0;border:none;margin-bottom:4px;padding:10px 12px}.member-search-section .member-item:hover{background:#fff6}.chat-main{background:#ffffff1a;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.drag-overlay-full{pointer-events:none;z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;border:3px dashed #a855f7cc;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:absolute;inset:0}.drag-overlay-full .drag-content{color:#fff;text-shadow:0 2px 4px #0000004d;flex-direction:row;align-items:center;gap:12px;display:flex}.drag-overlay-full .drag-icon{font-size:20px;animation:.6s ease-in-out infinite bounce}.chat-list{background:0 0;flex:1;overflow-y:auto}.chat-item{cursor:pointer;border-radius:8px;align-items:center;gap:12px;height:64px;padding:8px;transition:background .1s ease-in-out;display:flex;position:relative}.chat-item:hover{background:#eff6ff99}.chat-item.active{background:#eff6ff}.chat-item-avatar{justify-content:center;align-items:center;width:32px;height:32px;font-size:22px;display:flex;position:relative}.online-indicator{z-index:1;background-color:#22c55e;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;bottom:-3px;right:2px}.chat-item-info{flex:1;overflow:hidden}.chat-item-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-item-last{flex:1;min-width:0}.last-message-text{color:var(--chat-subtext);white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;display:block;overflow:hidden}.info-bottom-right{flex-shrink:0;align-items:center;gap:4px;margin-top:4px;display:flex}.mute-icon-list{color:#94a3b8;flex-shrink:0}.chat-item.active .chat-item-last{color:var(--chat-text)}.unread-badge{color:#fff;z-index:2;background:linear-gradient(135deg,#f43f5e,#e11d48);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;min-width:18px;height:18px;padding:10px 7px;font-size:10px;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px;box-shadow:0 2px 4px #0000001a}.chat-item-time{color:var(--chat-subtext);white-space:nowrap}.chat-list-section{margin-bottom:16px}.empty-chat-list{padding:12px 8px 4px}.section-header{color:#64748b;text-transform:none;align-items:center;gap:6px;padding:12px 8px 4px;display:flex}.section-icon{color:#94a3b8}.info-top-row{justify-content:space-between;align-items:baseline;margin-bottom:2px;display:flex}.info-bottom-row{justify-content:space-between;align-items:center;display:flex}.unread-badge-circle{color:#fff;background-color:#3b82f6;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:8px;padding:0 5px;font-size:10px;font-weight:600;display:flex}.chat-options-wrapper{opacity:0;pointer-events:none;z-index:100;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)scale(.8)}.chat-item:hover .chat-options-wrapper,.chat-item.has-open-dropdown .chat-options-wrapper{opacity:1;pointer-events:auto;transform:translateY(-50%)scale(1)}.chat-options-btn{-webkit-backdrop-filter:blur(8px);color:#64748b;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.chat-options-btn:hover,.chat-options-btn.active{color:#1e293b;background:#ffffff4d;border-color:#fff6;transform:scale(1.05)}.chat-options-btn svg{width:18px;height:18px}.chat-options-dropdown{-webkit-backdrop-filter:blur(20px)saturate(160%);z-index:1000;background:#ffffffe6;border:1px solid #fff9;border-radius:14px;flex-direction:column;gap:4px;min-width:160px;padding:6px;animation:.2s cubic-bezier(.4,0,.2,1) dropdownFadeIn;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.dropdown-item{color:#334155;cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{color:#0f172a;background:#0000000a}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{color:#dc2626;background:#ef444414}.dropdown-icon{flex-shrink:0;width:16px;height:16px}.header-actions{gap:4px;display:flex}.action-btn{color:#667085;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#101828;background:#f2f4f7}.action-btn.close-btn:hover{color:#ef4444;background:#fee2e2}.add-group-btn{color:#667085;cursor:pointer;background:#f9fafb;border:1px solid #f2f4f7;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .2s;display:flex}.add-group-btn:hover{color:#101828;background:#f2f4f7;border-color:#eaecf0}.dark-theme .add-group-btn{color:#f8fafc;background:#1e293b66;border-color:#ffffff1a}.dark-theme .add-group-btn:hover{background:#1e293bcc;border-color:#fff3}.theme-toggle{background:#fff6;border:1px solid #ffffff80;border-radius:12px;font-size:16px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000000d}.theme-toggle:hover{background:#fff;box-shadow:0 8px 20px #0000001a;transform:rotate(15deg)scale(1.1)!important}.dark-theme .theme-toggle{color:#f8fafc;background:#1e293b66;border-color:#ffffff1a}.dark-theme .theme-toggle:hover{background:#1e293bcc;border-color:#fff3}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100000;background:#0006;justify-content:center;align-items:center;animation:.3s modalFadeIn;display:flex;position:absolute;inset:0}.modal-content{background:color-mix(in srgb, var(--primary), #ffffffb3 92%);-webkit-backdrop-filter:blur(30px)saturate(150%);border:1px solid #fffc;border-radius:36px;width:90%;max-width:380px;height:85%;padding:32px;animation:.4s cubic-bezier(.175,.885,.32,1.275) modalPopUp;overflow-y:auto;box-shadow:0 30px 60px #00000014}.dark-theme .modal-content{background:color-mix(in srgb, var(--primary), #1e293bb3 90%);color:#f8fafc;border-color:#ffffff1a}.modal-content::-webkit-scrollbar-track{margin:10px 0}.modal-title{color:var(--chat-text);text-align:center;letter-spacing:-.5px;margin-bottom:24px;font-size:22px;font-weight:800}.modal-input{color:#1e293b;background:#fff;border:1px solid #0000000d;border-radius:18px;outline:none;width:100%;margin-bottom:28px;padding:16px 20px;font-size:15px;transition:all .3s}.modal-input:focus{background:#ffffff14;border-color:#155dfc;box-shadow:0 0 0 4px #155dfc26}.members-section{margin-bottom:24px}.section-title{color:#64748b;text-transform:uppercase;letter-spacing:1px;padding-left:4px;font-size:11px;font-weight:700;display:block}.members-list{max-height:250px;margin:0 -4px;padding:4px;overflow-y:auto}.members-list::-webkit-scrollbar{width:5px}.members-list::-webkit-scrollbar-thumb{background:#4f46e533;border-radius:10px}.member-item{cursor:pointer;background:#fff6;border:1px solid #0000;border-radius:16px;align-items:center;gap:14px;padding:12px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.member-item:hover{background:#fffc}.remove-member-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;margin-left:auto;padding:6px;transition:all .2s;display:flex}.remove-member-btn:hover{color:#ef4444;background:#ef44441a;transform:scale(1.1)}.remove-member-btn svg{width:18px;height:18px}.member-avatar{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;display:flex;box-shadow:0 2px 5px #0000000d}.member-name{color:var(--chat-text);flex:1;font-size:14px;font-weight:600}.member-check{color:#fff;border:2px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.member-item.selected .member-check{background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#4f46e5;transform:scale(1.1)}.modal-actions{gap:12px;margin-top:8px;display:flex}.modal-btn{cursor:pointer;border:none;border-radius:16px;flex:1;padding:14px;font-size:14px;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1)}.modal-btn.cancel{color:#64748b;background:#f1f5f9cc}.modal-btn.cancel:hover{color:#0f172a;background:#f1f5f9}.modal-btn.confirm{color:#fff;background:linear-gradient(135deg,#6366f1,#4f46e5);box-shadow:0 10px 20px -5px #4f46e566}.modal-btn.confirm:hover{transform:translateY(-2px);box-shadow:0 15px 25px -5px #4f46e580}.modal-btn.disabled{color:#cbd5e1;cursor:not-allowed;box-shadow:none;background:#f1f5f9}.empty-chat-state h3{color:#1e293b;margin-bottom:8px;font-size:20px;font-weight:700}.empty-chat-state p{opacity:.8;font-size:15px}.modal-search-wrapper{margin-bottom:20px}.no-members-found{text-align:center;text-align:center;color:#9ca3af;background:#ffffff4d;border:1px dashed #0000000d;border-radius:16px;padding:20px;font-size:14px}.member-item.loading{cursor:not-allowed;opacity:.6}.member-add-action{color:#6366f1;background:#6366f11a;border-radius:6px;margin-left:auto;padding:4px 12px;font-size:13px;font-weight:700;transition:all .2s}.member-item:hover .member-add-action{color:#fff;background:#6366f1}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalPopUp{0%{opacity:0;transform:scale(.8)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.theme-modal{max-width:300px!important;height:auto!important;padding:24px!important}.modal-header{justify-content:space-between;align-items:center;display:flex}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px;font-size:24px;line-height:1}.theme-section{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.section-desc{color:#64748b;margin:0;font-size:13px;line-height:1.5}.color-presets{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:8px;display:grid}.color-preset-btn{aspect-ratio:1;cursor:pointer;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;padding:0;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 2px 8px #0000001a}.color-preset-btn:hover{transform:scale(1.1);box-shadow:0 4px 12px #00000026}.color-preset-btn.active{border-color:#334155;transform:scale(1.15)}.check-icon{color:#fff;text-shadow:0 0 2px #00000080;font-size:14px;font-weight:700}.custom-color-picker{background:#fff;border:1px solid #0000000d;border-radius:12px;align-items:center;gap:12px;margin-top:8px;padding:8px 12px;display:flex}.color-input{cursor:pointer;background:0 0;border:none;border-radius:6px;width:32px;height:32px;padding:0;overflow:hidden}.color-input::-webkit-color-swatch-wrapper{padding:0}.color-input::-webkit-color-swatch{border:none;border-radius:6px}.color-hex-code{color:#64748b;font-weight:600}.contact-categories{flex-direction:column;gap:8px;padding:8px;display:flex}.category-item{cursor:pointer;color:var(--chat-text);border-radius:8px;align-items:center;gap:12px;width:100%;height:40px;padding:10px 12px;font-weight:500;transition:all .2s;display:flex}.category-item:hover{color:#1e293b;background:#f1f5f9}.category-item.active{color:#1447e6;background:#eff6ff}.category-item .count{color:#99a1af;border-radius:10px;margin-left:auto;padding:2px 8px}.contact-list-view{background:#fff;flex-direction:column;flex:1;height:100%;display:flex}.contact-list-header{color:var(--chat-text);border-bottom:1px solid #f1f5f9;height:45px;padding:10px 16px}.contact-list-toolbar{justify-content:space-between;align-items:center;padding:12px 16px 20px;display:flex}.toolbar-left{align-items:center;gap:20px;display:flex}.toolbar-left span{color:#64748b;font-weight:500}.toolbar-search{background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;width:300px;height:36px;padding:12px;display:flex}.toolbar-search input{background:0 0;border:none;outline:none;width:100%;font-size:14px}.toolbar-right{gap:12px;height:36px;display:flex}.filter-select{cursor:pointer;color:#1e293b;background:#f3f4f6;border-radius:6px;align-items:center;gap:8px;padding:9px 12px;font-size:14px;display:flex}.dropdown-select{z-index:10;background:#fff;border:1px solid #e2e8f0;border-radius:8px;min-width:150px;margin-top:8px;position:absolute;top:100%;right:0;box-shadow:0 4px 6px #0000001a}.dropdown-select .dropdown-item{cursor:pointer;border-bottom:1px solid #e2e8f0;border-radius:0;align-items:center;gap:8px;height:40px;padding:12px 16px;display:flex}.dropdown-select .dropdown-item div{padding-top:3px}.contact-scroll-area{flex:1;padding:0 16px 16px;overflow-y:auto}.letter-title{color:var(--chat-subtext)}.contact-item-row{justify-content:space-between;align-items:center;height:64px;padding:12px 0;display:flex}.contact-item-left{align-items:center;gap:16px;display:flex}.contact-avatar{width:32px;height:32px;position:relative}.contact-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.contact-avatar .online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.contact-info{flex-direction:column;display:flex}.contact-name{color:var(--chat-text)}.contact-role{color:var(--chat-subtext)}.contact-item-actions{gap:8px;display:flex}.contact-action-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.contact-action-btn:hover{color:#1e293b;background:#f1f5f9;border-color:#cbd5e1}.chat-window.fullpage .chat-body-container{background:#fff;overflow:hidden;flex:1!important;width:100%!important;height:100%!important;display:flex!important}.chat-window.fullpage .chat-sidebar{border-right:1px solid var(--chat-border);background:#fff;flex-direction:column;flex-shrink:0;width:312px;display:flex}.chat-window.fullpage .chat-main{background:#fff;flex-direction:column;flex:1;display:flex;position:relative}.chat-main-header{border-bottom:1px solid var(--chat-border);background:#fff;flex-shrink:0;justify-content:space-between;align-items:center;min-height:64px;padding:12px 16px;display:flex}.chat-main-info{align-items:center;gap:10px;min-width:0;display:flex}.chat-main-avatar{flex-shrink:0;width:40px;height:40px}.chat-main-text{flex-direction:column;min-width:0;display:flex}.chat-main-text-container{align-items:center;gap:6px;display:flex}.chat-main-name{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;line-height:1.2;overflow:hidden}.chat-main-status{color:#94a3b8;margin-top:1px;font-size:13px}.chat-main-actions{flex-shrink:0;gap:4px;display:flex}.main-action-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;transition:all .2s;display:flex}.main-action-btn:hover{color:var(--primary);background:#f1f5f9}.chat-window.fullpage .chat-main-header{min-height:72px;padding:16px 24px}.chat-window.fullpage .chat-main-name{font-size:18px}.chat-window.fullpage .chat-main-actions{gap:8px;display:flex}.chat-window.fullpage .header-info-text{flex-direction:row;align-items:center;gap:6px}.chat-window.fullpage .header-subtitle{margin-top:0;font-size:16px}.chat-window.fullpage .chat-header .action-btn.theme-toggle{box-shadow:none;background:0 0}.chat-window.fullpage .chat-header{background-color:var(--app-sidebar-bg);height:45px;padding:8px 12px}.empty-chat-state{color:#94a3b8;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px;display:flex}.empty-icon{opacity:.5;margin-bottom:24px;font-size:64px}.empty-chat-state h3{color:#1e293b;margin-bottom:8px;font-size:20px}.empty-chat-state p{max-width:280px;font-size:14px;line-height:1.5}.search-section-title{color:#1e293b;align-items:center;gap:8px;margin-bottom:12px;font-size:16px;font-weight:700;display:flex}.search-count{color:#3b82f6;font-size:14px;font-weight:500}.search-section-content{flex-direction:column;gap:8px;display:flex}.search-result-item{cursor:pointer;border-radius:12px;align-items:center;gap:12px;height:64px;padding:8px;transition:all .2s;display:flex}.search-result-item:hover{background:#00000008}.search-result-avatar{border-radius:50%;flex-shrink:0;width:32px;height:32px;overflow:hidden}.search-result-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.avatar-placeholder{color:#fff;background:linear-gradient(135deg,#3b82f6,#2563eb);justify-content:center;align-items:center;width:100%;height:100%;font-size:18px;font-weight:600;display:flex}.search-result-info{flex:1;min-width:0}.search-result-name{color:var(--chat-text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.search-result-sub{color:#64748b;margin-top:2px;font-size:12px}.search-view-all{color:#64748b;cursor:pointer;background:#00000008;border:none;border-radius:8px;width:100%;margin-top:12px;padding:10px;font-size:13px;font-weight:500;transition:all .2s}.search-view-all:hover{color:#1e293b;background:#0000000f}.message-result .search-result-top{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.search-result-date{color:#94a3b8;font-size:11px}.search-result-text{color:#475569;-webkit-line-clamp:2;line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.file-icon-wrapper{color:#3b82f6;background:#3b82f61a;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.highlight-match{color:var(--primary);font-weight:500}.resize-handle.ne{cursor:ne-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;right:0}.resize-handle.nw{cursor:nw-resize;z-index:10001;width:15px;height:15px;position:absolute;top:0;left:0}.resize-handle.se{cursor:se-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;right:0}.resize-handle.sw{cursor:sw-resize;z-index:10001;width:15px;height:15px;position:absolute;bottom:0;left:0}\n .chat-input-area{background:#fff;border-top:1px solid #e5e7eb;align-items:center;gap:12px;padding:12px 16px;transition:all .3s;display:flex;position:relative}.chat-input-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.action-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.action-btn:hover{color:#374151;background:#f3f4f6}.action-btn.active{color:var(--primary);background:#f3f4f6}.chat-input-container{flex:1;align-items:center;display:flex}.chat-input{color:#1f2937;background:#f3f4f6;border:1px solid #0000;border-radius:8px;outline:none;width:100%;padding:10px 16px;font-size:14px;transition:all .2s}.chat-input::placeholder{color:#9ca3af}.chat-input:focus{background:#f3f4f6;border-color:#3b82f64d}.chat-input:disabled{opacity:.6;cursor:not-allowed}.send-btn{cursor:pointer;color:#fff;background:var(--primary,#8aaeff);width:36px;height:36px;box-shadow:none;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.send-btn:hover:not(:disabled){filter:brightness(.9);transform:translateY(-1px)}.send-btn:disabled{opacity:.6;cursor:not-allowed;background:#d1d5db}.send-btn svg{width:18px;height:18px}.emoji-picker{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:20px;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px;padding:12px;animation:.3s cubic-bezier(.34,1.56,.64,1) emojiSlideUp;display:grid;position:absolute;bottom:100%;left:16px;box-shadow:0 10px 30px #0000001a}@keyframes emojiSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.emoji-btn{cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:4px;font-size:20px;transition:all .2s;display:flex}.emoji-btn:hover{background:#fff;transform:scale(1.2);box-shadow:0 2px 5px #0000000d}.selected-files-list{background:#ffffff1a;border-bottom:1px solid #fff3;flex-wrap:nowrap;gap:12px;height:100px;padding:12px 20px;display:flex;overflow:auto hidden}.selected-file-item{background:#fef2f280;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:8px;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 8px #00000014}.selected-file-item.other-file{flex-direction:row}.selected-file-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.file-preview-image{object-fit:cover;border-radius:8px;width:54px;height:54px;display:block}.file-content-wrapper{flex-direction:row;align-items:center;gap:6px;display:flex}.file-icon{background:#f1f5f9;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:24px;display:flex}.file-info{flex-direction:column;gap:2px;min-width:0;display:flex}.file-name{color:#475569;white-space:nowrap;text-overflow:ellipsis;width:400px;max-width:100%;font-size:12px;overflow:hidden}.file-size{color:#94a3b8;white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-size:11px;overflow:hidden}.remove-file-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;transition:all .2s;display:flex;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 8px #ef44444d}.remove-file-btn:hover{background:#dc2626;transform:scale(1.1);box-shadow:0 4px 12px #ef444466}.remove-file-btn:disabled{opacity:.5;cursor:not-allowed}.selected-file-item.error-file-item{border:2px solid #ef4444;animation:.3s ease-in-out errorShake}@keyframes errorShake{0%{transform:translate(-3px)}50%{transform:translate(3px)}to{transform:translate(0)}}.selected-file-item.error-file-item:hover{background:#fef2f2b3;border-color:#dc2626}.file-size.error-size{color:#ef4444;font-weight:500}.reply-input-preview{background:#eff6ff;border-left:2px solid #2b7fff;border-top-left-radius:2px;border-bottom-left-radius:2px;justify-content:space-between;align-items:center;margin:0 10px 10px;padding:5px 20px;animation:.3s slideUp;display:flex;position:relative}.reply-content{flex-direction:column;flex:1;gap:2px;min-width:0;padding-left:18px;display:flex}.reply-user{color:#155dfc;margin-bottom:2px;font-size:.85rem;font-weight:700}.reply-user span{color:var(--primary,#155dfc)}.reply-text{color:#4a5565;white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.close-reply{color:#9ca3af;cursor:pointer;background:0 0;border:none;font-size:14px;transition:all .2s;position:absolute;top:0;right:0}.reply-icon{color:#155dfc;position:absolute;top:6px;left:10px}.close-reply:hover{color:#ef4444;transform:scale(1.1)}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.voice-recording-container{background:linear-gradient(135deg,#ef44441a,#ef44440d);border:1px solid #ef444433;flex:1;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recording-info{flex:1;align-items:center;gap:8px;display:flex}.recording-indicator{color:#374151;align-items:center;gap:6px;font-size:13px;font-weight:500;display:flex}.recording-dot{background:#ef4444;border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite recordingPulse}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}.recording-duration{color:#374151;text-align:right;min-width:45px;font-size:13px;font-weight:600}.voice-recorded-container{background:linear-gradient(135deg,#3b82f61a,#3b82f60d);border:1px solid #3b82f633;flex:1;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;animation:.2s slideUp;display:flex}.voice-recorded-info{flex:1;align-items:center;gap:8px;font-size:13px;display:flex}.voice-label{color:#1f2937;white-space:nowrap;font-weight:500}.voice-duration{color:#3b82f6;text-align:right;min-width:45px;margin-left:auto;font-weight:600}.voice-control-btn{color:#1f2937;cursor:pointer;background:#fff;border:1px solid #0000001a;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;transition:all .2s;display:flex}.voice-control-btn:hover{background:#f9fafb;transform:scale(1.05)}.voice-control-btn.cancel-btn{color:#ef4444;background:#ef44440d;border-color:#ef44441a}.voice-control-btn.add-btn{color:#fff;background:#8aaeff;border-color:#8aaeff}\n .message-list-wrapper{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.message-list{background:#f9fafb80;flex-direction:column-reverse;flex:1;gap:20px;padding:24px 20px;display:flex;overflow:hidden auto}.chat-date-divider{justify-content:center;align-items:center;width:100%;margin:20px 0;display:flex}.chat-date-divider span{color:#64748b;background:#f1f5f9;border-radius:20px;padding:4px 16px;font-size:12px;font-weight:500;box-shadow:0 1px 2px #0000000d}.message-item{gap:4px 8px;max-width:70%;display:flex;position:relative}.message-content{flex-direction:column;gap:4px;width:fit-content;max-width:100%;display:flex}.message-item.current-user .message-content{align-items:flex-end}.message-item.other-user .message-content{align-items:flex-start}.message-content-container{flex-direction:column;gap:12px;display:flex;position:relative}.message-item.current-user{flex-direction:row-reverse;align-self:flex-end}.message-item.other-user{align-self:flex-start}.message-bubble.current-user{background:#155dfc;align-self:flex-end}.message-bubble.other-user{background:#f3f4f6;border-radius:8px 16px 16px;align-self:flex-start}.message-avatar{object-fit:cover;cursor:pointer;border:2px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:transform .2s;box-shadow:0 4px 12px #00000026}.message-bubble{border-radius:16px 8px 16px 16px;grid-template-columns:minmax(0,1fr);padding:10px 16px;font-size:15px;line-height:1.6;display:grid;position:relative}.message-files{grid-template-columns:repeat(2,minmax(145px,1fr));align-content:start;align-items:center;gap:8px;max-width:100%;display:grid}.message-files>*{aspect-ratio:1.5;width:100%}.message-item .message-files>:last-child:nth-child(odd){grid-column:span 2}.message-item.current-user .message-files{align-self:flex-end}.message-item.other-user .message-files{align-self:flex-start}.file-item{cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:8px;align-items:center;gap:10px;max-height:60px;padding:8px 12px;text-decoration:none;transition:all .2s;display:flex}.file-item:hover{background:#ffffff40;border-color:#ffffff4d;transform:translate(4px)}.file-icon{flex-shrink:0;font-size:18px}.file-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.file-size{opacity:.7;color:inherit;font-size:11px}.file-image-wrapper{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:288px;margin-top:0;display:flex;position:relative;overflow:hidden}.file-image{object-fit:cover;cursor:pointer;border:1px solid #fff3;border-radius:8px;width:100%;height:100%;transition:transform .2s}.file-image:hover{transform:scale(1.05)}.image-overlay-more{cursor:pointer;background:#00000080;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;transition:all .2s;display:flex;position:absolute;top:0;left:0}.image-overlay-more:hover{background:#000000a6}.image-overlay-text{color:#fff;text-shadow:0 2px 4px #0000004d;font-size:28px;font-weight:600}.user .file-image{border-color:#ffffff4d}.message-actions-bar{-webkit-backdrop-filter:none;box-shadow:none;opacity:0;pointer-events:none;z-index:100;background:0 0;border:none;gap:2px;padding:0;transition:all .2s;display:flex;position:absolute;bottom:0}.message-item:hover .message-actions-bar{opacity:1;pointer-events:auto}.message-item.current-user .message-actions-bar{right:calc(100% + 8px)}.message-item.other-user .message-actions-bar{left:calc(100% + 8px)}.chat-window:not(.fullpage) .message-list{overflow-x:hidden}.chat-window:not(.fullpage) .message-item.current-user .message-actions-bar,.chat-window:not(.fullpage) .message-item.other-user .message-actions-bar{-webkit-backdrop-filter:blur(8px);background:#ffffffe6;border:1px solid #0000000d;border-radius:20px;gap:2px;padding:2px 6px;display:flex;inset:auto 0 -22px auto;transform:none;box-shadow:0 2px 8px #00000014}.chat-window:not(.fullpage) .message-item.other-user .message-member-name{margin-right:0}.chat-window:not(.fullpage) .action-icon svg{width:13px;height:13px}.chat-window:not(.fullpage) .action-icon{width:26px;height:26px}.action-icon{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.action-icon svg{stroke-width:2.2px;width:16px;height:16px}.action-icon:hover{background:#0000000d;transform:translateY(-2px)}.action-icon[title=Xóa]:hover,.action-icon[title=Thu\\ hồi]:hover{color:#ef4444;background:#ef44441a}.action-icon[title=Trả\\ lời]:hover{color:#3b82f6;background:#3b82f61a}.action-icon[title=Thích]:hover{color:#f59e0b;background:#f59e0b1a}.action-icon[title=Yêu\\ thích]:hover{color:#ec4899;background:#ec48991a}.message-reactions-badge{z-index:10;background:#fffffff2;border:1px solid #0000000d;border-radius:10px;align-items:center;gap:2px;padding:2px 6px;font-size:13px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;bottom:-11px;box-shadow:0 2px 8px #0000001a}.message-reactions-badge span{line-height:1}.message-item.current-user .message-reactions-badge{right:8px}.message-item.other-user .message-reactions-badge{left:8px}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.message-reply-preview{cursor:pointer;background:#0000001a;border-left:3px solid #ffffff80;border-radius:8px;min-width:120px;margin-bottom:8px;padding:6px 10px;font-size:.8rem;transition:all .2s}.message-bubble.other-user .message-reply-preview{border-left-color:var(--primary,#155dfc);background:#0000000d}.message-reply-preview:hover{background:#00000026}.reply-user-name{color:#fffffff2;white-space:nowrap;text-overflow:ellipsis;margin-bottom:2px;font-size:.75rem;font-weight:700;overflow:hidden}.message-bubble.other-user .reply-user-name{color:var(--primary,#155dfc)}.reply-content-text{color:#fffc;white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.message-bubble.other-user .reply-content-text{color:#475569}.message-text{overflow-wrap:break-word;word-break:break-word;width:auto;display:inline-block}.message-bubble.other-user .message-text{color:var(--chat-text)}.message-bubble.current-user .message-text{color:var(--primary-contrast,#f8fafc)}.message-bubble.other-user.revoked .message-text,.message-bubble.current-user.revoked .message-text{color:color-mix(in srgb, var(--chat-text), transparent 50%)}.message-member-name{color:#475569;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;min-width:0;margin-bottom:4px;font-size:15px;font-weight:500;overflow:hidden}.scroll-bottom-btn{-webkit-backdrop-filter:blur(8px);cursor:pointer;color:#4f46e5;z-index:1000;background:#ffffffb3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;transition:all .3s cubic-bezier(.4,0,.2,1);animation:.3s fadeInPop;display:flex;position:absolute;bottom:20px;right:20px;box-shadow:0 4px 15px #00000026}.scroll-bottom-btn:hover{background:#fff;transform:translateY(-4px);box-shadow:0 6px 20px #0003}.unread-dot{background-color:#ff4d4f;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:0;right:0}@keyframes fadeInPop{0%{opacity:0;transform:scale(.5)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.message-time{color:var(--chat-text);margin-top:2px;font-size:10px;font-weight:500}.message-item.current-user .message-time{text-align:right;margin-right:4px}.message-item.other-user .message-time{text-align:left;margin-left:4px}.message-item-status{color:var(--chat-text);margin-left:4px;font-size:10px;font-weight:400}.message-item-status.seen{color:#3b82f6;font-weight:600}.message-item-status.seen svg{margin-bottom:-2px}.message-bubble.revoked{opacity:.8;background:#ffffff0d;border:1px dashed #fff3;font-size:14px;font-style:italic}@keyframes highlight-fade{0%{background-color:rgba(var(--primary-rgb), .2);transform:scale(1.02)}to{background-color:#0000;transform:scale(1)}}.highlight-message .message-bubble{animation:2s ease-out highlight-fade}.see-more-btn{color:#3b82f6;cursor:pointer;margin-left:8px;font-size:.85em;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.message-bubble.current-user .see-more-btn{color:#ffffffe6;text-decoration:underline}.see-more-btn:hover{filter:brightness(1.1);text-decoration:underline}.message-bubble.current-user .see-more-btn:hover{color:#fff}\n .file-viewer-overlay{z-index:100001;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000e6;justify-content:center;align-items:center;animation:.2s ease-in-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.file-viewer-content{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-out slideUp;display:flex;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.file-viewer-main{border-radius:8px;justify-content:center;align-items:center;max-width:100%;max-height:70vh;display:flex;position:relative;overflow:hidden}.file-viewer-image{object-fit:contain;border-radius:8px;max-width:100%;max-height:70vh;box-shadow:0 10px 40px #0000004d}.file-viewer-main:has(.file-viewer-video){overflow:visible}.file-viewer-video{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}.video-container{justify-content:center;width:85vw;height:78vh;display:flex;overflow:visible}.file-viewer-close{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:24px;transition:all .2s;display:flex;position:absolute;top:30px;right:70px}.file-viewer-close:hover{background:#ffffff4d;border-color:#fff6;transform:scale(1.1)}.file-viewer-close:active{transform:scale(.95)}.file-viewer-nav{color:#fff;cursor:pointer;z-index:100001;text-align:center;background:#ffffff26;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:32px;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.file-viewer-nav:hover{background:#ffffff40;border-color:#ffffff4d}.file-viewer-nav:active{transform:translateY(-50%)scale(.95)}.file-viewer-prev{left:70px}.file-viewer-next{right:70px}@media (width<=768px){.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{top:10px;right:10px}}.file-viewer-counter{color:#fff;white-space:nowrap;z-index:100001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00000080;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:500;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.file-viewer-thumbnails-container{z-index:100001;opacity:0;pointer-events:none;visibility:hidden;justify-content:center;align-items:center;gap:2rem;width:100%;padding-bottom:3.5rem;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.file-viewer-thumbnails{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0000004d;border-radius:8px;gap:8px;max-width:60%;padding-top:12px;padding-bottom:12px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 10% 90%,#0000 100%)}.file-viewer-counter:hover~.file-viewer-thumbnails-container,.file-viewer-thumbnails-container:hover{opacity:1;visibility:visible;pointer-events:auto}.file-viewer-thumbnails::-webkit-scrollbar{height:4px}.file-viewer-thumbnails::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.file-viewer-thumbnails::-webkit-scrollbar-thumb:hover{background:#ffffff80}.file-viewer-thumbnails-scroll-btn{color:#fff;cursor:pointer;z-index:100002;-webkit-backdrop-filter:blur(10px)saturate(180%);backdrop-filter:blur(10px)saturate(180%);background:#fff3;border:1px solid #ffffff4d;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:18px;transition:all .3s;display:flex;box-shadow:0 8px 32px #1f26875e}.file-viewer-thumbnails-scroll-btn:hover{background:#ffffff4d;border-color:#ffffff80;transform:scale(1.05);box-shadow:0 8px 32px #1f268780}.file-viewer-thumbnails-scroll-btn:active{transform:scale(.95)}.file-viewer-thumbnail{cursor:pointer;background:#0000004d;border:2px solid #0000;border-radius:4px;width:60px;min-width:60px;height:60px;padding:0;transition:all .2s;overflow:hidden}.file-viewer-thumbnail:hover{background:#0006;border-color:#ffffff80}.file-viewer-thumbnail.active{background:#0003;border-color:#fffc}.thumbnail-image{object-fit:cover;width:100%;height:100%}.thumbnail-video{object-fit:cover;z-index:1;cursor:pointer;width:100%;height:100%}.video-thumbnail-container{border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.play-icon-overlay{z-index:2;pointer-events:none;cursor:pointer;background-color:#00000080;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:absolute}.play-arrow{color:#fff;margin-bottom:3px;margin-left:2px;font-size:18px}.file-viewer-overlay:has(.file-viewer-audio){background:0 0}.file-viewer-main:has(.file-viewer-audio){overflow:visible}.audio-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:visible}.audio-player-wrapper{-webkit-backdrop-filter:blur(30px)saturate(150%);backdrop-filter:blur(30px)saturate(150%);color:#1e293b;z-index:1000;background:#ffffff4d;border:1px solid #ffffff80;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:12px;width:100%;max-width:500px;padding:24px 20px;display:flex;position:relative;box-shadow:0 0 0 100vmax #000000e6}.file-viewer-audio{width:100%;height:40px}.file-viewer-audio::-webkit-media-controls-panel{background-color:#ffffff1a}.audio-name{color:#000;text-align:center;word-break:break-word;max-width:100%;margin:0;font-size:16px}.audio-thumbnail-container{background:linear-gradient(135deg,#6496ff80 0%,#c864ff80 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.audio-thumbnail-icon{font-size:28px}.pdf-thumbnail-container{background:linear-gradient(135deg,#f5222dcc 0%,#ff7a45cc 100%);border-radius:4px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.pdf-thumbnail-icon{font-size:28px}@media (width<=1024px){.file-viewer-content{max-width:95%}.file-viewer-image{max-height:60vh}.file-viewer-nav{width:40px;height:40px;font-size:24px}}@media (width<=600px){.file-viewer-overlay{inset:0}.file-viewer-content{max-width:100%;max-height:100vh}.file-viewer-main,.file-viewer-image{max-height:50vh}.file-viewer-nav{width:36px;height:36px;font-size:20px}.file-viewer-prev{left:10px}.file-viewer-next{right:10px}.file-viewer-close{width:36px;height:36px;font-size:20px;top:10px;right:10px}.file-viewer-counter{padding:6px 12px;font-size:12px;bottom:60px}.file-viewer-thumbnails{max-width:100%;padding:8px}.file-viewer-thumbnails-scroll-btn{width:32px;height:32px;font-size:16px}.file-viewer-thumbnail{width:50px;min-width:50px;height:50px}}.file-viewer-main:has(.file-viewer-pdf){overflow:visible}.file-viewer-content:has(.file-viewer-pdf) .file-viewer-close{top:5rem}.pdf-container{justify-content:center;width:100vw;height:100vh;display:flex;overflow:visible}.file-viewer-pdf{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 10px 40px #0000004d}\n .toast-container{z-index:100000;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:24px;right:24px}.confirm-overlay{z-index:100001;-webkit-backdrop-filter:blur(8px);pointer-events:auto;border-radius:inherit;background:#0f172a66;justify-content:center;align-items:center;animation:.3s ease-out confirm-fade-in;display:flex;position:absolute;inset:0}@keyframes confirm-fade-in{0%{opacity:0}to{opacity:1}}.confirm-toast{text-align:center;background:#fff;border:1px solid #fffc;border-radius:24px;flex-direction:column;align-items:center;gap:0;width:420px;min-width:420px;animation:.4s cubic-bezier(.175,.885,.32,1.275) confirm-pop-up;display:flex;overflow:visible;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a,0 0 0 1px #0000000d;padding:32px!important}.confirm-toast:before{display:none}@keyframes confirm-pop-up{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.confirm-modal-content{flex-direction:column;align-items:center;width:100%;display:flex}.confirm-toast .toast-message{color:#64748b;margin-bottom:32px;font-size:15px;font-weight:500;line-height:1.6}.confirm-toast .toast-actions{gap:12px;width:100%;display:flex}.confirm-toast .toast-btn{border-radius:16px;flex:1;padding:14px;font-size:15px;font-weight:700}.confirm-toast .toast-btn.cancel{color:#475569;background:#f1f5f9;border:none}.confirm-toast .toast-btn.cancel:hover{color:#1e293b;background:#e2e8f0}.dark-theme .confirm-toast{background:#1e293b;border-color:#ffffff1a}.dark-theme .confirm-title{color:#f8fafc}.dark-theme .confirm-toast .toast-message{color:#94a3b8}.dark-theme .confirm-toast .toast-btn.cancel{color:#cbd5e1;background:#334155}.dark-theme .confirm-toast .toast-btn.cancel:hover{color:#f8fafc;background:#475569}.dark-theme .confirm-toast.warning .confirm-icon{background:#f59e0b26}.toast-item{pointer-events:auto;color:#1e293b;background:#fff;border:1px solid #fff9;border-radius:20px;align-items:center;gap:12px;min-width:500px;max-width:calc(100% - 40px);padding:12px 16px;font-size:14px;font-weight:500;animation:.4s cubic-bezier(.175,.885,.32,1.275) toast-pop-in;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d,0 10px 15px -3px #0000001a}.toast-item:before{content:\"\";width:4px;transition:background .3s;position:absolute;top:0;bottom:0;left:0}.toast-item.success:before{background:#10b981}.toast-item.error:before{background:#ef4444}.toast-item.info:before{background:#3b82f6}.toast-item.warning:before{background:#f59e0b}.toast-item span{background:#00000008;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:16px;display:flex}.toast-item button{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.toast-item button:hover{color:#1e293b;background:#0000000d}@keyframes toast-pop-in{0%{opacity:0;transform:translate(20px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}.dark-theme .toast-item{color:#f8fafc;background:#1e293bb3;border-color:#ffffff14;box-shadow:0 20px 25px -5px #0003}.dark-theme .toast-item span{background:#ffffff0d}.toast-message{flex:1}.toast-actions{align-items:center;gap:12px;display:flex}.toast-btn{cursor:pointer;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;padding:8px 20px;font-size:14px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.toast-btn.cancel{color:#64748b;background:0 0;border:1px solid #00000014}.dark-theme .toast-btn.cancel{color:#94a3b8;border-color:#ffffff1a}.toast-btn.cancel:hover{background:#0000000d}.dark-theme .toast-btn.cancel:hover{background:#ffffff0d}.toast-btn.confirm{color:#fff;border:none;box-shadow:0 4px 6px -1px #0000001a}.toast-btn.confirm:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 10px 15px -3px #0000001a}.toast-btn.confirm:active{transform:translateY(0)}.toast-item.warning .toast-btn.confirm{background:linear-gradient(135deg,#f59e0b,#d97706)}.toast-item.success .toast-btn.confirm{background:linear-gradient(135deg,#10b981,#059669)}.toast-item.info .toast-btn.confirm{background:linear-gradient(135deg,#3b82f6,#2563eb)}.toast-item.error .toast-btn.confirm{background:linear-gradient(135deg,#ef4444,#dc2626)}.toast-close-btn{cursor:pointer;opacity:.5;color:inherit;background:0 0;border:none;justify-content:center;align-items:center;padding:0 0 0 8px;font-size:16px;display:flex}\n .side-bar-info-chat{border-left:1px solid var(--chat-border);background:#fff;flex-direction:column;flex-shrink:0;width:320px;display:flex}.info-header{justify-content:flex-end;padding:16px;display:flex}.close-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px}.close-info-btn:hover{background:#f1f5f9}.info-content-scroll{flex-direction:column;flex:1;padding:0 20px 20px;display:flex;overflow-y:auto}.info-content-scroll::-webkit-scrollbar{width:4px}.info-content-scroll::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.info-basic-section{text-align:center;flex-direction:column;align-items:center;display:flex}.info-avatar-large{width:80px;height:80px}.info-avatar-large .chat-avatar{font-size:24px}.info-main-details{flex-direction:column;display:flex}.info-chat-name{color:#1e293b;justify-content:center;align-items:center;gap:8px;margin-top:12px;margin-bottom:4px;font-size:18px;font-weight:700;display:flex}.info-status-icons{color:#94a3b8;gap:4px;display:flex}.info-member-count{color:#64748b;margin-top:0;margin-bottom:10px;font-size:14px}.info-quick-actions{justify-content:space-around;margin-bottom:24px;display:flex}.action-item{cursor:pointer;flex-direction:column;align-items:center;gap:8px;display:flex}.action-icon-info{color:#475569;background:#f8fafc;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:80px;height:60px;transition:all .2s;display:flex}.action-item:hover .action-icon-info{color:var(--primary);background:#f1f5f9}.action-item span{color:#475569;font-size:13px;font-weight:500}.menu-item{cursor:pointer;color:#1e293b;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:15px;font-weight:500;display:flex}.menu-item:hover{background:#f8fafc}.menu-left{align-items:center;gap:12px;display:flex}.info-members-section{padding:16px 0}.section-title-row{color:#64748b;justify-content:space-between;align-items:center;margin-bottom:12px;padding:0 4px;font-size:14px;font-weight:600;display:flex}.title-actions{color:#94a3b8;gap:8px;display:flex}.title-actions svg{cursor:pointer}.arrow-icon{transition:transform .2s}.arrow-icon.collapsed{transform:rotate(-180deg)}.member-item-left.clickable{cursor:pointer}.members-compact-list{flex-direction:column;display:flex}.members-facepile{align-items:center;padding:8px 4px;display:flex}.facepile-item{z-index:1;border:2px solid #fff;border-radius:50%;width:32px;height:32px;margin-left:-8px;transition:transform .2s;position:relative}.facepile-item:first-child{margin-left:0}.facepile-item:hover{z-index:10;transform:translateY(-4px)}.facepile-item .member-avatar-small{width:100%;height:100%}.facepile-item .online-status{border-width:1.5px;width:8px;height:8px;bottom:0;right:0}.facepile-more{color:#64748b;z-index:0;cursor:pointer;background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;margin-left:-8px;font-size:11px;font-weight:700;display:flex}.facepile-more:hover{background:#e2e8f0}.member-compact-item{border-radius:8px;justify-content:space-between;align-items:center;padding:8px;transition:background .2s;display:flex;position:relative}.member-compact-item:hover{background:#f8fafc}.member-item-left{align-items:center;gap:8px;display:flex}.member-avatar-small{border-radius:50%;width:32px;height:32px;position:relative}.member-avatar-small img,.member-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.member-initials{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;font-weight:600;display:flex}.member-info{flex-direction:column;gap:2px;display:flex}.member-options-container{align-items:center;display:flex;position:relative}.member-options-btn{color:#94a3b8;cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.member-compact-item:hover .member-options-btn{opacity:1}.member-options-btn:hover{color:#475569;background:#e2e8f0}.member-dropdown-menu{z-index:100;background:#fff;border:1px solid #f1f5f9;border-radius:12px;width:190px;margin-top:4px;padding:6px;animation:.2s fadeIn;position:absolute;top:100%;right:0;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{color:#1e293b;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;width:100%;padding:10px 12px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{background:#f1f5f9}.dropdown-item.delete{color:#ef4444}.dropdown-item.delete:hover{background:#fef2f2}.dropdown-item svg{flex-shrink:0}.member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.member-role{color:#64748b;font-size:12px}.online-status{background:#22c55e;border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;bottom:0;right:0}.info-summary-section{padding:16px 0}.info-summary-section .section-title{color:#64748b;margin-bottom:12px;font-size:14px;font-weight:600}.summary-tabs{background:#f1f5f9;border-radius:8px;margin-bottom:16px;padding:4px;display:flex}.tab-item{text-align:center;color:#64748b;cursor:pointer;border-radius:6px;flex:1;padding:6px;font-size:13px}.tab-item.active{color:#1e293b;background:#fff;font-weight:600;box-shadow:0 1px 3px #0000001a}.file-item{border-radius:8px;align-items:center;gap:12px;padding:8px;display:flex}.file-item:hover{background:#f8fafc}.file-icon{background:#f1f5f9;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.file-details{flex-direction:column;flex:1;min-width:0;display:flex}.file-name{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:500;overflow:hidden}.file-size{color:#94a3b8;font-size:12px}.file-download-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:4px}.file-download-btn:hover{color:var(--primary)}.group-management-view,.main-info-view{animation:.25s ease-out fadeInSlide}@keyframes fadeInSlide{0%{opacity:0;transform:translate(15px)}to{opacity:1;transform:translate(0)}}.header-left{flex:1;align-items:center;gap:12px;display:flex}.back-info-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.back-info-btn:hover{background:#f1f5f9}.management-section{padding:16px 0}.management-section.border-top{border-top:1px solid #f1f5f9}.section-subtitle{color:#64748b;margin-bottom:16px;padding:0 4px;font-size:14px}.settings-list{flex-direction:column;display:flex}.setting-item{cursor:pointer;justify-content:space-between;align-items:center;padding:12px 4px;transition:background .2s;display:flex}.setting-item span{color:#1e293b;flex:1;padding-right:12px;font-size:14px;line-height:1.4}.setting-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.setting-item-switch{justify-content:space-between;align-items:center;padding:12px 4px;display:flex}.setting-info{flex:1;align-items:center;gap:8px;display:flex}.setting-info span{color:#1e293b;max-width:200px;font-size:14px;line-height:1.4}.help-icon{color:#94a3b8;cursor:pointer}.switch{flex-shrink:0;width:36px;height:20px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#e2e8f0;transition:all .4s;position:absolute;inset:0}.slider:before{content:\"\";background-color:#fff;width:14px;height:14px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(16px)}.slider.round{border-radius:20px}.slider.round:before{border-radius:50%}.management-menu{flex-direction:column;display:flex}.management-menu .menu-item{padding:12px 4px}.management-menu .menu-left svg{color:#64748b}.info-panel-clear-history{color:#d4183d;cursor:pointer;background:0 0;border:none;place-self:center;gap:4px;padding:7px 12px;display:flex}.info-panel-clear-history>span{margin-top:1px}\n .app-sidebar{background:var(--app-sidebar-bg);flex-direction:column;flex-shrink:0;align-items:center;gap:32px;width:64px;padding:12px 12px 24px;display:flex}.app-nav{flex-direction:column;flex:1;gap:16px;display:flex}.nav-item{color:#64748b;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.nav-item:hover{background:var(--active-item-bg);color:var(--primary)}.nav-item.active{background:var(--primary);color:var(--primary-contrast)}.nav-separator{opacity:.8;background:#98a8b3;width:40px;height:1px;margin:4px 0}.app-sidebar-footer{flex-direction:column;align-items:center;gap:20px;padding-bottom:8px;display:flex}.app-avatar{background:#f1f5f9;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000d}.app-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}.app-avatar-fallback{color:#64748b;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;font-weight:700;display:flex}\n .modal-overlay{z-index:9999;-webkit-backdrop-filter:blur();backdrop-filter:blur();background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.profile-modal-content{background:#fff;border-radius:20px;width:400px;padding:30px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScaleUp;position:relative;box-shadow:0 20px 40px #0003}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.close-modal-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:5px;transition:all .2s;display:flex;position:absolute;top:20px;right:20px}.close-modal-btn:hover{color:#475569;background:#f1f5f9}.profile-header{text-align:center;margin-bottom:25px}.profile-avatar-wrapper{width:90px;height:90px;margin:0 auto 15px;position:relative}.profile-avatar-wrapper img{object-fit:cover;border:4px solid #f8fafc;border-radius:50%;width:100%;height:100%}.profile-avatar-placeholder{color:#fff;background:#3b82f6;border:4px solid #f8fafc;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:36px;font-weight:600;display:flex}.profile-online-status{background:#22c55e;border:3px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;bottom:5px;right:5px}.profile-name{color:#1e293b;margin-bottom:4px;font-size:20px;font-weight:700}.status-text{color:#64748b;font-size:13px}.profile-actions{gap:12px;margin-bottom:30px;display:flex}.profile-action-btn{cursor:pointer;color:#475569;background:#f8fafc;border:none;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:12px 8px;transition:all .2s;display:flex}.profile-action-btn:hover{color:#3b82f6;background:#f1f5f9;transform:translateY(-2px)}.profile-action-btn svg{color:#64748b;transition:color .2s}.profile-action-btn:hover svg{color:#3b82f6}.profile-action-btn span{font-size:13px;font-weight:600}.profile-details{border-top:1px solid #f1f5f9;padding-top:10px}.detail-item{border-bottom:1px solid #f1f5f9;justify-content:flex-start;align-items:center;padding:12px 0;font-size:14px;display:flex}.detail-item:last-child{border-bottom:none}.detail-item .label{color:#64748b;flex-shrink:0;width:110px}.detail-item .value{color:#1e293b;font-size:16px;font-weight:400}.value.email,.value.phone{color:#3b82f6;cursor:pointer}.value.email:hover,.value.phone:hover{text-decoration:underline}\n .modal-content.add-chat-modal{background:#fff;border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:450px;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;overflow:hidden;box-shadow:0 10px 40px #0000001a}.add-chat-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.add-chat-modal .modal-title{color:#1f2937;text-align:left;margin:0;font-size:18px;font-weight:600}.add-chat-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.add-chat-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.add-chat-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.add-chat-modal .group-info-section{align-items:center;gap:16px;display:flex}.add-chat-modal .group-avatar-upload{flex-shrink:0}.add-chat-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.add-chat-modal .upload-icon{color:#6b7280;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex;position:absolute;bottom:-2px;right:-2px}.add-chat-modal .preview-avatar{object-fit:cover;border-radius:100%;width:100%;height:100%}.add-chat-modal .group-name-input{border:none;border-bottom:1px solid #e5e7eb;outline:none;flex:1;padding:8px 0;font-size:16px;transition:border-color .2s}.add-chat-modal .group-name-input:focus{border-bottom-color:#3b82f6}.add-chat-modal .search-section .chat-search-bar{padding:0}.add-chat-modal .search-section .search-input{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:10px 16px 10px 40px;font-size:15px}.add-chat-modal .search-section .search-icon{left:16px}.add-chat-modal .selected-members-tags{flex-wrap:wrap;gap:8px;display:flex}.add-chat-modal .member-tag{color:#2563eb;background:#eff6ff;border-radius:100px;align-items:center;gap:6px;padding:4px 10px;font-size:14px;font-weight:500;display:flex}.add-chat-modal .member-tag>span{margin-bottom:-4px}.add-chat-modal .remove-tag-btn{color:#2563eb;cursor:pointer;opacity:.7;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;transition:opacity .2s;display:flex}.add-chat-modal .remove-tag-btn:hover{opacity:1}.modal-content.add-chat-modal.has-tags{height:550px}.add-chat-modal .members-list-container{border-top:1px solid #f3f4f6;flex:1;margin:0 -20px;padding:0 7px;overflow-y:hidden}.add-chat-modal .members-list{margin:0;padding:12px 0}.add-chat-modal .member-item{cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.add-chat-modal .member-item.selected{background:#f0f7ff}.add-chat-modal .member-item:hover{background:#f9fafb}.add-chat-modal .member-item.selected:hover{background:#e0efff}.add-chat-modal .member-checkbox{flex-shrink:0}.add-chat-modal .checkbox-custom{border:1.5px solid #d1d5db;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;transition:all .2s;display:flex}.add-chat-modal .checkbox-custom.checked{background:#3b82f6;border-color:#3b82f6}.add-chat-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.add-chat-modal .member-avatar{color:#4b5563;background:#f3f4f6;border:none;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;font-weight:600;display:flex;overflow:hidden}.add-chat-modal .member-avatar img{object-fit:cover;width:100%;height:100%}.add-chat-modal .avatar-letter{color:#fff;background:linear-gradient(135deg,#6366f1,#a855f7);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.add-chat-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.add-chat-modal .member-name{color:#374151;font-size:15px;font-weight:500}.add-chat-modal .modal-footer{border-top:1px solid #f3f4f6;justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.add-chat-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;font-size:15px;font-weight:600;transition:all .2s}.add-chat-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.add-chat-modal .footer-btn.cancel:hover{background:#e5e7eb}.add-chat-modal .footer-btn.confirm{color:#fff;background:#3b82f6}.add-chat-modal .footer-btn.confirm:hover:not(.disabled){background:#7a9ce9}.add-chat-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}.display-none{display:none}.modal-content.update-group-modal{background:#fff;border:1px solid #0000000d;border-radius:10px;flex-direction:column;width:450px;max-width:450px;height:auto;min-height:430px;max-height:90vh;padding:0;display:flex;overflow:hidden;box-shadow:0 10px 40px #0000001a}.update-group-modal .modal-header{justify-content:space-between;align-items:center;padding:16px 20px 0;display:flex}.update-group-modal .modal-title{color:#1f2937;text-align:left;margin:0;font-size:18px;font-weight:600}.update-group-modal .close-modal-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.update-group-modal .close-modal-btn:hover{color:#111827;background:#f3f4f6}.update-group-modal .modal-body{flex-direction:column;flex:1;gap:8px;padding:20px 20px 0;display:flex;overflow:hidden}.update-group-modal .group-info-section{align-items:center;gap:16px;display:flex}.update-group-modal .group-avatar-upload{cursor:pointer;flex-shrink:0}.update-group-modal .group-avatar-upload input{display:none}.update-group-modal .avatar-placeholder{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:relative}.update-group-modal .avatar-placeholder img{object-fit:cover;border-radius:50%;width:100%;height:100%}.update-group-modal .group-name-input{border:none;border-bottom:1px solid #e5e7eb;outline:none;flex:1;padding:8px 0;font-size:16px;transition:border-color .2s}.update-group-modal .group-name-input:focus{border-bottom-color:#3b82f6}.update-group-modal .members-section{margin-top:8px}.update-group-modal .section-title{padding-left:0;display:block}.update-group-modal .members-list-container{border-top:none;flex:1;height:240px;margin:0 -20px;padding:0 7px;overflow-y:hidden}.update-group-modal .members-list{margin:0;padding:12px 0}.update-group-modal .member-item{cursor:default;background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px 12px;transition:background .2s;display:flex}.update-group-modal .member-item:hover{background:#f9fafb}.update-group-modal .member-avatar-wrapper{width:32px;height:32px;position:relative}.update-group-modal .status-dot{width:12px;height:12px;position:absolute;bottom:-1px;right:-1px}.update-group-modal .member-info-wrapper{flex-direction:column;flex:1;gap:2px;display:flex}.update-group-modal .member-name-row{align-items:center;gap:4px;width:fit-content;display:flex}.update-group-modal .member-name{color:#1e293b;font-size:15px;font-weight:500}.update-group-modal .owner-icon{color:#64748b}.update-group-modal .member-role{color:#64748b;font-size:13px}.update-group-modal .remove-member-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:14px;display:flex}.update-group-modal .modal-footer{border-top:1px solid #f3f4f6;justify-content:flex-end;gap:12px;padding:11px 20px;display:flex}.update-group-modal .footer-btn{cursor:pointer;border:none;border-radius:10px;padding:10px 24px;font-size:15px;font-weight:600;transition:all .2s}.update-group-modal .footer-btn.cancel{color:#4b5563;background:#f3f4f6}.update-group-modal .footer-btn.cancel:hover{background:#e5e7eb}.update-group-modal .footer-btn.confirm{color:#fff;background:#3b82f6}.update-group-modal .footer-btn.confirm:hover:not(.disabled){background:#7a9ce9}.update-group-modal .footer-btn.disabled{opacity:.6;cursor:not-allowed}\n .contact-list-header>div{align-items:center;gap:8px;display:flex}.contact-list-toolbar{gap:12px}.toolbar-search{flex:1}.filter-select{position:relative}.avatar-placeholder{color:#fff;background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;font-weight:600;display:flex}.online-status.is-online{background:#22c55e}.online-status.is-offline{background:#94a3b8}.contact-action-btn{background:0 0;border:none}\n .chat-avatar-emoji{background-color:#fff;border-radius:100%;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.chat-avatar-img{object-fit:cover;border-radius:100%;width:100%;height:100%}\n", O = (e, t = 0, n = "Hội thoại không tên") => e ? e.name ? e.name : e.type === "group" ? n : e.members?.find((e) => e.id !== t)?.name ?? n : n, k = new Set([
|
|
11
11
|
"pdf",
|
|
12
12
|
"doc",
|
|
13
13
|
"docx",
|
|
@@ -41,8 +41,9 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
41
41
|
hasMultipleAttachments: a.has("multiple"),
|
|
42
42
|
hasAttachment: (t && t?.length > 0) ?? !1,
|
|
43
43
|
hasGroupChat: s.has("group"),
|
|
44
|
+
hasSingleChat: s.has("single"),
|
|
44
45
|
hasChangeColor: c.has("change-color"),
|
|
45
|
-
hasMultipleLanguages:
|
|
46
|
+
hasMultipleLanguages: !1
|
|
46
47
|
};
|
|
47
48
|
}, M = (e) => Object.keys(A).filter((t) => e.attachments.has(t)).map((e) => A[e]).join(","), ee = (e) => (t) => {
|
|
48
49
|
let n = t.type;
|
|
@@ -51,11 +52,11 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
51
52
|
if (n.startsWith("audio/")) return e.attachments.has("audio");
|
|
52
53
|
let r = t.name.split(".").pop()?.toLowerCase() ?? "";
|
|
53
54
|
return k.has(r), e.attachments.has("file");
|
|
54
|
-
},
|
|
55
|
+
}, N = (e) => {
|
|
55
56
|
if (!e) return !1;
|
|
56
57
|
let t = new Date(e).getTime();
|
|
57
58
|
return Date.now() - t <= 300 * 1e3;
|
|
58
|
-
},
|
|
59
|
+
}, P = (e) => {
|
|
59
60
|
let t = new Date(e), n = /* @__PURE__ */ new Date(), r = new Date(n.getFullYear(), n.getMonth(), n.getDate()), i = new Date(r);
|
|
60
61
|
i.setDate(i.getDate() - 1);
|
|
61
62
|
let a = new Date(t.getFullYear(), t.getMonth(), t.getDate());
|
|
@@ -64,26 +65,26 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
64
65
|
month: "2-digit",
|
|
65
66
|
year: "numeric"
|
|
66
67
|
});
|
|
67
|
-
},
|
|
68
|
+
}, te = (e) => {
|
|
68
69
|
let t = Math.floor(e / 1e3);
|
|
69
70
|
return `${Math.floor(t / 60)}:${(t % 60).toString().padStart(2, "0")}`;
|
|
70
|
-
},
|
|
71
|
-
|
|
71
|
+
}, F = null, ne = async (e) => {
|
|
72
|
+
F || (F = await C(), F.configure({
|
|
72
73
|
sampleRate: 44100,
|
|
73
74
|
channels: 1,
|
|
74
75
|
bitrate: 128
|
|
75
76
|
}));
|
|
76
77
|
let t = (await new AudioContext().decodeAudioData(await e.arrayBuffer())).getChannelData(0), n = [], r = 1152;
|
|
77
78
|
for (let e = 0; e < t.length; e += r) {
|
|
78
|
-
let i = t.subarray(e, e + r), a =
|
|
79
|
+
let i = t.subarray(e, e + r), a = F.encode([i]);
|
|
79
80
|
a && a.length > 0 && n.push(new Uint8Array(a));
|
|
80
81
|
}
|
|
81
|
-
let i =
|
|
82
|
-
i && i.length > 0 && n.push(new Uint8Array(i)),
|
|
82
|
+
let i = F.finalize();
|
|
83
|
+
i && i.length > 0 && n.push(new Uint8Array(i)), F = null;
|
|
83
84
|
let a = n.reduce((e, t) => e + t.length, 0), o = new Uint8Array(a), s = 0;
|
|
84
85
|
for (let e of n) o.set(e, s), s += e.length;
|
|
85
86
|
return new Blob([o], { type: "audio/mp3" });
|
|
86
|
-
},
|
|
87
|
+
}, I = 25 * 1024 * 1024, re = [
|
|
87
88
|
"🙂",
|
|
88
89
|
"😀",
|
|
89
90
|
"😂",
|
|
@@ -102,7 +103,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
102
103
|
"💯",
|
|
103
104
|
"✅",
|
|
104
105
|
"❌"
|
|
105
|
-
],
|
|
106
|
+
], L = {
|
|
106
107
|
pdf: "📄",
|
|
107
108
|
doc: "📄",
|
|
108
109
|
docx: "📄",
|
|
@@ -125,12 +126,12 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
125
126
|
mov: "🎬",
|
|
126
127
|
mkv: "🎬",
|
|
127
128
|
default: "📎"
|
|
128
|
-
},
|
|
129
|
-
if (!
|
|
129
|
+
}, R = (e) => e && L[e.includes(".") ? e.split(".").pop()?.toLowerCase() ?? "" : e.toLowerCase()] || "📎", ie = /* @__PURE__ */ new WeakMap(), ae = (e) => {
|
|
130
|
+
if (!ie.has(e)) {
|
|
130
131
|
let t = Math.random().toString(36).substring(2, 9);
|
|
131
|
-
|
|
132
|
+
ie.set(e, `${e.name}-${e.size}-${t}`);
|
|
132
133
|
}
|
|
133
|
-
return
|
|
134
|
+
return ie.get(e);
|
|
134
135
|
}, oe = (e) => {
|
|
135
136
|
if (e === 0) return "0 B";
|
|
136
137
|
let t = 1024, n = [
|
|
@@ -140,7 +141,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
140
141
|
"GB"
|
|
141
142
|
], r = Math.floor(Math.log(e) / Math.log(t));
|
|
142
143
|
return Math.round(e / t ** +r * 100) / 100 + " " + n[r];
|
|
143
|
-
},
|
|
144
|
+
}, se = (e) => {
|
|
144
145
|
let t = e.split(".").pop()?.toLowerCase() ?? "";
|
|
145
146
|
return [
|
|
146
147
|
"jpg",
|
|
@@ -163,13 +164,13 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
163
164
|
"ogg",
|
|
164
165
|
"wma"
|
|
165
166
|
].includes(t) ? "audio" : "other";
|
|
166
|
-
},
|
|
167
|
+
}, ce = (e) => URL.createObjectURL(e), le = (e) => e.type.startsWith("image/"), z = (e) => {
|
|
167
168
|
let t = (e) => {
|
|
168
169
|
let t = e.name.toLowerCase().split(".").pop() ?? "";
|
|
169
170
|
return e.type.startsWith("image/") ? 0 : t === "mp4" ? 1 : t === "mp3" ? 2 : 3;
|
|
170
171
|
};
|
|
171
172
|
return [...e].sort((e, n) => t(e) - t(n));
|
|
172
|
-
},
|
|
173
|
+
}, ue = (e) => new Promise((t) => {
|
|
173
174
|
if (!e.type.startsWith("image/")) {
|
|
174
175
|
t(e);
|
|
175
176
|
return;
|
|
@@ -197,14 +198,14 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
197
198
|
}, a, s);
|
|
198
199
|
}, r.onerror = () => t(e), r.src = n.target?.result;
|
|
199
200
|
}, n.onerror = () => t(e), n.readAsDataURL(e);
|
|
200
|
-
}),
|
|
201
|
+
}), B = (e, t, n) => e.length === 0 ? null : !t && e.length > 1 ? {
|
|
201
202
|
message: "Chỉ cho phép đính kèm tối đa 1 file.",
|
|
202
203
|
type: "warning"
|
|
203
204
|
} : e.length > 20 ? {
|
|
204
205
|
message: "Chỉ cho phép tối đa 20 file.",
|
|
205
206
|
type: "warning"
|
|
206
207
|
} : e.some((e) => e.isError) ? {
|
|
207
|
-
message: `Vui lòng loại bỏ các file bị lỗi (vượt quá ${
|
|
208
|
+
message: `Vui lòng loại bỏ các file bị lỗi (vượt quá ${I / (1024 * 1024)} MB).`,
|
|
208
209
|
type: "warning"
|
|
209
210
|
} : e.every(n) ? null : {
|
|
210
211
|
message: "Vui lòng chỉ chọn các loại file được phép.",
|
|
@@ -247,7 +248,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
247
248
|
},
|
|
248
249
|
setMembers: (e, t) => {
|
|
249
250
|
e.members = t.payload.map((e) => {
|
|
250
|
-
let t =
|
|
251
|
+
let t = N(e.socket_at);
|
|
251
252
|
return {
|
|
252
253
|
...e,
|
|
253
254
|
socket_ids: e.socket_ids ?? (t && e.socket_id ? [e.socket_id] : []),
|
|
@@ -258,7 +259,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
258
259
|
},
|
|
259
260
|
setCurrentChatMembers: (e, t) => {
|
|
260
261
|
e.currentChatMembers = t.payload.map((e) => {
|
|
261
|
-
let t =
|
|
262
|
+
let t = N(e.socket_at);
|
|
262
263
|
return {
|
|
263
264
|
...e,
|
|
264
265
|
socket_ids: e.socket_ids ?? (t && e.socket_id ? [e.socket_id] : []),
|
|
@@ -373,7 +374,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
373
374
|
i && (i[r] = !i[r]), e.currentChat?.id === n && (e.currentChat[r] = !e.currentChat[r]);
|
|
374
375
|
}
|
|
375
376
|
}
|
|
376
|
-
}), { clearAll: pe, setCurrentUser: me, setChats: he, setCurrentChat: V, setCurrentChatMessages: ge, setCurrentChatMembers: _e, setMembers:
|
|
377
|
+
}), { clearAll: pe, setCurrentUser: me, setChats: he, setCurrentChat: V, setCurrentChatMessages: ge, setCurrentChatMembers: _e, setMembers: H, setMember: ve, setMemberDisconnect: ye, setMessagesPagination: be, prependMessages: xe, addNewMessage: Se, removeChat: Ce, addChat: we, updateChat: Te, updateChatAvatar: Ee, removeMessage: De, updateMessage: Oe, setReplyingMessage: ke, setTotalMessagesUnread: U, updateMemberReadStatus: W, toggleChatSetting: Ae } = fe.actions, je = fe.reducer, G = class e {
|
|
377
378
|
static instance;
|
|
378
379
|
chatSDK = null;
|
|
379
380
|
constructor() {
|
|
@@ -417,7 +418,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
417
418
|
return this.chatSDK ? this.chatSDK.getAuth() : null;
|
|
418
419
|
}
|
|
419
420
|
clearAuth() {
|
|
420
|
-
|
|
421
|
+
this.chatSDK &&= (this.chatSDK.clearAuth(), null);
|
|
421
422
|
}
|
|
422
423
|
async setReceiver(e) {
|
|
423
424
|
return this.chatSDK ? this.chatSDK.setReceiver(e) : {
|
|
@@ -527,7 +528,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
527
528
|
setConfig(e) {
|
|
528
529
|
this.chatSDK && this.chatSDK.setConfig(e);
|
|
529
530
|
}
|
|
530
|
-
}.getInstance(),
|
|
531
|
+
}.getInstance(), K = {
|
|
531
532
|
common: {
|
|
532
533
|
buttons: {
|
|
533
534
|
save: "Save",
|
|
@@ -660,7 +661,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
660
661
|
updateButton: "Update",
|
|
661
662
|
updatingButton: "Updating..."
|
|
662
663
|
}
|
|
663
|
-
},
|
|
664
|
+
}, Me = {
|
|
664
665
|
common: {
|
|
665
666
|
buttons: {
|
|
666
667
|
save: "Lưu",
|
|
@@ -794,14 +795,14 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
794
795
|
updateButton: "Cập nhật",
|
|
795
796
|
updatingButton: "Đang cập nhật..."
|
|
796
797
|
}
|
|
797
|
-
},
|
|
798
|
+
}, Ne = class e {
|
|
798
799
|
static instance;
|
|
799
800
|
translations;
|
|
800
801
|
currentLocale;
|
|
801
802
|
constructor() {
|
|
802
803
|
this.currentLocale = "vietnamese", this.translations = {
|
|
803
|
-
vietnamese:
|
|
804
|
-
english:
|
|
804
|
+
vietnamese: Me,
|
|
805
|
+
english: K
|
|
805
806
|
};
|
|
806
807
|
}
|
|
807
808
|
static getInstance() {
|
|
@@ -816,13 +817,13 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
816
817
|
t(e, t) {
|
|
817
818
|
let n = e.split("."), r = (e) => n.reduce((e, t) => {
|
|
818
819
|
if (e && typeof e == "object") return e[t];
|
|
819
|
-
}, e), i = r(this.translations[this.currentLocale]) ?? r(
|
|
820
|
+
}, e), i = r(this.translations[this.currentLocale]) ?? r(K);
|
|
820
821
|
if (typeof i != "string") return e;
|
|
821
822
|
let a = i;
|
|
822
823
|
if (t) for (let [e, n] of Object.entries(t)) a = a.replace(RegExp(`{${e}}`, "g"), n);
|
|
823
824
|
return a;
|
|
824
825
|
}
|
|
825
|
-
}.getInstance(),
|
|
826
|
+
}.getInstance(), Pe = S({
|
|
826
827
|
name: "widget-settingslice",
|
|
827
828
|
initialState: {
|
|
828
829
|
theme: localStorage.getItem("chat-theme") || "light",
|
|
@@ -836,7 +837,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
836
837
|
reducers: {
|
|
837
838
|
setConfig: (e, t) => {
|
|
838
839
|
let n = t.payload;
|
|
839
|
-
n
|
|
840
|
+
n && (e.features = n);
|
|
840
841
|
},
|
|
841
842
|
toggleTheme: (e) => {
|
|
842
843
|
e.theme = e.theme === "light" ? "dark" : "light", localStorage.setItem("chat-theme", e.theme);
|
|
@@ -848,17 +849,17 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
848
849
|
e.primaryColor = t.payload, localStorage.setItem("chat-primary-color", e.primaryColor);
|
|
849
850
|
},
|
|
850
851
|
setLanguage: (e, t) => {
|
|
851
|
-
e.currentLanguage = t.payload,
|
|
852
|
+
e.currentLanguage = t.payload, Ne.locale = t.payload, localStorage.setItem("chat-widget:language", e.currentLanguage);
|
|
852
853
|
}
|
|
853
854
|
}
|
|
854
|
-
}), { setConfig:
|
|
855
|
+
}), { setConfig: q, toggleTheme: J, setFeatures: Fe, setPrimaryColor: Ie, setLanguage: Le } = Pe.actions, Re = Pe.reducer, ze = y({
|
|
855
856
|
chat: je,
|
|
856
|
-
setting:
|
|
857
|
-
}),
|
|
858
|
-
reducer: (e, t) => (t.type === "chatSlice/logout" && (e = void 0),
|
|
857
|
+
setting: Re
|
|
858
|
+
}), Be = b({
|
|
859
|
+
reducer: (e, t) => (t.type === "chatSlice/logout" && (e = void 0), ze(e, t)),
|
|
859
860
|
middleware: (e) => e({ serializableCheck: { ignoredPaths: ["chat.instance"] } }),
|
|
860
861
|
devTools: { name: "ChatbotWidget" }
|
|
861
|
-
}),
|
|
862
|
+
}), Ve = (e) => e.setting.features, He = (e, t) => {
|
|
862
863
|
let n = {
|
|
863
864
|
minutes: 1e3 * 60,
|
|
864
865
|
hours: 1e3 * 60 * 60,
|
|
@@ -866,7 +867,7 @@ var D = "\n #chat-internal-root{z-index:99999;pointer-events:none;font-family
|
|
|
866
867
|
};
|
|
867
868
|
return e * (n[t] || n.hours);
|
|
868
869
|
};
|
|
869
|
-
function
|
|
870
|
+
function Ue(e) {
|
|
870
871
|
return (t) => {
|
|
871
872
|
let { allow_delete_message: n, delete_duration: r } = G.setting || {};
|
|
872
873
|
if (!n) return !1;
|
|
@@ -875,7 +876,7 @@ function Ve(e) {
|
|
|
875
876
|
return Date.now() - i <= e;
|
|
876
877
|
};
|
|
877
878
|
}
|
|
878
|
-
function
|
|
879
|
+
function We(e) {
|
|
879
880
|
return (t) => {
|
|
880
881
|
let { allow_revoke_message: n, revoke_duration: r } = G.setting || {};
|
|
881
882
|
if (!n) return !1;
|
|
@@ -884,17 +885,17 @@ function He(e) {
|
|
|
884
885
|
return Date.now() - i <= e;
|
|
885
886
|
};
|
|
886
887
|
}
|
|
887
|
-
var
|
|
888
|
-
let t = j(e), n =
|
|
888
|
+
var Ge = x([Ve], (e) => {
|
|
889
|
+
let t = j(e), n = He(G.setting?.delete_duration ?? 0, G.setting?.delete_duration_unit ?? "hours"), r = He(G.setting?.revoke_duration ?? 0, G.setting?.revoke_duration_unit ?? "hours");
|
|
889
890
|
return {
|
|
890
891
|
...t,
|
|
891
892
|
acceptFilter: M(t.featureSet),
|
|
892
893
|
isFileTypeAllowed: ee(t.featureSet),
|
|
893
894
|
allowDeleteChat: G.setting?.allow_delete_chat ?? !1,
|
|
894
|
-
allowDeleteMessage:
|
|
895
|
-
allowRevokeMessage:
|
|
895
|
+
allowDeleteMessage: Ue(n),
|
|
896
|
+
allowRevokeMessage: We(r)
|
|
896
897
|
};
|
|
897
|
-
}),
|
|
898
|
+
}), Ke = (e, t, n) => {
|
|
898
899
|
let r = g(), i = f(!1), { currentUser: a, chats: o, currentChat: s } = _((e) => e.chat), l = f({
|
|
899
900
|
chats: null,
|
|
900
901
|
currentUser: null,
|
|
@@ -928,9 +929,9 @@ var Ue = x([ze], (e) => {
|
|
|
928
929
|
}
|
|
929
930
|
r(me(t)), console.warn("Authenticated as:", t);
|
|
930
931
|
let [{ data: u }, { data: d }] = await Promise.all([G.getMembers(), G.getChats()]);
|
|
931
|
-
r(he(d)), r(
|
|
932
|
+
r(he(d)), r(H(u));
|
|
932
933
|
let f = d?.reduce((e, n) => e + (n.new[t.id] ?? 0), 0) ?? 0;
|
|
933
|
-
r(
|
|
934
|
+
r(U(f)), console.warn("Total unread messages:", f);
|
|
934
935
|
} catch (e) {
|
|
935
936
|
i.current = !1, console.error("Failed to init chat or authenticate:", e);
|
|
936
937
|
}
|
|
@@ -971,7 +972,7 @@ var Ue = x([ze], (e) => {
|
|
|
971
972
|
if (console.warn("Chat Event:", e), e.type === "read") {
|
|
972
973
|
e.chat && r(Te(e.chat));
|
|
973
974
|
let t = e.chat?.id ?? e.chat_id, n = e.member_id ?? e.user_id, i = e.message_id ?? e.chat?.message?.id;
|
|
974
|
-
t && n && i && r(
|
|
975
|
+
t && n && i && r(W({
|
|
975
976
|
chatId: Number(t),
|
|
976
977
|
memberId: Number(n),
|
|
977
978
|
lastReadId: Number(i)
|
|
@@ -984,7 +985,7 @@ var Ue = x([ze], (e) => {
|
|
|
984
985
|
"members.connect"(e) {
|
|
985
986
|
console.warn("Member Connected:", e);
|
|
986
987
|
let { member: t, timestamp: n, socketId: i } = e;
|
|
987
|
-
r(
|
|
988
|
+
r(ve({
|
|
988
989
|
member: t,
|
|
989
990
|
timestamp: n,
|
|
990
991
|
socketId: i
|
|
@@ -1005,12 +1006,8 @@ var Ue = x([ze], (e) => {
|
|
|
1005
1006
|
G.removeEventListener(e, t);
|
|
1006
1007
|
}), console.warn("Chat event listeners removed"), r(pe()), G.clearAuth(), console.warn("Clear auth");
|
|
1007
1008
|
};
|
|
1008
|
-
}, [
|
|
1009
|
-
|
|
1010
|
-
n,
|
|
1011
|
-
r
|
|
1012
|
-
]);
|
|
1013
|
-
}, Ge = t(void 0), Ke = ({ children: e }) => {
|
|
1009
|
+
}, [a?.id, r]);
|
|
1010
|
+
}, qe = t(void 0), Je = ({ children: e }) => {
|
|
1014
1011
|
let [t, n] = p(!1), [r, i] = p([]), [o, s] = p(0), c = {
|
|
1015
1012
|
isOpen: t,
|
|
1016
1013
|
files: r,
|
|
@@ -1022,11 +1019,11 @@ var Ue = x([ze], (e) => {
|
|
|
1022
1019
|
n(!1);
|
|
1023
1020
|
}, [])
|
|
1024
1021
|
};
|
|
1025
|
-
return /* @__PURE__ */ T(
|
|
1022
|
+
return /* @__PURE__ */ T(qe.Provider, {
|
|
1026
1023
|
value: c,
|
|
1027
1024
|
children: e
|
|
1028
1025
|
});
|
|
1029
|
-
},
|
|
1026
|
+
}, Ye = ({ children: e }) => {
|
|
1030
1027
|
let [t, n] = p([]), r = a((e) => {
|
|
1031
1028
|
n((t) => t.filter((t) => t.id !== e));
|
|
1032
1029
|
}, []), i = a((e, t = "info") => {
|
|
@@ -1051,7 +1048,7 @@ var Ue = x([ze], (e) => {
|
|
|
1051
1048
|
}
|
|
1052
1049
|
}]);
|
|
1053
1050
|
}), [r]);
|
|
1054
|
-
return /* @__PURE__ */ T(
|
|
1051
|
+
return /* @__PURE__ */ T(Xe.Provider, {
|
|
1055
1052
|
value: {
|
|
1056
1053
|
showToast: i,
|
|
1057
1054
|
removeToast: r,
|
|
@@ -1060,11 +1057,11 @@ var Ue = x([ze], (e) => {
|
|
|
1060
1057
|
},
|
|
1061
1058
|
children: e
|
|
1062
1059
|
});
|
|
1063
|
-
},
|
|
1064
|
-
let e = o(
|
|
1060
|
+
}, Xe = t(void 0), Ze = () => {
|
|
1061
|
+
let e = o(qe);
|
|
1065
1062
|
if (!e) throw Error("useFileViewer must be used within FileViewerProvider");
|
|
1066
1063
|
return e;
|
|
1067
|
-
},
|
|
1064
|
+
}, Qe = ({ onFilesAdded: e }) => {
|
|
1068
1065
|
let [t, n] = p(!1), r = f(0);
|
|
1069
1066
|
return {
|
|
1070
1067
|
isDragOver: t,
|
|
@@ -1083,7 +1080,7 @@ var Ue = x([ze], (e) => {
|
|
|
1083
1080
|
i && i.length > 0 && e(i);
|
|
1084
1081
|
}, [e])
|
|
1085
1082
|
};
|
|
1086
|
-
},
|
|
1083
|
+
}, $e = () => {
|
|
1087
1084
|
let [e, t] = p({
|
|
1088
1085
|
isRecording: !1,
|
|
1089
1086
|
duration: 0,
|
|
@@ -1134,7 +1131,7 @@ var Ue = x([ze], (e) => {
|
|
|
1134
1131
|
o.current &&= (clearInterval(o.current), null), r.current?.getTracks().forEach((e) => e.stop());
|
|
1135
1132
|
let a = new Blob(i.current, { type: "audio/webm;codecs=opus" }), s;
|
|
1136
1133
|
try {
|
|
1137
|
-
s = await
|
|
1134
|
+
s = await ne(a);
|
|
1138
1135
|
} catch (e) {
|
|
1139
1136
|
console.error("MP3 convert failed, fallback to webm", e), s = a;
|
|
1140
1137
|
}
|
|
@@ -1172,45 +1169,49 @@ var Ue = x([ze], (e) => {
|
|
|
1172
1169
|
});
|
|
1173
1170
|
}, [])
|
|
1174
1171
|
}];
|
|
1175
|
-
},
|
|
1172
|
+
}, Y = () => {
|
|
1173
|
+
let e = o(Xe);
|
|
1174
|
+
if (!e) throw Error("useToast must be used within ToastProvider");
|
|
1175
|
+
return e;
|
|
1176
|
+
}, X = () => {
|
|
1176
1177
|
_((e) => e.setting.currentLanguage);
|
|
1177
|
-
let e = g();
|
|
1178
|
+
let { showToast: e } = Y(), t = g();
|
|
1178
1179
|
return {
|
|
1179
|
-
t:
|
|
1180
|
+
t: Ne.t.bind(Ne),
|
|
1180
1181
|
toggleChangeLanguage: () => {
|
|
1181
|
-
|
|
1182
|
+
Ne.locale === "vietnamese" ? e("Current only supports Vietnamese language", "info") : (Ne.locale = "vietnamese", t(Le("vietnamese")));
|
|
1182
1183
|
}
|
|
1183
1184
|
};
|
|
1184
|
-
},
|
|
1185
|
-
let e = o(Je);
|
|
1186
|
-
if (!e) throw Error("useToast must be used within ToastProvider");
|
|
1187
|
-
return e;
|
|
1188
|
-
}, $e = (e) => {
|
|
1185
|
+
}, et = (e) => {
|
|
1189
1186
|
let t = g(), n = f(!1);
|
|
1190
1187
|
c(() => {
|
|
1191
1188
|
(() => {
|
|
1192
1189
|
if (!(!e || n.current)) try {
|
|
1193
|
-
n.current = !0, e
|
|
1190
|
+
if (n.current = !0, !e) return;
|
|
1191
|
+
t(q({
|
|
1192
|
+
...e,
|
|
1193
|
+
chatModes: e.chatModes?.length ? [...e.chatModes, "single"] : ["single"]
|
|
1194
|
+
}));
|
|
1194
1195
|
} catch (e) {
|
|
1195
1196
|
n.current = !1, console.error("Failed to init chat or authenticate:", e);
|
|
1196
1197
|
}
|
|
1197
1198
|
})();
|
|
1198
1199
|
}, [e, t]);
|
|
1199
|
-
},
|
|
1200
|
-
|
|
1200
|
+
}, tt = ({ chatKey: e, auth: t, features: n, logoUrl: r, workspace: i, ...a }) => {
|
|
1201
|
+
et(n), Ke(e, t, i);
|
|
1201
1202
|
let [o, s] = p("closed"), [c, l] = p(null), [u, d] = p(null), [f, m] = p({
|
|
1202
1203
|
width: 1e3,
|
|
1203
1204
|
height: 750
|
|
1204
1205
|
});
|
|
1205
1206
|
return /* @__PURE__ */ E("div", {
|
|
1206
1207
|
className: `chatbot-container ${o}`,
|
|
1207
|
-
children: [o === "closed" && /* @__PURE__ */ T(
|
|
1208
|
+
children: [o === "closed" && /* @__PURE__ */ T(it, {
|
|
1208
1209
|
mode: o,
|
|
1209
1210
|
setMode: s,
|
|
1210
1211
|
dragPosition: c,
|
|
1211
1212
|
setDragPosition: l,
|
|
1212
1213
|
primaryColor: a.primaryColor
|
|
1213
|
-
}), o !== "closed" && /* @__PURE__ */ T(
|
|
1214
|
+
}), o !== "closed" && /* @__PURE__ */ T(Gt, {
|
|
1214
1215
|
logoUrl: r,
|
|
1215
1216
|
mode: o,
|
|
1216
1217
|
setMode: s,
|
|
@@ -1226,15 +1227,15 @@ var Ue = x([ze], (e) => {
|
|
|
1226
1227
|
...a
|
|
1227
1228
|
})]
|
|
1228
1229
|
});
|
|
1229
|
-
},
|
|
1230
|
-
let { isOpen: e, files: t, initialIndex: n, closeViewer: r } =
|
|
1230
|
+
}, nt = () => {
|
|
1231
|
+
let { isOpen: e, files: t, initialIndex: n, closeViewer: r } = Ze();
|
|
1231
1232
|
return e ? /* @__PURE__ */ T(tn, {
|
|
1232
1233
|
isOpen: e,
|
|
1233
1234
|
files: t,
|
|
1234
1235
|
initialIndex: n,
|
|
1235
1236
|
onClose: r
|
|
1236
1237
|
}) : null;
|
|
1237
|
-
},
|
|
1238
|
+
}, rt = (e) => {
|
|
1238
1239
|
let t = f(null), [n, r] = p(null);
|
|
1239
1240
|
return u(() => {
|
|
1240
1241
|
let e = t.current;
|
|
@@ -1251,13 +1252,13 @@ var Ue = x([ze], (e) => {
|
|
|
1251
1252
|
}
|
|
1252
1253
|
r(i);
|
|
1253
1254
|
}, []), /* @__PURE__ */ T(h, {
|
|
1254
|
-
store:
|
|
1255
|
-
children: /* @__PURE__ */ T(
|
|
1255
|
+
store: Be,
|
|
1256
|
+
children: /* @__PURE__ */ T(Je, { children: /* @__PURE__ */ T(Ye, { children: /* @__PURE__ */ E("div", {
|
|
1256
1257
|
ref: t,
|
|
1257
|
-
children: [n && v(/* @__PURE__ */ T(
|
|
1258
|
+
children: [n && v(/* @__PURE__ */ T(tt, { ...e }), n), n && v(/* @__PURE__ */ T(nt, {}), n)]
|
|
1258
1259
|
}) }) })
|
|
1259
1260
|
});
|
|
1260
|
-
},
|
|
1261
|
+
}, it = ({ mode: e, setMode: t, dragPosition: n, setDragPosition: r }) => {
|
|
1261
1262
|
let [i, a] = p(!1), [o, s] = p({
|
|
1262
1263
|
x: 0,
|
|
1263
1264
|
y: 0
|
|
@@ -1327,7 +1328,7 @@ var Ue = x([ze], (e) => {
|
|
|
1327
1328
|
})
|
|
1328
1329
|
]
|
|
1329
1330
|
});
|
|
1330
|
-
},
|
|
1331
|
+
}, Z = (e, t, { viewBox: n = "0 0 16 16", fill: i = "none", sizeDefault: a = 24, strokeWidthDefault: o = 2, strokeColorDefault: s = "none", strokeLinecapDefault: c, strokeLinejoinDefault: l } = {}) => {
|
|
1331
1332
|
let u = r(({ size: r = a, strokeWidth: u = o, strokeColor: d = s, strokeLinecap: f = c, strokeLinejoin: p = l, className: m = "", ...h }, g) => /* @__PURE__ */ T("svg", {
|
|
1332
1333
|
ref: g,
|
|
1333
1334
|
width: r,
|
|
@@ -1344,7 +1345,7 @@ var Ue = x([ze], (e) => {
|
|
|
1344
1345
|
children: t
|
|
1345
1346
|
}));
|
|
1346
1347
|
return u.displayName = e, u;
|
|
1347
|
-
},
|
|
1348
|
+
}, at = Z("Online", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("g", {
|
|
1348
1349
|
filter: "url(#filter0_d_4_4932)",
|
|
1349
1350
|
children: /* @__PURE__ */ T("path", {
|
|
1350
1351
|
d: "M2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8Z",
|
|
@@ -1396,7 +1397,7 @@ var Ue = x([ze], (e) => {
|
|
|
1396
1397
|
result: "shape"
|
|
1397
1398
|
})
|
|
1398
1399
|
]
|
|
1399
|
-
}) })] })),
|
|
1400
|
+
}) })] })), ot = Z("Owner", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ E("g", {
|
|
1400
1401
|
clipPath: "url(#clip0_4_9682)",
|
|
1401
1402
|
children: [/* @__PURE__ */ T("path", {
|
|
1402
1403
|
d: "M6.74458 1.90514C6.76976 1.85941 6.80675 1.82128 6.85169 1.79472C6.89664 1.76816 6.94788 1.75415 7.00008 1.75415C7.05229 1.75415 7.10353 1.76816 7.14848 1.79472C7.19342 1.82128 7.23041 1.85941 7.25558 1.90514L8.97758 5.17414C9.01865 5.24984 9.07596 5.3155 9.14541 5.36642C9.21486 5.41734 9.29473 5.45225 9.37927 5.46864C9.46381 5.48504 9.55093 5.48251 9.63438 5.46125C9.71783 5.43998 9.79554 5.4005 9.86192 5.34564L12.3568 3.20831C12.4047 3.16936 12.4637 3.1466 12.5254 3.14333C12.587 3.14005 12.6481 3.15642 12.6999 3.19008C12.7516 3.22374 12.7914 3.27295 12.8134 3.33063C12.8354 3.38831 12.8385 3.45148 12.8223 3.51106L11.1692 9.48789C11.1354 9.6102 11.0627 9.71817 10.9621 9.79543C10.8615 9.8727 10.7384 9.91505 10.6115 9.91606H3.38925C3.26228 9.91517 3.13907 9.87288 3.03831 9.79561C2.93756 9.71833 2.86477 9.61029 2.831 9.48789L1.17842 3.51164C1.16223 3.45207 1.16536 3.38889 1.18737 3.33121C1.20937 3.27353 1.24911 3.22432 1.30086 3.19066C1.35261 3.157 1.41371 3.14063 1.47536 3.14391C1.53701 3.14719 1.59602 3.16994 1.64392 3.20889L4.13825 5.34623C4.20463 5.40108 4.28234 5.44056 4.36579 5.46183C4.44924 5.4831 4.53636 5.48562 4.6209 5.46923C4.70544 5.45283 4.7853 5.41792 4.85475 5.367C4.92421 5.31608 4.98152 5.25042 5.02258 5.17473L6.74458 1.90514Z",
|
|
@@ -1421,7 +1422,7 @@ var Ue = x([ze], (e) => {
|
|
|
1421
1422
|
}) })] }), {
|
|
1422
1423
|
viewBox: "0 0 14 14",
|
|
1423
1424
|
sizeDefault: 14
|
|
1424
|
-
}),
|
|
1425
|
+
}), st = Z("SaOneLogo", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("rect", {
|
|
1425
1426
|
width: "22.4671",
|
|
1426
1427
|
height: "22.4671",
|
|
1427
1428
|
fill: "url(#pattern0_22_372)"
|
|
@@ -1443,7 +1444,7 @@ var Ue = x([ze], (e) => {
|
|
|
1443
1444
|
})] })] }), {
|
|
1444
1445
|
viewBox: "0 0 23 23",
|
|
1445
1446
|
sizeDefault: 23
|
|
1446
|
-
}),
|
|
1447
|
+
}), ct = Z("MemberList", /* @__PURE__ */ E(w, { children: [
|
|
1447
1448
|
/* @__PURE__ */ T("path", {
|
|
1448
1449
|
d: "M10.6667 14V12.6667C10.6667 11.9594 10.3857 11.2811 9.88562 10.781C9.38552 10.281 8.70724 10 8 10H4C3.29276 10 2.61448 10.281 2.11438 10.781C1.61428 11.2811 1.33333 11.9594 1.33333 12.6667V14",
|
|
1449
1450
|
stroke: "currentColor",
|
|
@@ -1465,7 +1466,7 @@ var Ue = x([ze], (e) => {
|
|
|
1465
1466
|
strokeLinecap: "round",
|
|
1466
1467
|
strokeLinejoin: "round"
|
|
1467
1468
|
})
|
|
1468
|
-
] }), { sizeDefault: 16 }),
|
|
1469
|
+
] }), { sizeDefault: 16 }), lt = Z("GroupList", /* @__PURE__ */ E(w, { children: [
|
|
1469
1470
|
/* @__PURE__ */ T("path", { d: "M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }),
|
|
1470
1471
|
/* @__PURE__ */ T("circle", {
|
|
1471
1472
|
cx: "9",
|
|
@@ -1479,12 +1480,12 @@ var Ue = x([ze], (e) => {
|
|
|
1479
1480
|
viewBox: "0 0 24 24",
|
|
1480
1481
|
strokeColorDefault: "currentColor",
|
|
1481
1482
|
strokeWidthDefault: 2
|
|
1482
|
-
}),
|
|
1483
|
+
}), ut = Z("Back", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M15 18l-6-6 6-6" }) }), {
|
|
1483
1484
|
sizeDefault: 20,
|
|
1484
1485
|
viewBox: "0 0 24 24",
|
|
1485
1486
|
strokeColorDefault: "currentColor",
|
|
1486
1487
|
strokeWidthDefault: 2
|
|
1487
|
-
}),
|
|
1488
|
+
}), dt = Z("Mute", /* @__PURE__ */ E(w, { children: [
|
|
1488
1489
|
/* @__PURE__ */ T("path", { d: "M10.268 21a2 2 0 0 0 3.464 0" }),
|
|
1489
1490
|
/* @__PURE__ */ T("path", { d: "M17 17H4a1 1 0 0 1-.74-1.673C4.59 13.956 6 12.499 6 8a6 6 0 0 1 .258-1.742" }),
|
|
1490
1491
|
/* @__PURE__ */ T("path", { d: "m2 2 20 20" }),
|
|
@@ -1495,12 +1496,12 @@ var Ue = x([ze], (e) => {
|
|
|
1495
1496
|
strokeColorDefault: "#94a3b8",
|
|
1496
1497
|
strokeWidthDefault: 2
|
|
1497
1498
|
});
|
|
1498
|
-
|
|
1499
|
+
Z("Call", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l2.27-2.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" }) }), {
|
|
1499
1500
|
sizeDefault: 18,
|
|
1500
1501
|
viewBox: "0 0 24 24",
|
|
1501
1502
|
strokeColorDefault: "currentColor",
|
|
1502
1503
|
strokeWidthDefault: 2
|
|
1503
|
-
}),
|
|
1504
|
+
}), Z("VideoCall", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("polygon", { points: "23 7 16 12 23 17 23 7" }), /* @__PURE__ */ T("rect", {
|
|
1504
1505
|
x: "1",
|
|
1505
1506
|
y: "5",
|
|
1506
1507
|
width: "15",
|
|
@@ -1513,7 +1514,7 @@ Q("Call", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M22 1
|
|
|
1513
1514
|
strokeColorDefault: "currentColor",
|
|
1514
1515
|
strokeWidthDefault: 2
|
|
1515
1516
|
});
|
|
1516
|
-
var
|
|
1517
|
+
var ft = Z("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("rect", {
|
|
1517
1518
|
x: "3",
|
|
1518
1519
|
y: "3",
|
|
1519
1520
|
width: "18",
|
|
@@ -1530,7 +1531,7 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1530
1531
|
viewBox: "0 0 24 24",
|
|
1531
1532
|
strokeColorDefault: "currentColor",
|
|
1532
1533
|
strokeWidthDefault: 2
|
|
1533
|
-
}),
|
|
1534
|
+
}), Q = Z("Close", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("line", {
|
|
1534
1535
|
x1: "18",
|
|
1535
1536
|
y1: "6",
|
|
1536
1537
|
x2: "6",
|
|
@@ -1545,22 +1546,22 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1545
1546
|
viewBox: "0 0 24 24",
|
|
1546
1547
|
strokeColorDefault: "currentColor",
|
|
1547
1548
|
strokeWidthDefault: 1.7
|
|
1548
|
-
}),
|
|
1549
|
+
}), pt = Z("Previous", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("polyline", { points: "15 18 9 12 15 6" }) }), {
|
|
1549
1550
|
sizeDefault: 24,
|
|
1550
1551
|
viewBox: "0 0 24 24",
|
|
1551
1552
|
strokeColorDefault: "currentColor",
|
|
1552
1553
|
strokeWidthDefault: 2
|
|
1553
|
-
}),
|
|
1554
|
+
}), mt = Z("Next", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("polyline", { points: "9 18 15 12 9 6" }) }), {
|
|
1554
1555
|
sizeDefault: 24,
|
|
1555
1556
|
viewBox: "0 0 24 24",
|
|
1556
1557
|
strokeColorDefault: "currentColor",
|
|
1557
1558
|
strokeWidthDefault: 2
|
|
1558
|
-
}),
|
|
1559
|
+
}), ht = Z("Conversation", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z" }) }), {
|
|
1559
1560
|
sizeDefault: 20,
|
|
1560
1561
|
viewBox: "0 0 24 24",
|
|
1561
1562
|
strokeColorDefault: "currentColor",
|
|
1562
1563
|
strokeWidthDefault: 2
|
|
1563
|
-
}),
|
|
1564
|
+
}), gt = Z("ConversationList", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ E("g", {
|
|
1564
1565
|
clipPath: "url(#clip0_22_6147)",
|
|
1565
1566
|
fill: "none",
|
|
1566
1567
|
children: [/* @__PURE__ */ T("path", {
|
|
@@ -1586,7 +1587,7 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1586
1587
|
sizeDefault: 20,
|
|
1587
1588
|
viewBox: "0 0 20 20",
|
|
1588
1589
|
strokeColorDefault: "currentColor"
|
|
1589
|
-
}),
|
|
1590
|
+
}), _t = Z("Add", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", {
|
|
1590
1591
|
d: "M4.16675 10H15.8334",
|
|
1591
1592
|
stroke: "currentColor",
|
|
1592
1593
|
strokeWidth: "1.67",
|
|
@@ -1602,7 +1603,7 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1602
1603
|
sizeDefault: 20,
|
|
1603
1604
|
viewBox: "0 0 20 20",
|
|
1604
1605
|
strokeColorDefault: "currentColor"
|
|
1605
|
-
}),
|
|
1606
|
+
}), vt = Z("Search", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", {
|
|
1606
1607
|
d: "M9.16667 15.8333C12.8486 15.8333 15.8333 12.8486 15.8333 9.16667C15.8333 5.48477 12.8486 2.5 9.16667 2.5C5.48477 2.5 2.5 5.48477 2.5 9.16667C2.5 12.8486 5.48477 15.8333 9.16667 15.8333Z",
|
|
1607
1608
|
stroke: "currentColor",
|
|
1608
1609
|
strokeWidth: "1.67",
|
|
@@ -1618,7 +1619,7 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1618
1619
|
sizeDefault: 20,
|
|
1619
1620
|
viewBox: "0 0 20 20",
|
|
1620
1621
|
strokeColorDefault: "currentColor"
|
|
1621
|
-
}),
|
|
1622
|
+
}), yt = Z("Setting", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", {
|
|
1622
1623
|
d: "M10.1833 1.66699H9.81667C9.37464 1.66699 8.95072 1.84259 8.63816 2.15515C8.3256 2.46771 8.15 2.89163 8.15 3.33366V3.48366C8.1497 3.77593 8.07255 4.06298 7.92628 4.31602C7.78002 4.56906 7.56978 4.77919 7.31667 4.92533L6.95834 5.13366C6.70497 5.27994 6.41756 5.35695 6.125 5.35695C5.83244 5.35695 5.54503 5.27994 5.29167 5.13366L5.16667 5.06699C4.78422 4.84638 4.32987 4.78653 3.90334 4.90058C3.47681 5.01464 3.11296 5.29327 2.89167 5.67533L2.70833 5.99199C2.48772 6.37444 2.42787 6.82879 2.54192 7.25532C2.65598 7.68185 2.93461 8.0457 3.31667 8.26699L3.44167 8.35033C3.69356 8.49575 3.90302 8.70457 4.04921 8.95602C4.1954 9.20747 4.27325 9.4928 4.275 9.78366V10.2087C4.27617 10.5023 4.19971 10.7911 4.05337 11.0457C3.90703 11.3004 3.69601 11.5118 3.44167 11.6587L3.31667 11.7337C2.93461 11.955 2.65598 12.3188 2.54192 12.7453C2.42787 13.1719 2.48772 13.6262 2.70833 14.0087L2.89167 14.3253C3.11296 14.7074 3.47681 14.986 3.90334 15.1001C4.32987 15.2141 4.78422 15.1543 5.16667 14.9337L5.29167 14.867C5.54503 14.7207 5.83244 14.6437 6.125 14.6437C6.41756 14.6437 6.70497 14.7207 6.95834 14.867L7.31667 15.0753C7.56978 15.2215 7.78002 15.4316 7.92628 15.6846C8.07255 15.9377 8.1497 16.2247 8.15 16.517V16.667C8.15 17.109 8.3256 17.5329 8.63816 17.8455C8.95072 18.1581 9.37464 18.3337 9.81667 18.3337H10.1833C10.6254 18.3337 11.0493 18.1581 11.3618 17.8455C11.6744 17.5329 11.85 17.109 11.85 16.667V16.517C11.8503 16.2247 11.9275 15.9377 12.0737 15.6846C12.22 15.4316 12.4302 15.2215 12.6833 15.0753L13.0417 14.867C13.295 14.7207 13.5824 14.6437 13.875 14.6437C14.1676 14.6437 14.455 14.7207 14.7083 14.867L14.8333 14.9337C15.2158 15.1543 15.6701 15.2141 16.0967 15.1001C16.5232 14.986 16.887 14.7074 17.1083 14.3253L17.2917 14.0003C17.5123 13.6179 17.5721 13.1635 17.4581 12.737C17.344 12.3105 17.0654 11.9466 16.6833 11.7253L16.5583 11.6587C16.304 11.5118 16.093 11.3004 15.9466 11.0457C15.8003 10.7911 15.7238 10.5023 15.725 10.2087V9.79199C15.7238 9.49831 15.8003 9.20953 15.9466 8.9549C16.093 8.70027 16.304 8.48883 16.5583 8.34199L16.6833 8.26699C17.0654 8.0457 17.344 7.68185 17.4581 7.25532C17.5721 6.82879 17.5123 6.37444 17.2917 5.99199L17.1083 5.67533C16.887 5.29327 16.5232 5.01464 16.0967 4.90058C15.6701 4.78653 15.2158 4.84638 14.8333 5.06699L14.7083 5.13366C14.455 5.27994 14.1676 5.35695 13.875 5.35695C13.5824 5.35695 13.295 5.27994 13.0417 5.13366L12.6833 4.92533C12.4302 4.77919 12.22 4.56906 12.0737 4.31602C11.9275 4.06298 11.8503 3.77593 11.85 3.48366V3.33366C11.85 2.89163 11.6744 2.46771 11.3618 2.15515C11.0493 1.84259 10.6254 1.66699 10.1833 1.66699Z",
|
|
1623
1624
|
stroke: "currentColor",
|
|
1624
1625
|
strokeWidth: "1.66667",
|
|
@@ -1635,13 +1636,13 @@ var dt = Q("OpenSidebar", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("r
|
|
|
1635
1636
|
viewBox: "0 0 20 20",
|
|
1636
1637
|
strokeColorDefault: "currentColor"
|
|
1637
1638
|
});
|
|
1638
|
-
|
|
1639
|
+
Z("Pin", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M12 17v5" }), /* @__PURE__ */ T("path", { d: "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" })] }), {
|
|
1639
1640
|
sizeDefault: 14,
|
|
1640
1641
|
viewBox: "0 0 24 24",
|
|
1641
1642
|
strokeColorDefault: "currentColor",
|
|
1642
1643
|
strokeWidthDefault: 2
|
|
1643
1644
|
});
|
|
1644
|
-
var
|
|
1645
|
+
var bt = Z("Help", /* @__PURE__ */ E(w, { children: [
|
|
1645
1646
|
/* @__PURE__ */ T("circle", {
|
|
1646
1647
|
cx: "12",
|
|
1647
1648
|
cy: "12",
|
|
@@ -1659,7 +1660,7 @@ var yt = Q("Help", /* @__PURE__ */ E(w, { children: [
|
|
|
1659
1660
|
viewBox: "0 0 24 24",
|
|
1660
1661
|
strokeColorDefault: "currentColor",
|
|
1661
1662
|
strokeWidthDefault: 2
|
|
1662
|
-
}),
|
|
1663
|
+
}), xt = Z("RemoveMember", /* @__PURE__ */ E(w, { children: [
|
|
1663
1664
|
/* @__PURE__ */ T("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }),
|
|
1664
1665
|
/* @__PURE__ */ T("circle", {
|
|
1665
1666
|
cx: "9",
|
|
@@ -1683,7 +1684,7 @@ var yt = Q("Help", /* @__PURE__ */ E(w, { children: [
|
|
|
1683
1684
|
viewBox: "0 0 24 24",
|
|
1684
1685
|
strokeColorDefault: "currentColor",
|
|
1685
1686
|
strokeWidthDefault: 2
|
|
1686
|
-
}),
|
|
1687
|
+
}), St = Z("Key", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z" }), /* @__PURE__ */ T("circle", {
|
|
1687
1688
|
cx: "16.5",
|
|
1688
1689
|
cy: "7.5",
|
|
1689
1690
|
r: ".5",
|
|
@@ -1693,19 +1694,19 @@ var yt = Q("Help", /* @__PURE__ */ E(w, { children: [
|
|
|
1693
1694
|
viewBox: "0 0 24 24",
|
|
1694
1695
|
strokeColorDefault: "currentColor",
|
|
1695
1696
|
strokeWidthDefault: 2
|
|
1696
|
-
}),
|
|
1697
|
+
}), Ct = Z("Edit", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }), /* @__PURE__ */ T("path", { d: "m15 5 4 4" })] }), {
|
|
1697
1698
|
sizeDefault: 14,
|
|
1698
1699
|
viewBox: "0 0 24 24",
|
|
1699
1700
|
strokeColorDefault: "currentColor",
|
|
1700
1701
|
strokeWidthDefault: 2
|
|
1701
1702
|
});
|
|
1702
|
-
|
|
1703
|
+
Z("Bell", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M10.268 21a2 2 0 0 0 3.464 0" }), /* @__PURE__ */ T("path", { d: "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" })] }), {
|
|
1703
1704
|
sizeDefault: 20,
|
|
1704
1705
|
viewBox: "0 0 24 24",
|
|
1705
1706
|
strokeColorDefault: "currentColor",
|
|
1706
1707
|
strokeWidthDefault: 2
|
|
1707
1708
|
});
|
|
1708
|
-
var
|
|
1709
|
+
var wt = Z("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
1709
1710
|
/* @__PURE__ */ T("path", { d: "M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }),
|
|
1710
1711
|
/* @__PURE__ */ T("circle", {
|
|
1711
1712
|
cx: "9",
|
|
@@ -1729,12 +1730,12 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1729
1730
|
viewBox: "0 0 24 24",
|
|
1730
1731
|
strokeColorDefault: "currentColor",
|
|
1731
1732
|
strokeWidthDefault: 2
|
|
1732
|
-
}),
|
|
1733
|
+
}), Tt = Z("ArrowDown", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M6 9l6 6 6-6" }) }), {
|
|
1733
1734
|
sizeDefault: 16,
|
|
1734
1735
|
viewBox: "0 0 24 24",
|
|
1735
1736
|
strokeColorDefault: "currentColor",
|
|
1736
1737
|
strokeWidthDefault: 2
|
|
1737
|
-
}),
|
|
1738
|
+
}), Et = Z("More", /* @__PURE__ */ E(w, { children: [
|
|
1738
1739
|
/* @__PURE__ */ T("circle", {
|
|
1739
1740
|
cx: "12",
|
|
1740
1741
|
cy: "12",
|
|
@@ -1756,12 +1757,12 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1756
1757
|
strokeColorDefault: "currentColor",
|
|
1757
1758
|
strokeWidthDefault: 2,
|
|
1758
1759
|
strokeLinecapDefault: "round"
|
|
1759
|
-
}),
|
|
1760
|
+
}), Dt = Z("Minimize", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M5 12h14" }) }), {
|
|
1760
1761
|
sizeDefault: 14,
|
|
1761
1762
|
viewBox: "0 0 24 24",
|
|
1762
1763
|
strokeColorDefault: "currentColor",
|
|
1763
1764
|
strokeWidthDefault: 2
|
|
1764
|
-
}),
|
|
1765
|
+
}), Ot = Z("OpenFullPage", /* @__PURE__ */ E(w, { children: [
|
|
1765
1766
|
/* @__PURE__ */ T("path", { d: "M15 3h6v6" }),
|
|
1766
1767
|
/* @__PURE__ */ T("path", { d: "m21 3-7 7" }),
|
|
1767
1768
|
/* @__PURE__ */ T("path", { d: "m3 21 7-7" }),
|
|
@@ -1771,7 +1772,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1771
1772
|
viewBox: "0 0 24 24",
|
|
1772
1773
|
strokeColorDefault: "currentColor",
|
|
1773
1774
|
strokeWidthDefault: 2
|
|
1774
|
-
}),
|
|
1775
|
+
}), kt = Z("MinimizeFullPage", /* @__PURE__ */ E(w, { children: [
|
|
1775
1776
|
/* @__PURE__ */ T("path", { d: "m14 10 7-7" }),
|
|
1776
1777
|
/* @__PURE__ */ T("path", { d: "M20 10h-6V4" }),
|
|
1777
1778
|
/* @__PURE__ */ T("path", { d: "m3 21 7-7" }),
|
|
@@ -1781,19 +1782,19 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1781
1782
|
viewBox: "0 0 24 24",
|
|
1782
1783
|
strokeColorDefault: "currentColor",
|
|
1783
1784
|
strokeWidthDefault: 2
|
|
1784
|
-
}),
|
|
1785
|
+
}), At = Z("Reply", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M20 18v-2a4 4 0 0 0-4-4H4" }), /* @__PURE__ */ T("path", { d: "m9 17-5-5 5-5" })] }), {
|
|
1785
1786
|
sizeDefault: 20,
|
|
1786
1787
|
viewBox: "0 0 24 24",
|
|
1787
1788
|
strokeColorDefault: "currentColor",
|
|
1788
1789
|
strokeWidthDefault: 2
|
|
1789
|
-
}),
|
|
1790
|
+
}), jt = Z("Attachment", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.51a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }), {
|
|
1790
1791
|
sizeDefault: 20,
|
|
1791
1792
|
viewBox: "0 0 24 24",
|
|
1792
1793
|
strokeColorDefault: "currentColor",
|
|
1793
1794
|
strokeWidthDefault: 2,
|
|
1794
1795
|
strokeLinecapDefault: "round",
|
|
1795
1796
|
strokeLinejoinDefault: "round"
|
|
1796
|
-
}),
|
|
1797
|
+
}), Mt = Z("Image", /* @__PURE__ */ E(w, { children: [
|
|
1797
1798
|
/* @__PURE__ */ T("rect", {
|
|
1798
1799
|
width: "18",
|
|
1799
1800
|
height: "18",
|
|
@@ -1815,7 +1816,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1815
1816
|
strokeWidthDefault: 2,
|
|
1816
1817
|
strokeLinecapDefault: "round",
|
|
1817
1818
|
strokeLinejoinDefault: "round"
|
|
1818
|
-
}),
|
|
1819
|
+
}), Nt = Z("Voice", /* @__PURE__ */ E(w, { children: [
|
|
1819
1820
|
/* @__PURE__ */ T("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z" }),
|
|
1820
1821
|
/* @__PURE__ */ T("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
|
|
1821
1822
|
/* @__PURE__ */ T("line", {
|
|
@@ -1831,7 +1832,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1831
1832
|
strokeWidthDefault: 2,
|
|
1832
1833
|
strokeLinecapDefault: "round",
|
|
1833
1834
|
strokeLinejoinDefault: "round"
|
|
1834
|
-
}),
|
|
1835
|
+
}), Pt = Z("Emoji", /* @__PURE__ */ E(w, { children: [
|
|
1835
1836
|
/* @__PURE__ */ T("circle", {
|
|
1836
1837
|
cx: "12",
|
|
1837
1838
|
cy: "12",
|
|
@@ -1857,7 +1858,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1857
1858
|
strokeWidthDefault: 2,
|
|
1858
1859
|
strokeLinecapDefault: "round",
|
|
1859
1860
|
strokeLinejoinDefault: "round"
|
|
1860
|
-
}),
|
|
1861
|
+
}), Ft = Z("SendMessage", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("line", {
|
|
1861
1862
|
x1: "22",
|
|
1862
1863
|
y1: "2",
|
|
1863
1864
|
x2: "11",
|
|
@@ -1869,27 +1870,27 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1869
1870
|
strokeWidthDefault: 2,
|
|
1870
1871
|
strokeLinecapDefault: "round",
|
|
1871
1872
|
strokeLinejoinDefault: "round"
|
|
1872
|
-
}),
|
|
1873
|
+
}), It = Z("SortASC", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M12 5v14" }), /* @__PURE__ */ T("path", { d: "M5 12l7-7 7 7" })] }), {
|
|
1873
1874
|
sizeDefault: 16,
|
|
1874
1875
|
viewBox: "0 0 24 24",
|
|
1875
1876
|
strokeColorDefault: "currentColor",
|
|
1876
1877
|
strokeWidthDefault: 2
|
|
1877
|
-
}),
|
|
1878
|
+
}), Lt = Z("SortDESC", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M12 5v14" }), /* @__PURE__ */ T("path", { d: "M5 12l7 7 7-7" })] }), {
|
|
1878
1879
|
sizeDefault: 16,
|
|
1879
1880
|
viewBox: "0 0 24 24",
|
|
1880
1881
|
strokeColorDefault: "currentColor",
|
|
1881
1882
|
strokeWidthDefault: 2
|
|
1882
|
-
}),
|
|
1883
|
+
}), Rt = Z("Like", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z" }), /* @__PURE__ */ T("path", { d: "M7 10v12" })] }), {
|
|
1883
1884
|
sizeDefault: 24,
|
|
1884
1885
|
viewBox: "0 0 24 24",
|
|
1885
1886
|
strokeColorDefault: "currentColor",
|
|
1886
1887
|
strokeWidthDefault: 2
|
|
1887
|
-
}),
|
|
1888
|
+
}), zt = Z("Love", /* @__PURE__ */ T(w, { children: /* @__PURE__ */ T("path", { d: "M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5" }) }), {
|
|
1888
1889
|
sizeDefault: 24,
|
|
1889
1890
|
viewBox: "0 0 24 24",
|
|
1890
1891
|
strokeColorDefault: "currentColor",
|
|
1891
1892
|
strokeWidthDefault: 2
|
|
1892
|
-
}),
|
|
1893
|
+
}), Bt = Z("DeleteIcon", /* @__PURE__ */ E(w, { children: [
|
|
1893
1894
|
/* @__PURE__ */ T("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
|
|
1894
1895
|
/* @__PURE__ */ T("path", { d: "M3 6h18" }),
|
|
1895
1896
|
/* @__PURE__ */ T("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
|
|
@@ -1898,12 +1899,12 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1898
1899
|
viewBox: "0 0 24 24",
|
|
1899
1900
|
strokeColorDefault: "currentColor",
|
|
1900
1901
|
strokeWidthDefault: 2
|
|
1901
|
-
}),
|
|
1902
|
+
}), Vt = Z("RevokeMessage", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }), /* @__PURE__ */ T("path", { d: "M3 3v5h5" })] }), {
|
|
1902
1903
|
sizeDefault: 24,
|
|
1903
1904
|
viewBox: "0 0 24 24",
|
|
1904
1905
|
strokeColorDefault: "currentColor",
|
|
1905
1906
|
strokeWidthDefault: 2
|
|
1906
|
-
}),
|
|
1907
|
+
}), Ht = Z("Seen", /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("path", {
|
|
1907
1908
|
d: "M9 3L3.5 8.5L1 6",
|
|
1908
1909
|
stroke: "#2B7FFF",
|
|
1909
1910
|
strokeLinecap: "round",
|
|
@@ -1916,7 +1917,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1916
1917
|
})] }), {
|
|
1917
1918
|
sizeDefault: 12,
|
|
1918
1919
|
viewBox: "0 0 12 12"
|
|
1919
|
-
}),
|
|
1920
|
+
}), Ut = Z("language", /* @__PURE__ */ E(w, { children: [
|
|
1920
1921
|
/* @__PURE__ */ T("circle", {
|
|
1921
1922
|
cx: "12",
|
|
1922
1923
|
cy: "12",
|
|
@@ -1931,7 +1932,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1931
1932
|
strokeWidthDefault: 2,
|
|
1932
1933
|
strokeLinecapDefault: "round",
|
|
1933
1934
|
strokeLinejoinDefault: "round"
|
|
1934
|
-
}),
|
|
1935
|
+
}), Wt = Z("ImagePlaceholder", /* @__PURE__ */ E(w, { children: [
|
|
1935
1936
|
/* @__PURE__ */ T("path", { d: "M10.3 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10l-3.1-3.1a2 2 0 0 0-2.814.014L6 21" }),
|
|
1936
1937
|
/* @__PURE__ */ T("path", { d: "m14 19.5 3-3 3 3" }),
|
|
1937
1938
|
/* @__PURE__ */ T("path", { d: "M17 22v-5.5" }),
|
|
@@ -1944,41 +1945,41 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
1944
1945
|
sizeDefault: 20,
|
|
1945
1946
|
viewBox: "0 0 24 24",
|
|
1946
1947
|
strokeColorDefault: "currentColor"
|
|
1947
|
-
}),
|
|
1948
|
+
}), Gt = ({ title: e = "Live Chat", logoUrl: t, mode: n, setMode: r, dragPosition: i, setDragPosition: o, fullpagePosition: l, setFullpagePosition: u, fullpageSize: m = {
|
|
1948
1949
|
width: 1e3,
|
|
1949
1950
|
height: 750
|
|
1950
|
-
}, setFullpageSize:
|
|
1951
|
-
let { t:
|
|
1951
|
+
}, setFullpageSize: h }) => {
|
|
1952
|
+
let { t: v } = X(), [y, b] = p(!1), [x, S] = p(!1), [C, D] = p(null), [k, A] = p(!1), [j, M] = p(!1), [ee, N] = p(!1), [P, te] = p("chats"), [F, ne] = p("members"), { showToast: I, confirm: re } = Y(), [L, R] = p("all"), [ie, ae] = p(!1), [oe, se] = p(!1), [ce, le] = p(null), [z, ue] = p({
|
|
1952
1953
|
mouseX: 0,
|
|
1953
1954
|
mouseY: 0,
|
|
1954
1955
|
baseW: 0,
|
|
1955
1956
|
baseH: 0,
|
|
1956
1957
|
baseX: 0,
|
|
1957
1958
|
baseY: 0
|
|
1958
|
-
}), [
|
|
1959
|
+
}), [B, de] = p({
|
|
1959
1960
|
x: 0,
|
|
1960
1961
|
y: 0
|
|
1961
|
-
}),
|
|
1962
|
-
e && e.length > 0 &&
|
|
1963
|
-
} }), { currentChat: U, currentUser: W, members:
|
|
1962
|
+
}), fe = f(null), pe = f(null), [me, ge] = p(""), H = s(me), [ve, ye] = p(!1), [be, xe] = p(!1), [Se, Ce] = p(!1), { hasGroupChat: we } = _(Ge), { isDragOver: Te, handleDragEnter: Ee, handleDragOver: De, handleDragLeave: Oe, handleDrop: ke } = Qe({ onFilesAdded: (e) => {
|
|
1963
|
+
e && e.length > 0 && pe.current?.processPastedFiles(e);
|
|
1964
|
+
} }), { currentChat: U, currentUser: W, members: Ae, currentChatMembers: je, chats: K, totalMessagesUnread: Me } = _((e) => e.chat);
|
|
1964
1965
|
c(() => {
|
|
1965
|
-
if (n === "fullpage" && !
|
|
1966
|
+
if (n === "fullpage" && !l && u && h) {
|
|
1966
1967
|
let e = 1e3;
|
|
1967
|
-
|
|
1968
|
+
h({
|
|
1968
1969
|
width: e,
|
|
1969
1970
|
height: 750
|
|
1970
|
-
}),
|
|
1971
|
+
}), u({
|
|
1971
1972
|
x: (window.innerWidth - e) / 2,
|
|
1972
1973
|
y: (window.innerHeight - 750) / 2
|
|
1973
1974
|
});
|
|
1974
1975
|
}
|
|
1975
1976
|
}, [
|
|
1976
1977
|
n,
|
|
1978
|
+
l,
|
|
1977
1979
|
u,
|
|
1978
|
-
|
|
1979
|
-
v
|
|
1980
|
+
h
|
|
1980
1981
|
]);
|
|
1981
|
-
let { theme: Ne, primaryColor: Pe } = _((e) => e.setting),
|
|
1982
|
+
let { theme: Ne, primaryColor: Pe } = _((e) => e.setting), q = g(), J = d(() => {
|
|
1982
1983
|
let e = H.toLowerCase().trim();
|
|
1983
1984
|
if (!e) return {
|
|
1984
1985
|
filteredChat: K.filter((e) => {
|
|
@@ -2002,7 +2003,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2002
2003
|
...t,
|
|
2003
2004
|
matchedMemberNames: n.map((e) => e.name)
|
|
2004
2005
|
};
|
|
2005
|
-
}), n =
|
|
2006
|
+
}), n = Ae.filter((t) => t.code === W?.code || ![t.name, t.code].some((t) => t.toLowerCase().includes(e)) ? !1 : !K.some((e) => e.type === "single" && e.members?.some((e) => e.code === t.code))), r = K.filter((t) => t.message?.content?.toLowerCase().includes(e)).map((e) => ({
|
|
2006
2007
|
chat: e,
|
|
2007
2008
|
message: e.message
|
|
2008
2009
|
})), i = K.filter((t) => t.message?.files?.some((t) => t.name.toLowerCase().includes(e))).map((t) => ({
|
|
@@ -2018,61 +2019,42 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2018
2019
|
};
|
|
2019
2020
|
}, [
|
|
2020
2021
|
K,
|
|
2021
|
-
|
|
2022
|
+
Ae,
|
|
2022
2023
|
H,
|
|
2023
2024
|
L,
|
|
2024
2025
|
W
|
|
2025
|
-
]),
|
|
2026
|
+
]), Fe = (e, t) => t.trim() ? /* @__PURE__ */ T(w, { children: e.split(RegExp(`(${t})`, "gi")).map((e, n) => e.toLowerCase() === t.toLowerCase() ? /* @__PURE__ */ T("span", {
|
|
2026
2027
|
className: "highlight-match",
|
|
2027
2028
|
children: e
|
|
2028
|
-
}, n) : e) }) : e,
|
|
2029
|
+
}, n) : e) }) : e, Ie = (e) => {
|
|
2029
2030
|
if (!e) return "#ffffff";
|
|
2030
2031
|
let t = e.startsWith("#") ? e.slice(1) : e;
|
|
2031
2032
|
if (t.length === 3 && (t = t.split("").map((e) => e + e).join("")), t.length !== 6) return "#ffffff";
|
|
2032
2033
|
let n = parseInt(t.slice(0, 2), 16), r = parseInt(t.slice(2, 4), 16), i = parseInt(t.slice(4, 6), 16);
|
|
2033
2034
|
return (n * 299 + r * 587 + i * 114) / 1e3 > 180 ? "#1e293b" : "#ffffff";
|
|
2034
|
-
},
|
|
2035
|
-
|
|
2036
|
-
}, [R]),
|
|
2037
|
-
|
|
2038
|
-
|
|
2039
|
-
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
k(e), C(!0);
|
|
2044
|
-
}, Be = async (e, t, n) => {
|
|
2045
|
-
try {
|
|
2046
|
-
let r = await G.updateGroup(e, t, n);
|
|
2047
|
-
r?.data && (J(he(K.map((t) => t.id === e ? {
|
|
2048
|
-
...t,
|
|
2049
|
-
...r.data
|
|
2050
|
-
} : t))), U?.id === e && J(V({
|
|
2051
|
-
...U,
|
|
2052
|
-
...r.data
|
|
2053
|
-
})), C(!1), k(null), F("Cập nhật thông tin nhóm thành công!", "success"));
|
|
2035
|
+
}, Le = d(() => Ie(Pe), [Pe]), Re = a((e) => {
|
|
2036
|
+
ge(e), R("all"), ye(!1), xe(!1), Ce(!1);
|
|
2037
|
+
}, [R]), ze = (e) => {
|
|
2038
|
+
D(e), S(!0);
|
|
2039
|
+
}, Be = () => {
|
|
2040
|
+
A(!0);
|
|
2041
|
+
}, Ve = async (e, t) => {
|
|
2042
|
+
if (await re("Bạn có chắc chắn muốn xóa thành viên này ra khỏi nhóm?")) try {
|
|
2043
|
+
await G.removeMember(e, t), q(_e(je.filter((e) => String(e.id) !== String(t)))), String(t) === String(W?.id) ? (I("Bạn đã rời khỏi nhóm này", "success"), S(!1), D(null), q(V(null)), q(he((await G.getChats()).data ?? []))) : I("Đã xóa thành viên khỏi nhóm", "success");
|
|
2054
2044
|
} catch (e) {
|
|
2055
|
-
console.error("Lỗi khi
|
|
2045
|
+
console.error("Lỗi khi xóa thành viên:", e), I("Không thể xóa thành viên. Vui lòng thử lại!", "error");
|
|
2056
2046
|
}
|
|
2057
|
-
},
|
|
2058
|
-
j(!0);
|
|
2059
|
-
}, He = async (e, t) => {
|
|
2060
|
-
if (await I("Bạn có chắc chắn muốn xóa thành viên này ra khỏi nhóm?")) try {
|
|
2061
|
-
await G.removeMember(e, t), J(_e(Me.filter((e) => String(e.id) !== String(t)))), String(t) === String(W?.id) ? (F("Bạn đã rời khỏi nhóm này", "success"), C(!1), k(null), J(V(null)), J(he((await G.getChats()).data ?? []))) : F("Đã xóa thành viên khỏi nhóm", "success");
|
|
2062
|
-
} catch (e) {
|
|
2063
|
-
console.error("Lỗi khi xóa thành viên:", e), F("Không thể xóa thành viên. Vui lòng thử lại!", "error");
|
|
2064
|
-
}
|
|
2065
|
-
}, We = (e) => {
|
|
2047
|
+
}, He = (e) => {
|
|
2066
2048
|
if (n !== "fullpage" || e.target.closest(".action-btn, .back-btn")) return;
|
|
2067
2049
|
let t = e.currentTarget.parentElement?.getBoundingClientRect();
|
|
2068
|
-
t && (
|
|
2050
|
+
t && (ae(!0), de({
|
|
2069
2051
|
x: e.clientX - t.left,
|
|
2070
2052
|
y: e.clientY - t.top
|
|
2071
2053
|
}), e.stopPropagation(), e.preventDefault());
|
|
2072
|
-
},
|
|
2054
|
+
}, Ue = (e, t) => {
|
|
2073
2055
|
if (n !== "fullpage") return;
|
|
2074
2056
|
e.stopPropagation(), e.preventDefault();
|
|
2075
|
-
let r =
|
|
2057
|
+
let r = fe.current?.getBoundingClientRect();
|
|
2076
2058
|
r && (se(!0), le(t), ue({
|
|
2077
2059
|
mouseX: e.clientX,
|
|
2078
2060
|
mouseY: e.clientY,
|
|
@@ -2084,98 +2066,98 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2084
2066
|
};
|
|
2085
2067
|
c(() => {
|
|
2086
2068
|
let e = (e) => {
|
|
2087
|
-
if (
|
|
2088
|
-
let t = e.clientX -
|
|
2069
|
+
if (oe && ce) {
|
|
2070
|
+
let t = e.clientX - z.mouseX, n = e.clientY - z.mouseY, r = z.baseW, i = z.baseH, a = z.baseX, o = z.baseY, s = 1e3, c = document.documentElement.clientWidth, l = document.documentElement.clientHeight;
|
|
2089
2071
|
switch (ce) {
|
|
2090
2072
|
case "ne":
|
|
2091
|
-
r = Math.min(c -
|
|
2073
|
+
r = Math.min(c - z.baseX, Math.max(s, z.baseW + t)), i = Math.min(z.baseY + z.baseH, Math.max(700, z.baseH - n)), o = z.baseY + (z.baseH - i);
|
|
2092
2074
|
break;
|
|
2093
2075
|
case "nw":
|
|
2094
|
-
r = Math.min(
|
|
2076
|
+
r = Math.min(z.baseX + z.baseW, Math.max(s, z.baseW - t)), i = Math.min(z.baseY + z.baseH, Math.max(700, z.baseH - n)), a = z.baseX + (z.baseW - r), o = z.baseY + (z.baseH - i);
|
|
2095
2077
|
break;
|
|
2096
2078
|
case "se":
|
|
2097
|
-
r = Math.min(c -
|
|
2079
|
+
r = Math.min(c - z.baseX, Math.max(s, z.baseW + t)), i = Math.min(l - z.baseY, Math.max(700, z.baseH + n));
|
|
2098
2080
|
break;
|
|
2099
2081
|
case "sw":
|
|
2100
|
-
r = Math.min(
|
|
2082
|
+
r = Math.min(z.baseX + z.baseW, Math.max(s, z.baseW - t)), i = Math.min(l - z.baseY, Math.max(700, z.baseH + n)), a = z.baseX + (z.baseW - r);
|
|
2101
2083
|
break;
|
|
2102
2084
|
}
|
|
2103
|
-
|
|
2085
|
+
h?.({
|
|
2104
2086
|
width: r,
|
|
2105
2087
|
height: i
|
|
2106
|
-
}),
|
|
2088
|
+
}), u?.({
|
|
2107
2089
|
x: a,
|
|
2108
2090
|
y: o
|
|
2109
2091
|
});
|
|
2110
2092
|
return;
|
|
2111
2093
|
}
|
|
2112
|
-
if (!
|
|
2113
|
-
let t =
|
|
2094
|
+
if (!ie || !B) return;
|
|
2095
|
+
let t = fe.current;
|
|
2114
2096
|
if (!t) return;
|
|
2115
|
-
let r = t.getBoundingClientRect(), i = r.width, a = r.height,
|
|
2116
|
-
|
|
2117
|
-
let
|
|
2118
|
-
|
|
2119
|
-
x:
|
|
2120
|
-
y:
|
|
2121
|
-
}) :
|
|
2122
|
-
x:
|
|
2123
|
-
y:
|
|
2097
|
+
let r = t.getBoundingClientRect(), i = r.width, a = r.height, s = document.documentElement.clientWidth, c = document.documentElement.clientHeight, l = e.clientX - B.x;
|
|
2098
|
+
l < 0 && (l = 0), l + i > s && (l = s - i);
|
|
2099
|
+
let d = e.clientY - B.y;
|
|
2100
|
+
d < 0 && (d = 0), d + a > c && (d = c - a), n === "fullpage" ? u?.({
|
|
2101
|
+
x: l,
|
|
2102
|
+
y: d
|
|
2103
|
+
}) : o && o({
|
|
2104
|
+
x: l,
|
|
2105
|
+
y: d
|
|
2124
2106
|
});
|
|
2125
2107
|
}, t = () => {
|
|
2126
|
-
|
|
2108
|
+
ae(!1), se(!1), le(null);
|
|
2127
2109
|
};
|
|
2128
|
-
return (
|
|
2110
|
+
return (ie || oe) && (document.addEventListener("mousemove", e), document.addEventListener("mouseup", t)), () => {
|
|
2129
2111
|
document.removeEventListener("mousemove", e), document.removeEventListener("mouseup", t);
|
|
2130
2112
|
};
|
|
2131
2113
|
}, [
|
|
2132
|
-
|
|
2133
|
-
|
|
2114
|
+
ie,
|
|
2115
|
+
oe,
|
|
2134
2116
|
ce,
|
|
2135
|
-
|
|
2117
|
+
B,
|
|
2136
2118
|
n,
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2140
|
-
|
|
2119
|
+
o,
|
|
2120
|
+
u,
|
|
2121
|
+
h,
|
|
2122
|
+
z
|
|
2141
2123
|
]);
|
|
2142
|
-
let
|
|
2143
|
-
if (!
|
|
2144
|
-
let e = document.documentElement.clientWidth, t = document.documentElement.clientHeight, n =
|
|
2124
|
+
let We = (() => {
|
|
2125
|
+
if (!i || typeof document > "u") return null;
|
|
2126
|
+
let e = document.documentElement.clientWidth, t = document.documentElement.clientHeight, n = i.x, r = i.y;
|
|
2145
2127
|
return n + 400 > e && (n = e - 400 - 20), n < 20 && (n = 20), r + 640 > t && (r = t - 640 - 20), r < 20 && (r = 20), {
|
|
2146
2128
|
x: n,
|
|
2147
2129
|
y: r
|
|
2148
2130
|
};
|
|
2149
|
-
})(),
|
|
2150
|
-
if (n === "popup") r("fullpage"),
|
|
2131
|
+
})(), Ke = () => {
|
|
2132
|
+
if (n === "popup") r("fullpage"), h?.({
|
|
2151
2133
|
width: window.innerWidth,
|
|
2152
2134
|
height: window.innerHeight
|
|
2153
|
-
}),
|
|
2135
|
+
}), u?.({
|
|
2154
2136
|
x: 0,
|
|
2155
2137
|
y: 0
|
|
2156
2138
|
});
|
|
2157
|
-
else if (n === "fullpage") if (
|
|
2139
|
+
else if (n === "fullpage") if (m.width >= window.innerWidth && m.height >= window.innerHeight) {
|
|
2158
2140
|
let e = 1e3;
|
|
2159
|
-
|
|
2141
|
+
h?.({
|
|
2160
2142
|
width: e,
|
|
2161
2143
|
height: 750
|
|
2162
|
-
}),
|
|
2144
|
+
}), u?.({
|
|
2163
2145
|
x: (window.innerWidth - e) / 2,
|
|
2164
2146
|
y: (window.innerHeight - 750) / 2
|
|
2165
2147
|
});
|
|
2166
|
-
} else
|
|
2148
|
+
} else h?.({
|
|
2167
2149
|
width: window.innerWidth,
|
|
2168
2150
|
height: window.innerHeight
|
|
2169
|
-
}),
|
|
2151
|
+
}), u?.({
|
|
2170
2152
|
x: 0,
|
|
2171
2153
|
y: 0
|
|
2172
2154
|
});
|
|
2173
|
-
},
|
|
2155
|
+
}, qe = a(async (e) => {
|
|
2174
2156
|
if (e) try {
|
|
2175
|
-
let t =
|
|
2157
|
+
let t = Ae.find((t) => String(t.id) === e);
|
|
2176
2158
|
if (t) {
|
|
2177
2159
|
let n = K.find((t) => t.type === "single" && t.members?.some((t) => String(t.id) === e));
|
|
2178
|
-
if (n)
|
|
2160
|
+
if (n) q(V(n));
|
|
2179
2161
|
else {
|
|
2180
2162
|
await G.setReceiver({
|
|
2181
2163
|
id: t.id,
|
|
@@ -2183,76 +2165,76 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2183
2165
|
name: t.name
|
|
2184
2166
|
});
|
|
2185
2167
|
let e = (await G.addChat(Number(t.id))).data;
|
|
2186
|
-
e &&
|
|
2168
|
+
e && q(V(e));
|
|
2187
2169
|
}
|
|
2188
2170
|
}
|
|
2189
|
-
|
|
2171
|
+
b(!1);
|
|
2190
2172
|
} catch (e) {
|
|
2191
|
-
console.error("Lỗi khi tạo cuộc trò chuyện:", e),
|
|
2173
|
+
console.error("Lỗi khi tạo cuộc trò chuyện:", e), I("Không thể tạo cuộc trò chuyện. Vui lòng thử lại sau.", "error");
|
|
2192
2174
|
}
|
|
2193
2175
|
}, [
|
|
2194
2176
|
K,
|
|
2195
|
-
|
|
2196
|
-
|
|
2197
|
-
|
|
2177
|
+
Ae,
|
|
2178
|
+
I,
|
|
2179
|
+
q
|
|
2198
2180
|
]);
|
|
2199
2181
|
return /* @__PURE__ */ E("div", {
|
|
2200
|
-
ref:
|
|
2182
|
+
ref: fe,
|
|
2201
2183
|
className: `chat-window ${n === "fullpage" ? "fullpage" : ""} ${Ne === "dark" ? "dark-theme" : ""}`,
|
|
2202
2184
|
style: n === "fullpage" ? {
|
|
2203
2185
|
position: "fixed",
|
|
2204
|
-
left:
|
|
2205
|
-
top:
|
|
2206
|
-
width: `${
|
|
2207
|
-
height: `${
|
|
2208
|
-
borderRadius:
|
|
2186
|
+
left: l ? `${l.x}px` : `${(window.innerWidth - m.width) / 2}px`,
|
|
2187
|
+
top: l ? `${l.y}px` : `${(window.innerHeight - m.height) / 2}px`,
|
|
2188
|
+
width: `${m.width}px`,
|
|
2189
|
+
height: `${m.height}px`,
|
|
2190
|
+
borderRadius: m.width >= window.innerWidth && l?.x === 0 && l?.y === 0 ? 0 : "14px",
|
|
2209
2191
|
"--primary": Pe,
|
|
2210
|
-
"--primary-contrast":
|
|
2211
|
-
} : n === "popup" &&
|
|
2192
|
+
"--primary-contrast": Le
|
|
2193
|
+
} : n === "popup" && We ? {
|
|
2212
2194
|
position: "fixed",
|
|
2213
|
-
left: `${
|
|
2214
|
-
top: `${
|
|
2195
|
+
left: `${We.x}px`,
|
|
2196
|
+
top: `${We.y}px`,
|
|
2215
2197
|
"--primary": Pe,
|
|
2216
|
-
"--primary-contrast":
|
|
2198
|
+
"--primary-contrast": Le
|
|
2217
2199
|
} : {
|
|
2218
2200
|
"--primary": Pe,
|
|
2219
|
-
"--primary-contrast":
|
|
2201
|
+
"--primary-contrast": Le
|
|
2220
2202
|
},
|
|
2221
2203
|
children: [
|
|
2222
2204
|
n === "fullpage" && /* @__PURE__ */ E(w, { children: [
|
|
2223
2205
|
/* @__PURE__ */ T("div", {
|
|
2224
|
-
onMouseDown: (e) =>
|
|
2206
|
+
onMouseDown: (e) => Ue(e, "ne"),
|
|
2225
2207
|
className: "resize-handle ne"
|
|
2226
2208
|
}),
|
|
2227
2209
|
/* @__PURE__ */ T("div", {
|
|
2228
|
-
onMouseDown: (e) =>
|
|
2210
|
+
onMouseDown: (e) => Ue(e, "nw"),
|
|
2229
2211
|
className: "resize-handle nw"
|
|
2230
2212
|
}),
|
|
2231
2213
|
/* @__PURE__ */ T("div", {
|
|
2232
|
-
onMouseDown: (e) =>
|
|
2214
|
+
onMouseDown: (e) => Ue(e, "se"),
|
|
2233
2215
|
className: "resize-handle se"
|
|
2234
2216
|
}),
|
|
2235
2217
|
/* @__PURE__ */ T("div", {
|
|
2236
|
-
onMouseDown: (e) =>
|
|
2218
|
+
onMouseDown: (e) => Ue(e, "sw"),
|
|
2237
2219
|
className: "resize-handle sw"
|
|
2238
2220
|
})
|
|
2239
2221
|
] }),
|
|
2240
2222
|
/* @__PURE__ */ T("div", {
|
|
2241
|
-
onMouseDown:
|
|
2242
|
-
onDoubleClick:
|
|
2223
|
+
onMouseDown: He,
|
|
2224
|
+
onDoubleClick: Ke,
|
|
2243
2225
|
style: { cursor: n === "fullpage" ? "move" : "default" },
|
|
2244
2226
|
children: /* @__PURE__ */ T(dn, {
|
|
2245
2227
|
mode: n,
|
|
2246
2228
|
title: e,
|
|
2247
2229
|
logoUrl: t,
|
|
2248
|
-
onBack: () =>
|
|
2230
|
+
onBack: () => q(V(null)),
|
|
2249
2231
|
onToggleMode: () => {
|
|
2250
|
-
if (n === "popup" && !
|
|
2232
|
+
if (n === "popup" && !l) {
|
|
2251
2233
|
let e = 1e3;
|
|
2252
|
-
|
|
2234
|
+
h?.({
|
|
2253
2235
|
width: e,
|
|
2254
2236
|
height: 750
|
|
2255
|
-
}),
|
|
2237
|
+
}), u?.({
|
|
2256
2238
|
x: (window.innerWidth - e) / 2,
|
|
2257
2239
|
y: (window.innerHeight - 750) / 2
|
|
2258
2240
|
});
|
|
@@ -2260,7 +2242,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2260
2242
|
r(n === "popup" ? "fullpage" : "popup");
|
|
2261
2243
|
},
|
|
2262
2244
|
onClose: () => r("closed"),
|
|
2263
|
-
onAddMemberClick: () => U &&
|
|
2245
|
+
onAddMemberClick: () => U && Be(),
|
|
2264
2246
|
onOpenSettings: () => N(!0)
|
|
2265
2247
|
})
|
|
2266
2248
|
}),
|
|
@@ -2268,23 +2250,23 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2268
2250
|
className: "chat-main-layout",
|
|
2269
2251
|
children: [n === "fullpage" && W && /* @__PURE__ */ T(ln, {
|
|
2270
2252
|
setIsThemeModalOpen: N,
|
|
2271
|
-
activeTab:
|
|
2272
|
-
setActiveTab:
|
|
2253
|
+
activeTab: P,
|
|
2254
|
+
setActiveTab: te
|
|
2273
2255
|
}), /* @__PURE__ */ E("div", {
|
|
2274
2256
|
className: "chat-body-container",
|
|
2275
2257
|
children: [
|
|
2276
2258
|
(n === "fullpage" || !U) && /* @__PURE__ */ T("div", {
|
|
2277
2259
|
className: `chat-sidebar ${n === "fullpage" ? "is-full" : ""}`,
|
|
2278
|
-
children:
|
|
2260
|
+
children: P === "chats" ? /* @__PURE__ */ E(w, { children: [
|
|
2279
2261
|
/* @__PURE__ */ T(cn, {
|
|
2280
|
-
value:
|
|
2281
|
-
onChange:
|
|
2282
|
-
onAddClick: () =>
|
|
2283
|
-
placeholder:
|
|
2262
|
+
value: me,
|
|
2263
|
+
onChange: Re,
|
|
2264
|
+
onAddClick: () => b(!0),
|
|
2265
|
+
placeholder: v("chatWindow.searchPlaceholder")
|
|
2284
2266
|
}),
|
|
2285
2267
|
/* @__PURE__ */ T("div", {
|
|
2286
2268
|
className: "chat-filter-tabs",
|
|
2287
|
-
children:
|
|
2269
|
+
children: me ? /* @__PURE__ */ E(w, { children: [
|
|
2288
2270
|
/* @__PURE__ */ T("button", {
|
|
2289
2271
|
className: L === "all" ? "active" : "",
|
|
2290
2272
|
onClick: () => R("all"),
|
|
@@ -2308,22 +2290,22 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2308
2290
|
] }) : /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("button", {
|
|
2309
2291
|
className: L === "all" ? "active" : "",
|
|
2310
2292
|
onClick: () => R("all"),
|
|
2311
|
-
children:
|
|
2293
|
+
children: v("chatWindow.filterAll") || "Tất cả"
|
|
2312
2294
|
}), /* @__PURE__ */ T("button", {
|
|
2313
2295
|
className: L === "unread" ? "active" : "",
|
|
2314
2296
|
onClick: () => R("unread"),
|
|
2315
2297
|
children: /* @__PURE__ */ E("div", {
|
|
2316
2298
|
className: "filter-unread-badge-container",
|
|
2317
|
-
children: [/* @__PURE__ */ T("span", { children: "Chưa đọc" }),
|
|
2299
|
+
children: [/* @__PURE__ */ T("span", { children: "Chưa đọc" }), Me > 0 && /* @__PURE__ */ T("span", {
|
|
2318
2300
|
className: "filter-unread-badge",
|
|
2319
|
-
children:
|
|
2301
|
+
children: Me
|
|
2320
2302
|
})]
|
|
2321
2303
|
})
|
|
2322
2304
|
})] })
|
|
2323
2305
|
}),
|
|
2324
2306
|
/* @__PURE__ */ T("div", {
|
|
2325
2307
|
className: "sidebar-scroll",
|
|
2326
|
-
children:
|
|
2308
|
+
children: me ? /* @__PURE__ */ E("div", {
|
|
2327
2309
|
className: "chat-search-results",
|
|
2328
2310
|
children: [
|
|
2329
2311
|
(L === "all" || L === "member") && /* @__PURE__ */ E("div", {
|
|
@@ -2335,33 +2317,30 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2335
2317
|
}),
|
|
2336
2318
|
/* @__PURE__ */ E("div", {
|
|
2337
2319
|
className: "search-section-content",
|
|
2338
|
-
children: [
|
|
2320
|
+
children: [J.filteredChat.slice(0, ve ? void 0 : 4).map((e) => /* @__PURE__ */ E("div", {
|
|
2339
2321
|
className: "search-result-item",
|
|
2340
|
-
onClick: () =>
|
|
2322
|
+
onClick: () => q(V(e)),
|
|
2341
2323
|
children: [/* @__PURE__ */ T("div", {
|
|
2342
2324
|
className: "search-result-avatar",
|
|
2343
|
-
children: /* @__PURE__ */ T(
|
|
2344
|
-
chat: e,
|
|
2345
|
-
currentUserId: W?.id
|
|
2346
|
-
})
|
|
2325
|
+
children: /* @__PURE__ */ T($, { member: e.type === "single" ? e.members?.find((e) => e.id !== W?.id) ?? e : e })
|
|
2347
2326
|
}), /* @__PURE__ */ E("div", {
|
|
2348
2327
|
className: "search-result-info",
|
|
2349
2328
|
children: [/* @__PURE__ */ T("div", {
|
|
2350
2329
|
className: "search-result-name",
|
|
2351
|
-
children:
|
|
2330
|
+
children: Fe(O(e, W?.id), H)
|
|
2352
2331
|
}), e.type === "group" && /* @__PURE__ */ E("div", {
|
|
2353
2332
|
className: "search-result-sub",
|
|
2354
2333
|
children: [
|
|
2355
2334
|
"Thành viên:",
|
|
2356
2335
|
" ",
|
|
2357
|
-
e.matchedMemberNames && e.matchedMemberNames.length > 0 ?
|
|
2336
|
+
e.matchedMemberNames && e.matchedMemberNames.length > 0 ? Fe(e.matchedMemberNames.join(", "), H) : Fe(H, H)
|
|
2358
2337
|
]
|
|
2359
2338
|
})]
|
|
2360
2339
|
})]
|
|
2361
|
-
}, `chat-${e.id}`)),
|
|
2340
|
+
}, `chat-${e.id}`)), J.matchedMembers.slice(0, ve ? void 0 : Math.max(0, 4 - J.filteredChat.length)).map((e) => /* @__PURE__ */ E("div", {
|
|
2362
2341
|
className: "search-result-item",
|
|
2363
2342
|
onClick: () => {
|
|
2364
|
-
|
|
2343
|
+
qe(String(e.id));
|
|
2365
2344
|
},
|
|
2366
2345
|
children: [/* @__PURE__ */ T("div", {
|
|
2367
2346
|
className: "search-result-avatar",
|
|
@@ -2376,19 +2355,19 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2376
2355
|
className: "search-result-info",
|
|
2377
2356
|
children: /* @__PURE__ */ T("div", {
|
|
2378
2357
|
className: "search-result-name",
|
|
2379
|
-
children:
|
|
2358
|
+
children: Fe(e.name, H)
|
|
2380
2359
|
})
|
|
2381
2360
|
})]
|
|
2382
2361
|
}, `member-${e.code}`))]
|
|
2383
2362
|
}),
|
|
2384
|
-
!
|
|
2363
|
+
!ve && J.filteredChat.length + J.matchedMembers.length > 4 && /* @__PURE__ */ T("button", {
|
|
2385
2364
|
className: "search-view-all",
|
|
2386
|
-
onClick: () =>
|
|
2365
|
+
onClick: () => ye(!0),
|
|
2387
2366
|
children: "Xem tất cả thành viên"
|
|
2388
2367
|
})
|
|
2389
2368
|
]
|
|
2390
2369
|
}),
|
|
2391
|
-
(L === "all" || L === "message") &&
|
|
2370
|
+
(L === "all" || L === "message") && J.matchedMessages.length > 0 && /* @__PURE__ */ E("div", {
|
|
2392
2371
|
className: "search-section",
|
|
2393
2372
|
children: [
|
|
2394
2373
|
/* @__PURE__ */ E("h3", {
|
|
@@ -2398,21 +2377,18 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2398
2377
|
" ",
|
|
2399
2378
|
/* @__PURE__ */ E("span", {
|
|
2400
2379
|
className: "search-count",
|
|
2401
|
-
children: ["+",
|
|
2380
|
+
children: ["+", J.matchedMessages.length]
|
|
2402
2381
|
})
|
|
2403
2382
|
]
|
|
2404
2383
|
}),
|
|
2405
2384
|
/* @__PURE__ */ T("div", {
|
|
2406
2385
|
className: "search-section-content",
|
|
2407
|
-
children:
|
|
2386
|
+
children: J.matchedMessages.slice(0, be ? void 0 : 3).map((e, t) => /* @__PURE__ */ E("div", {
|
|
2408
2387
|
className: "search-result-item message-result",
|
|
2409
|
-
onClick: () =>
|
|
2388
|
+
onClick: () => q(V(e.chat)),
|
|
2410
2389
|
children: [/* @__PURE__ */ T("div", {
|
|
2411
2390
|
className: "search-result-avatar",
|
|
2412
|
-
children: /* @__PURE__ */ T(
|
|
2413
|
-
chat: e.chat,
|
|
2414
|
-
currentUserId: W?.id
|
|
2415
|
-
})
|
|
2391
|
+
children: /* @__PURE__ */ T($, { member: e.chat.type === "single" ? e.chat.members?.find((e) => e.id !== W?.id) ?? e.chat : e.chat })
|
|
2416
2392
|
}), /* @__PURE__ */ E("div", {
|
|
2417
2393
|
className: "search-result-info",
|
|
2418
2394
|
children: [/* @__PURE__ */ E("div", {
|
|
@@ -2426,19 +2402,19 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2426
2402
|
})]
|
|
2427
2403
|
}), /* @__PURE__ */ T("div", {
|
|
2428
2404
|
className: "search-result-text",
|
|
2429
|
-
children:
|
|
2405
|
+
children: Fe(e.message?.content ?? "", H)
|
|
2430
2406
|
})]
|
|
2431
2407
|
})]
|
|
2432
2408
|
}, `msg-${t}`))
|
|
2433
2409
|
}),
|
|
2434
|
-
!
|
|
2410
|
+
!be && J.matchedMessages.length > 3 && /* @__PURE__ */ T("button", {
|
|
2435
2411
|
className: "search-view-all",
|
|
2436
|
-
onClick: () =>
|
|
2412
|
+
onClick: () => xe(!0),
|
|
2437
2413
|
children: "Xem tất cả tin nhắn"
|
|
2438
2414
|
})
|
|
2439
2415
|
]
|
|
2440
2416
|
}),
|
|
2441
|
-
(L === "all" || L === "file") &&
|
|
2417
|
+
(L === "all" || L === "file") && J.matchedFiles.length > 0 && /* @__PURE__ */ E("div", {
|
|
2442
2418
|
className: "search-section",
|
|
2443
2419
|
children: [
|
|
2444
2420
|
/* @__PURE__ */ E("h3", {
|
|
@@ -2448,15 +2424,15 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2448
2424
|
" ",
|
|
2449
2425
|
/* @__PURE__ */ T("span", {
|
|
2450
2426
|
className: "search-count",
|
|
2451
|
-
children:
|
|
2427
|
+
children: J.totalMatchedFiles
|
|
2452
2428
|
})
|
|
2453
2429
|
]
|
|
2454
2430
|
}),
|
|
2455
2431
|
/* @__PURE__ */ T("div", {
|
|
2456
2432
|
className: "search-section-content",
|
|
2457
|
-
children:
|
|
2433
|
+
children: J.matchedFiles.slice(0, Se ? void 0 : 3).map((e, t) => e.files.map((n, r) => /* @__PURE__ */ E("div", {
|
|
2458
2434
|
className: "search-result-item file-result",
|
|
2459
|
-
onClick: () =>
|
|
2435
|
+
onClick: () => q(V(e.chat)),
|
|
2460
2436
|
children: [/* @__PURE__ */ T("div", {
|
|
2461
2437
|
className: "file-icon-wrapper",
|
|
2462
2438
|
children: /* @__PURE__ */ T("i", { className: "fas fa-file-alt" })
|
|
@@ -2476,42 +2452,39 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2476
2452
|
})]
|
|
2477
2453
|
}, `file-${t}-${r}`)))
|
|
2478
2454
|
}),
|
|
2479
|
-
!
|
|
2455
|
+
!Se && J.totalMatchedFiles > 3 && /* @__PURE__ */ T("button", {
|
|
2480
2456
|
className: "search-view-all",
|
|
2481
|
-
onClick: () =>
|
|
2457
|
+
onClick: () => Ce(!0),
|
|
2482
2458
|
children: "Xem tất cả file"
|
|
2483
2459
|
})
|
|
2484
2460
|
]
|
|
2485
2461
|
})
|
|
2486
2462
|
]
|
|
2487
2463
|
}) : /* @__PURE__ */ T(sn, {
|
|
2488
|
-
chats:
|
|
2464
|
+
chats: J.filteredChat,
|
|
2489
2465
|
onSelectChat: (e) => {
|
|
2490
|
-
|
|
2491
|
-
}
|
|
2492
|
-
onRemoveChat: (e, t) => void Re(e, t),
|
|
2493
|
-
onUpdateGroup: ze,
|
|
2494
|
-
onAddMemberClick: Ve
|
|
2466
|
+
q(V(e)), W?.id && e.new?.[W.id] > 0 && G.readChat(e.id);
|
|
2467
|
+
}
|
|
2495
2468
|
})
|
|
2496
2469
|
})
|
|
2497
2470
|
] }) : /* @__PURE__ */ E("div", {
|
|
2498
2471
|
className: "contact-categories",
|
|
2499
2472
|
children: [/* @__PURE__ */ E("div", {
|
|
2500
|
-
className: `category-item ${
|
|
2501
|
-
onClick: () =>
|
|
2473
|
+
className: `category-item ${F === "members" ? "active" : ""}`,
|
|
2474
|
+
onClick: () => ne("members"),
|
|
2502
2475
|
children: [
|
|
2503
|
-
/* @__PURE__ */ T(
|
|
2476
|
+
/* @__PURE__ */ T(ct, {}),
|
|
2504
2477
|
/* @__PURE__ */ T("span", { children: "Danh sách thành viên" }),
|
|
2505
2478
|
/* @__PURE__ */ T("span", {
|
|
2506
2479
|
className: "count",
|
|
2507
|
-
children:
|
|
2480
|
+
children: Ae.length
|
|
2508
2481
|
})
|
|
2509
2482
|
]
|
|
2510
|
-
}),
|
|
2511
|
-
className: `category-item ${
|
|
2512
|
-
onClick: () =>
|
|
2483
|
+
}), we && /* @__PURE__ */ E("div", {
|
|
2484
|
+
className: `category-item ${F === "groups" ? "active" : ""}`,
|
|
2485
|
+
onClick: () => ne("groups"),
|
|
2513
2486
|
children: [
|
|
2514
|
-
/* @__PURE__ */ T(
|
|
2487
|
+
/* @__PURE__ */ T(lt, {}),
|
|
2515
2488
|
/* @__PURE__ */ T("span", { children: "Danh sách nhóm" }),
|
|
2516
2489
|
/* @__PURE__ */ T("span", {
|
|
2517
2490
|
className: "count",
|
|
@@ -2523,11 +2496,11 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2523
2496
|
}),
|
|
2524
2497
|
(n === "fullpage" || U) && /* @__PURE__ */ E("div", {
|
|
2525
2498
|
className: "chat-main",
|
|
2526
|
-
onDragEnter:
|
|
2527
|
-
onDragOver:
|
|
2528
|
-
onDragLeave:
|
|
2529
|
-
onDrop:
|
|
2530
|
-
children: [
|
|
2499
|
+
onDragEnter: Ee,
|
|
2500
|
+
onDragOver: De,
|
|
2501
|
+
onDragLeave: Oe,
|
|
2502
|
+
onDrop: ke,
|
|
2503
|
+
children: [Te && /* @__PURE__ */ T("div", {
|
|
2531
2504
|
className: "drag-overlay-full",
|
|
2532
2505
|
children: /* @__PURE__ */ E("div", {
|
|
2533
2506
|
className: "drag-content",
|
|
@@ -2536,10 +2509,10 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2536
2509
|
children: "📤"
|
|
2537
2510
|
}), /* @__PURE__ */ T("span", {
|
|
2538
2511
|
className: "drag-text",
|
|
2539
|
-
children:
|
|
2512
|
+
children: v("chatWindow.dragFile")
|
|
2540
2513
|
})]
|
|
2541
2514
|
})
|
|
2542
|
-
}),
|
|
2515
|
+
}), P === "chats" ? U ? /* @__PURE__ */ E(w, { children: [
|
|
2543
2516
|
/* @__PURE__ */ E("div", {
|
|
2544
2517
|
className: "chat-main-header",
|
|
2545
2518
|
children: [/* @__PURE__ */ E("div", {
|
|
@@ -2547,15 +2520,12 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2547
2520
|
children: [
|
|
2548
2521
|
n === "popup" && /* @__PURE__ */ T("button", {
|
|
2549
2522
|
className: "back-btn",
|
|
2550
|
-
onClick: () =>
|
|
2551
|
-
children: /* @__PURE__ */ T(
|
|
2523
|
+
onClick: () => q(V(null)),
|
|
2524
|
+
children: /* @__PURE__ */ T(ut, {})
|
|
2552
2525
|
}),
|
|
2553
2526
|
/* @__PURE__ */ T("div", {
|
|
2554
2527
|
className: "chat-main-avatar",
|
|
2555
|
-
children: /* @__PURE__ */ T(
|
|
2556
|
-
chat: U,
|
|
2557
|
-
currentUserId: W?.id
|
|
2558
|
-
})
|
|
2528
|
+
children: /* @__PURE__ */ T($, { member: U?.type === "single" ? U.members?.find((e) => e.id !== W?.id) ?? U : U })
|
|
2559
2529
|
}),
|
|
2560
2530
|
/* @__PURE__ */ E("div", {
|
|
2561
2531
|
className: "chat-main-text",
|
|
@@ -2564,24 +2534,24 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2564
2534
|
children: [/* @__PURE__ */ T("span", {
|
|
2565
2535
|
className: "chat-main-name",
|
|
2566
2536
|
children: O(U, W?.id)
|
|
2567
|
-
}), U.is_muted && /* @__PURE__ */ T(
|
|
2537
|
+
}), U.is_muted && /* @__PURE__ */ T(dt, {})]
|
|
2568
2538
|
}), /* @__PURE__ */ T("span", {
|
|
2569
2539
|
className: "chat-main-status",
|
|
2570
|
-
children: U.type === "single" ? (
|
|
2540
|
+
children: U.type === "single" ? (je.find((e) => e.id !== W?.id)?.socket_ids?.length ?? 0) > 0 ? "Đang hoạt động" : "Không hoạt động" : `${je.length ?? 0} thành viên`
|
|
2571
2541
|
})]
|
|
2572
2542
|
})
|
|
2573
2543
|
]
|
|
2574
2544
|
}), /* @__PURE__ */ T("div", {
|
|
2575
2545
|
className: "chat-main-actions",
|
|
2576
2546
|
children: /* @__PURE__ */ T("button", {
|
|
2577
|
-
className: `main-action-btn ${
|
|
2578
|
-
onClick: () =>
|
|
2579
|
-
children: /* @__PURE__ */ T(
|
|
2547
|
+
className: `main-action-btn ${j ? "active" : ""}`,
|
|
2548
|
+
onClick: () => M(!j),
|
|
2549
|
+
children: /* @__PURE__ */ T(ft, {})
|
|
2580
2550
|
})
|
|
2581
2551
|
})]
|
|
2582
2552
|
}),
|
|
2583
2553
|
/* @__PURE__ */ T(xn, {}),
|
|
2584
|
-
/* @__PURE__ */ T("div", { children: /* @__PURE__ */ T(fn, { ref:
|
|
2554
|
+
/* @__PURE__ */ T("div", { children: /* @__PURE__ */ T(fn, { ref: pe }) })
|
|
2585
2555
|
] }) : /* @__PURE__ */ E("div", {
|
|
2586
2556
|
className: "empty-chat-state",
|
|
2587
2557
|
children: [
|
|
@@ -2589,55 +2559,52 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2589
2559
|
className: "empty-icon",
|
|
2590
2560
|
children: "💬"
|
|
2591
2561
|
}),
|
|
2592
|
-
/* @__PURE__ */ T("h3", { children:
|
|
2593
|
-
/* @__PURE__ */ T("p", { children:
|
|
2562
|
+
/* @__PURE__ */ T("h3", { children: v("chatWindow.selectChat") }),
|
|
2563
|
+
/* @__PURE__ */ T("p", { children: v("chatWindow.startConversation") })
|
|
2594
2564
|
]
|
|
2595
|
-
}) : /* @__PURE__ */ T(w, { children:
|
|
2596
|
-
|
|
2565
|
+
}) : /* @__PURE__ */ T(w, { children: F === "members" ? /* @__PURE__ */ T(hn, { onMessageClick: (e) => {
|
|
2566
|
+
qe(e), te("chats");
|
|
2597
2567
|
} }) : /* @__PURE__ */ T(gn, {
|
|
2598
2568
|
groups: K.filter((e) => e.type === "group"),
|
|
2599
|
-
currentUserId: W?.id,
|
|
2600
2569
|
onGroupClick: (e) => {
|
|
2601
|
-
|
|
2570
|
+
q(V(e)), te("chats");
|
|
2602
2571
|
}
|
|
2603
2572
|
}) })]
|
|
2604
2573
|
}),
|
|
2605
|
-
n === "fullpage" &&
|
|
2606
|
-
onClose: () =>
|
|
2607
|
-
onAddMember: () =>
|
|
2574
|
+
n === "fullpage" && P === "chats" && U && j && /* @__PURE__ */ T(un, {
|
|
2575
|
+
onClose: () => M(!1),
|
|
2576
|
+
onAddMember: () => Be(),
|
|
2608
2577
|
onUpdateGroup: ze,
|
|
2609
2578
|
onRemoveMember: (e, t) => {
|
|
2610
|
-
|
|
2579
|
+
Ve(e, t);
|
|
2611
2580
|
}
|
|
2612
2581
|
})
|
|
2613
2582
|
]
|
|
2614
2583
|
})]
|
|
2615
2584
|
}),
|
|
2616
|
-
|
|
2617
|
-
|
|
2585
|
+
y && /* @__PURE__ */ T(an, { onClose: () => {
|
|
2586
|
+
b(!1);
|
|
2618
2587
|
} }),
|
|
2619
|
-
/* @__PURE__ */ T(
|
|
2620
|
-
isOpen:
|
|
2588
|
+
/* @__PURE__ */ T(qt, {
|
|
2589
|
+
isOpen: x,
|
|
2621
2590
|
onClose: () => {
|
|
2622
|
-
|
|
2591
|
+
S(!1), D(null);
|
|
2623
2592
|
},
|
|
2624
|
-
group:
|
|
2625
|
-
|
|
2626
|
-
|
|
2627
|
-
|
|
2628
|
-
}),
|
|
2629
|
-
A && /* @__PURE__ */ T(Yt, { onClose: () => {
|
|
2630
|
-
j(!1);
|
|
2593
|
+
group: C
|
|
2594
|
+
}, x ? C?.id ?? "open" : "closed"),
|
|
2595
|
+
k && /* @__PURE__ */ T(Jt, { onClose: () => {
|
|
2596
|
+
A(!1);
|
|
2631
2597
|
} }),
|
|
2632
2598
|
/* @__PURE__ */ T(rn, {
|
|
2633
|
-
isOpen:
|
|
2599
|
+
isOpen: ee,
|
|
2634
2600
|
onClose: () => N(!1),
|
|
2635
2601
|
defaultColor: "#ffffff"
|
|
2636
2602
|
}),
|
|
2637
2603
|
/* @__PURE__ */ T(Kt, {})
|
|
2638
2604
|
]
|
|
2639
2605
|
});
|
|
2640
|
-
}
|
|
2606
|
+
};
|
|
2607
|
+
i(({ chat: e, currentUserId: t }) => {
|
|
2641
2608
|
let n = d(() => e ? e.avatar ? e.avatar : e.type === "group" ? "👥" : e.members?.find((e) => e.id !== t)?.avatar ?? "👤" : "👤", [e, t]);
|
|
2642
2609
|
return n === "👥" || n === "👤" ? /* @__PURE__ */ T("div", {
|
|
2643
2610
|
className: "chat-avatar-emoji",
|
|
@@ -2648,18 +2615,21 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2648
2615
|
loading: "lazy",
|
|
2649
2616
|
className: "chat-avatar-img"
|
|
2650
2617
|
});
|
|
2651
|
-
})
|
|
2652
|
-
|
|
2653
|
-
|
|
2654
|
-
|
|
2655
|
-
|
|
2656
|
-
|
|
2657
|
-
|
|
2658
|
-
|
|
2618
|
+
});
|
|
2619
|
+
//#endregion
|
|
2620
|
+
//#region src/components/shared/ToastContainer.tsx
|
|
2621
|
+
var Kt = () => {
|
|
2622
|
+
let { toasts: e, removeToast: t } = Y(), { theme: n } = _((e) => e.setting), r = e.filter((e) => e.isConfirm), i = e.filter((e) => !e.isConfirm);
|
|
2623
|
+
return /* @__PURE__ */ E(w, { children: [r.length > 0 && /* @__PURE__ */ T("div", {
|
|
2624
|
+
className: `confirm-overlay ${n === "dark" ? "dark-theme" : ""}`,
|
|
2625
|
+
children: r.map((e) => /* @__PURE__ */ T("div", {
|
|
2626
|
+
className: `toast-item confirm-toast ${e.type}`,
|
|
2627
|
+
children: /* @__PURE__ */ E("div", {
|
|
2628
|
+
className: "confirm-modal-content",
|
|
2629
|
+
children: [/* @__PURE__ */ T("div", {
|
|
2659
2630
|
className: "toast-message",
|
|
2660
2631
|
children: e.message
|
|
2661
|
-
}),
|
|
2662
|
-
e.isConfirm && /* @__PURE__ */ E("div", {
|
|
2632
|
+
}), /* @__PURE__ */ E("div", {
|
|
2663
2633
|
className: "toast-actions",
|
|
2664
2634
|
children: [/* @__PURE__ */ T("button", {
|
|
2665
2635
|
className: "toast-btn cancel",
|
|
@@ -2670,16 +2640,24 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2670
2640
|
onClick: () => e.onConfirm?.(),
|
|
2671
2641
|
children: "Xác nhận"
|
|
2672
2642
|
})]
|
|
2673
|
-
})
|
|
2674
|
-
|
|
2675
|
-
className: "toast-close-btn",
|
|
2676
|
-
onClick: () => t(e.id),
|
|
2677
|
-
children: "✕"
|
|
2678
|
-
})
|
|
2679
|
-
]
|
|
2643
|
+
})]
|
|
2644
|
+
})
|
|
2680
2645
|
}, e.id))
|
|
2681
|
-
})
|
|
2682
|
-
|
|
2646
|
+
}), /* @__PURE__ */ T("div", {
|
|
2647
|
+
className: `toast-container ${n === "dark" ? "dark-theme" : ""}`,
|
|
2648
|
+
children: i.map((e) => /* @__PURE__ */ E("div", {
|
|
2649
|
+
className: `toast-item ${e.type}`,
|
|
2650
|
+
children: [/* @__PURE__ */ T("div", {
|
|
2651
|
+
className: "toast-message",
|
|
2652
|
+
children: e.message
|
|
2653
|
+
}), /* @__PURE__ */ T("button", {
|
|
2654
|
+
className: "toast-close-btn",
|
|
2655
|
+
onClick: () => t(e.id),
|
|
2656
|
+
children: "✕"
|
|
2657
|
+
})]
|
|
2658
|
+
}, e.id))
|
|
2659
|
+
})] });
|
|
2660
|
+
}, $ = ({ member: e }) => {
|
|
2683
2661
|
let [t, n] = p(!1), r = e.name?.charAt(0).toUpperCase() || "?";
|
|
2684
2662
|
if (e.avatar && !t) return /* @__PURE__ */ T("img", {
|
|
2685
2663
|
src: e.avatar,
|
|
@@ -2700,23 +2678,31 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2700
2678
|
style: { backgroundColor: i[(String(e.id)?.charCodeAt(0) || 0) % i.length] },
|
|
2701
2679
|
children: r
|
|
2702
2680
|
});
|
|
2703
|
-
},
|
|
2704
|
-
let
|
|
2705
|
-
|
|
2706
|
-
|
|
2681
|
+
}, qt = ({ isOpen: e, onClose: t, group: n }) => {
|
|
2682
|
+
let r = g(), { showToast: i, confirm: a } = Y(), { t: o } = X(), [s, c] = p(n?.name ?? ""), [l, u] = p(n?.avatar ?? ""), [f, m] = p(n?.avatar ?? ""), [h, v] = p(!1), { currentChatMembers: y, currentUser: b } = _((e) => e.chat), x = d(() => n ? s !== (n.name ?? "") || l !== (n.avatar ?? "") : !1, [
|
|
2683
|
+
s,
|
|
2684
|
+
l,
|
|
2685
|
+
n
|
|
2686
|
+
]);
|
|
2707
2687
|
if (!e || !n) return null;
|
|
2708
|
-
let
|
|
2709
|
-
if (e?.preventDefault(),
|
|
2710
|
-
|
|
2688
|
+
let S = async (e) => {
|
|
2689
|
+
if (e?.preventDefault(), s.trim()) {
|
|
2690
|
+
v(!0);
|
|
2711
2691
|
try {
|
|
2712
|
-
let e = typeof
|
|
2713
|
-
|
|
2692
|
+
let e = typeof l == "string" ? l.trim() || void 0 : l || void 0, a = await G.updateGroup(n.id, s.trim(), e);
|
|
2693
|
+
a?.data && (r(Te(a.data)), i("Cập nhật nhóm thành công", "success"), t());
|
|
2714
2694
|
} catch (e) {
|
|
2715
|
-
console.error(e);
|
|
2695
|
+
console.error(e), i("Lỗi khi cập nhật nhóm", "error");
|
|
2716
2696
|
} finally {
|
|
2717
|
-
|
|
2697
|
+
v(!1);
|
|
2718
2698
|
}
|
|
2719
2699
|
}
|
|
2700
|
+
}, C = async (e) => {
|
|
2701
|
+
if (await a("Bạn có chắc chắn muốn xóa thành viên này ra khỏi nhóm?")) try {
|
|
2702
|
+
await G.removeMember(n.id, e), r(_e(y.filter((t) => String(t.id) !== String(e)))), String(e) === String(b?.id) ? (i("Bạn đã rời khỏi nhóm này", "success"), t(), r(V(null)), r(he((await G.getChats()).data ?? []))) : i("Đã xóa thành viên khỏi nhóm", "success");
|
|
2703
|
+
} catch (e) {
|
|
2704
|
+
console.error("Lỗi khi xóa thành viên:", e), i("Không thể xóa thành viên. Vui lòng thử lại!", "error");
|
|
2705
|
+
}
|
|
2720
2706
|
};
|
|
2721
2707
|
return /* @__PURE__ */ T("div", {
|
|
2722
2708
|
className: "modal-overlay",
|
|
@@ -2729,11 +2715,11 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2729
2715
|
className: "modal-header",
|
|
2730
2716
|
children: [/* @__PURE__ */ T("h3", {
|
|
2731
2717
|
className: "modal-title",
|
|
2732
|
-
children:
|
|
2718
|
+
children: o("updateGroup.title")
|
|
2733
2719
|
}), /* @__PURE__ */ T("button", {
|
|
2734
2720
|
className: "close-modal-btn",
|
|
2735
2721
|
onClick: t,
|
|
2736
|
-
children: /* @__PURE__ */ T(
|
|
2722
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
2737
2723
|
})]
|
|
2738
2724
|
}),
|
|
2739
2725
|
/* @__PURE__ */ E("div", {
|
|
@@ -2748,17 +2734,17 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2748
2734
|
onChange: (e) => {
|
|
2749
2735
|
let t = e.target.files?.[0];
|
|
2750
2736
|
if (t) {
|
|
2751
|
-
|
|
2737
|
+
u(t);
|
|
2752
2738
|
let e = new FileReader();
|
|
2753
2739
|
e.onload = (e) => {
|
|
2754
|
-
|
|
2740
|
+
m(e.target?.result);
|
|
2755
2741
|
}, e.readAsDataURL(t);
|
|
2756
2742
|
}
|
|
2757
2743
|
}
|
|
2758
2744
|
}), /* @__PURE__ */ T("div", {
|
|
2759
2745
|
className: "avatar-placeholder",
|
|
2760
|
-
children:
|
|
2761
|
-
src:
|
|
2746
|
+
children: f ? /* @__PURE__ */ T("img", {
|
|
2747
|
+
src: f,
|
|
2762
2748
|
alt: "Preview"
|
|
2763
2749
|
}) : /* @__PURE__ */ E("svg", {
|
|
2764
2750
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2782,9 +2768,9 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2782
2768
|
}), /* @__PURE__ */ T("input", {
|
|
2783
2769
|
type: "text",
|
|
2784
2770
|
className: "group-name-input",
|
|
2785
|
-
value:
|
|
2786
|
-
onChange: (e) =>
|
|
2787
|
-
placeholder:
|
|
2771
|
+
value: s,
|
|
2772
|
+
onChange: (e) => c(e.target.value),
|
|
2773
|
+
placeholder: o("updateGroup.groupNamePlaceholder"),
|
|
2788
2774
|
required: !0
|
|
2789
2775
|
})]
|
|
2790
2776
|
}), /* @__PURE__ */ E("div", {
|
|
@@ -2792,23 +2778,23 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2792
2778
|
children: [/* @__PURE__ */ E("span", {
|
|
2793
2779
|
className: "section-title",
|
|
2794
2780
|
children: [
|
|
2795
|
-
|
|
2781
|
+
o("updateGroup.membersSection"),
|
|
2796
2782
|
" (",
|
|
2797
|
-
|
|
2783
|
+
y?.length,
|
|
2798
2784
|
")"
|
|
2799
2785
|
]
|
|
2800
2786
|
}), /* @__PURE__ */ T("div", {
|
|
2801
2787
|
className: "members-list-container",
|
|
2802
2788
|
children: /* @__PURE__ */ T("div", {
|
|
2803
2789
|
className: "members-list",
|
|
2804
|
-
children:
|
|
2805
|
-
let t = e.id === n.owner_id, r = e.id ===
|
|
2790
|
+
children: y.map((e) => {
|
|
2791
|
+
let t = e.id === n.owner_id, r = e.id === b?.id;
|
|
2806
2792
|
return /* @__PURE__ */ E("div", {
|
|
2807
2793
|
className: "member-item",
|
|
2808
2794
|
children: [
|
|
2809
2795
|
/* @__PURE__ */ E("div", {
|
|
2810
2796
|
className: "member-avatar-wrapper",
|
|
2811
|
-
children: [/* @__PURE__ */ T(
|
|
2797
|
+
children: [/* @__PURE__ */ T($, { member: e }), (e.socket_ids?.length ?? 0) > 0 || e.socket_id || e.status === "online" ? /* @__PURE__ */ T(at, {
|
|
2812
2798
|
size: 12,
|
|
2813
2799
|
className: "status-dot"
|
|
2814
2800
|
}) : null]
|
|
@@ -2820,7 +2806,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2820
2806
|
children: [/* @__PURE__ */ T("span", {
|
|
2821
2807
|
className: "member-name",
|
|
2822
2808
|
children: r ? "Bạn" : e.name
|
|
2823
|
-
}), t && /* @__PURE__ */ T(
|
|
2809
|
+
}), t && /* @__PURE__ */ T(ot, {
|
|
2824
2810
|
size: 14,
|
|
2825
2811
|
className: "owner-icon"
|
|
2826
2812
|
})]
|
|
@@ -2833,9 +2819,9 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2833
2819
|
type: "button",
|
|
2834
2820
|
className: "remove-member-btn",
|
|
2835
2821
|
onClick: (t) => {
|
|
2836
|
-
t.stopPropagation(),
|
|
2822
|
+
t.stopPropagation(), C(e.id);
|
|
2837
2823
|
},
|
|
2838
|
-
title:
|
|
2824
|
+
title: o("updateGroup.removeMemberButtonTitle"),
|
|
2839
2825
|
children: "✕"
|
|
2840
2826
|
})
|
|
2841
2827
|
]
|
|
@@ -2850,21 +2836,20 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2850
2836
|
children: [/* @__PURE__ */ T("button", {
|
|
2851
2837
|
className: "footer-btn cancel",
|
|
2852
2838
|
onClick: t,
|
|
2853
|
-
disabled:
|
|
2854
|
-
children:
|
|
2839
|
+
disabled: h,
|
|
2840
|
+
children: o("updateGroup.cancelButton")
|
|
2855
2841
|
}), /* @__PURE__ */ T("button", {
|
|
2856
|
-
className: `footer-btn confirm ${
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
children: S(f ? "updateGroup.updatingButton" : "updateGroup.updateButton")
|
|
2842
|
+
className: `footer-btn confirm ${h || !s.trim() || !x ? "disabled" : ""}`,
|
|
2843
|
+
onClick: () => void S(),
|
|
2844
|
+
disabled: h || !s.trim() || !x,
|
|
2845
|
+
children: o(h ? "updateGroup.updatingButton" : "updateGroup.updateButton")
|
|
2861
2846
|
})]
|
|
2862
2847
|
})
|
|
2863
2848
|
]
|
|
2864
2849
|
})
|
|
2865
2850
|
});
|
|
2866
|
-
},
|
|
2867
|
-
let [t, n] = p(""), [r, i] = p(!1), { t: a } =
|
|
2851
|
+
}, Jt = ({ onClose: e }) => {
|
|
2852
|
+
let [t, n] = p(""), [r, i] = p(!1), { t: a } = X(), { currentChatMembers: o, members: s, currentChat: c } = _((e) => e.chat), l = g(), { showToast: u } = Y();
|
|
2868
2853
|
if (!c || c?.type === "single") return null;
|
|
2869
2854
|
let d = new Set((o || []).map((e) => e.id)), f = (s || []).filter((e) => !d.has(e.id) && e.name.toLowerCase().includes(t.toLowerCase())), m = async (t) => {
|
|
2870
2855
|
if (!r) {
|
|
@@ -2946,7 +2931,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2946
2931
|
children: [
|
|
2947
2932
|
/* @__PURE__ */ E("div", {
|
|
2948
2933
|
className: "member-avatar-wrapper",
|
|
2949
|
-
children: [/* @__PURE__ */ T(
|
|
2934
|
+
children: [/* @__PURE__ */ T($, { member: e }), (e.socket_ids?.length ?? 0) > 0 || e.socket_id || e.status === "online" ? /* @__PURE__ */ T(at, {
|
|
2950
2935
|
size: 12,
|
|
2951
2936
|
className: "status-dot"
|
|
2952
2937
|
}) : null]
|
|
@@ -2975,12 +2960,12 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2975
2960
|
]
|
|
2976
2961
|
})
|
|
2977
2962
|
});
|
|
2978
|
-
},
|
|
2963
|
+
}, Yt = ({ file: e }) => /* @__PURE__ */ T("img", {
|
|
2979
2964
|
src: e.link,
|
|
2980
2965
|
alt: e.name,
|
|
2981
2966
|
className: "file-viewer-image",
|
|
2982
2967
|
title: e.name
|
|
2983
|
-
}),
|
|
2968
|
+
}), Xt = ({ file: e }) => /* @__PURE__ */ T("div", {
|
|
2984
2969
|
className: "video-container",
|
|
2985
2970
|
children: /* @__PURE__ */ T("video", {
|
|
2986
2971
|
src: e.link,
|
|
@@ -2989,7 +2974,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
2989
2974
|
className: "file-viewer-video",
|
|
2990
2975
|
title: e.name
|
|
2991
2976
|
})
|
|
2992
|
-
}),
|
|
2977
|
+
}), Zt = ({ file: e }) => /* @__PURE__ */ T("div", {
|
|
2993
2978
|
className: "audio-container",
|
|
2994
2979
|
children: /* @__PURE__ */ E("div", {
|
|
2995
2980
|
className: "audio-player-wrapper",
|
|
@@ -3004,7 +2989,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3004
2989
|
children: e.name
|
|
3005
2990
|
})]
|
|
3006
2991
|
})
|
|
3007
|
-
}),
|
|
2992
|
+
}), Qt = ({ file: e }) => /* @__PURE__ */ T("div", {
|
|
3008
2993
|
className: "pdf-container",
|
|
3009
2994
|
children: /* @__PURE__ */ T("iframe", {
|
|
3010
2995
|
src: `${e.link}#toolbar=1&navpanes=0`,
|
|
@@ -3017,7 +3002,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3017
3002
|
borderRadius: "8px"
|
|
3018
3003
|
}
|
|
3019
3004
|
})
|
|
3020
|
-
}),
|
|
3005
|
+
}), $t = ({ file: e, openDownloadButtonText: t }) => /* @__PURE__ */ E("div", {
|
|
3021
3006
|
className: "file-viewer-generic",
|
|
3022
3007
|
children: [
|
|
3023
3008
|
/* @__PURE__ */ T("div", {
|
|
@@ -3036,8 +3021,14 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3036
3021
|
children: t
|
|
3037
3022
|
})
|
|
3038
3023
|
]
|
|
3024
|
+
}), en = ({ file: e, index: t, currentIndex: n, onClick: r, children: i }) => /* @__PURE__ */ T("button", {
|
|
3025
|
+
className: `file-viewer-thumbnail ${t === n ? "active" : ""}`,
|
|
3026
|
+
onClick: () => r(t),
|
|
3027
|
+
title: e.name,
|
|
3028
|
+
"aria-label": `Go to image ${t + 1}`,
|
|
3029
|
+
children: i
|
|
3039
3030
|
}), tn = ({ isOpen: e, files: t, initialIndex: n = 0, onClose: r }) => {
|
|
3040
|
-
let [i, a] = p(n), o = f(null), { t: s } =
|
|
3031
|
+
let [i, a] = p(n), o = f(null), { t: s } = X();
|
|
3041
3032
|
if (!e || t.length === 0) return null;
|
|
3042
3033
|
let c = () => {
|
|
3043
3034
|
a((e) => e === 0 ? t.length - 1 : e - 1);
|
|
@@ -3055,7 +3046,64 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3055
3046
|
});
|
|
3056
3047
|
}, m = (e) => {
|
|
3057
3048
|
e.key === "ArrowLeft" ? c() : e.key === "ArrowRight" ? l() : e.key === "Escape" && r();
|
|
3058
|
-
}, h = t[i], g =
|
|
3049
|
+
}, h = t[i], g = se(h.name), _ = (e, t) => {
|
|
3050
|
+
let n = se(e.name), r;
|
|
3051
|
+
switch (n) {
|
|
3052
|
+
case "image":
|
|
3053
|
+
r = /* @__PURE__ */ T("img", {
|
|
3054
|
+
src: e.link,
|
|
3055
|
+
alt: `Thumb ${t + 1}`,
|
|
3056
|
+
className: "thumbnail-image"
|
|
3057
|
+
});
|
|
3058
|
+
break;
|
|
3059
|
+
case "video":
|
|
3060
|
+
r = /* @__PURE__ */ E("div", {
|
|
3061
|
+
className: "video-thumbnail-container",
|
|
3062
|
+
children: [/* @__PURE__ */ T("video", {
|
|
3063
|
+
src: `${e.link}#t=0.1`,
|
|
3064
|
+
className: "thumbnail-video",
|
|
3065
|
+
muted: !0,
|
|
3066
|
+
preload: "metadata"
|
|
3067
|
+
}), /* @__PURE__ */ T("div", {
|
|
3068
|
+
className: "play-icon-overlay",
|
|
3069
|
+
children: /* @__PURE__ */ T("span", {
|
|
3070
|
+
className: "play-arrow",
|
|
3071
|
+
children: "▶"
|
|
3072
|
+
})
|
|
3073
|
+
})]
|
|
3074
|
+
});
|
|
3075
|
+
break;
|
|
3076
|
+
case "audio":
|
|
3077
|
+
r = /* @__PURE__ */ T("div", {
|
|
3078
|
+
className: "audio-thumbnail-container",
|
|
3079
|
+
children: /* @__PURE__ */ T("div", {
|
|
3080
|
+
className: "audio-thumbnail-icon",
|
|
3081
|
+
children: "🎵"
|
|
3082
|
+
})
|
|
3083
|
+
});
|
|
3084
|
+
break;
|
|
3085
|
+
case "pdf":
|
|
3086
|
+
r = /* @__PURE__ */ T("div", {
|
|
3087
|
+
className: "pdf-thumbnail-container",
|
|
3088
|
+
children: /* @__PURE__ */ T("div", {
|
|
3089
|
+
className: "pdf-thumbnail-icon",
|
|
3090
|
+
children: "📕"
|
|
3091
|
+
})
|
|
3092
|
+
});
|
|
3093
|
+
break;
|
|
3094
|
+
default: r = /* @__PURE__ */ T("div", {
|
|
3095
|
+
className: "thumbnail-icon",
|
|
3096
|
+
children: "📄"
|
|
3097
|
+
});
|
|
3098
|
+
}
|
|
3099
|
+
return /* @__PURE__ */ T(en, {
|
|
3100
|
+
file: e,
|
|
3101
|
+
currentIndex: i,
|
|
3102
|
+
onClick: () => a(t),
|
|
3103
|
+
index: t,
|
|
3104
|
+
children: r
|
|
3105
|
+
}, e.id);
|
|
3106
|
+
};
|
|
3059
3107
|
return /* @__PURE__ */ T("div", {
|
|
3060
3108
|
className: "file-viewer-overlay",
|
|
3061
3109
|
onClick: r,
|
|
@@ -3073,16 +3121,16 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3073
3121
|
onClick: r,
|
|
3074
3122
|
"aria-label": s("fileViewer.closeAriaLabel"),
|
|
3075
3123
|
title: s("fileViewer.closeButtonTitle"),
|
|
3076
|
-
children: /* @__PURE__ */ T(
|
|
3124
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
3077
3125
|
}),
|
|
3078
3126
|
/* @__PURE__ */ E("div", {
|
|
3079
3127
|
className: "file-viewer-main",
|
|
3080
3128
|
children: [
|
|
3081
|
-
g === "image" && /* @__PURE__ */ T(
|
|
3082
|
-
g === "video" && /* @__PURE__ */ T(
|
|
3083
|
-
g === "audio" && /* @__PURE__ */ T(
|
|
3084
|
-
g === "pdf" && /* @__PURE__ */ T(
|
|
3085
|
-
g === "other" && /* @__PURE__ */ T(
|
|
3129
|
+
g === "image" && /* @__PURE__ */ T(Yt, { file: h }),
|
|
3130
|
+
g === "video" && /* @__PURE__ */ T(Xt, { file: h }),
|
|
3131
|
+
g === "audio" && /* @__PURE__ */ T(Zt, { file: h }),
|
|
3132
|
+
g === "pdf" && /* @__PURE__ */ T(Qt, { file: h }),
|
|
3133
|
+
g === "other" && /* @__PURE__ */ T($t, {
|
|
3086
3134
|
file: h,
|
|
3087
3135
|
openDownloadButtonText: s("fileViewer.openDownloadButton")
|
|
3088
3136
|
})
|
|
@@ -3093,13 +3141,13 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3093
3141
|
onClick: c,
|
|
3094
3142
|
"aria-label": s("fileViewer.previousAriaLabel"),
|
|
3095
3143
|
title: s("fileViewer.previousButtonTitle"),
|
|
3096
|
-
children: /* @__PURE__ */ T(
|
|
3144
|
+
children: /* @__PURE__ */ T(pt, {})
|
|
3097
3145
|
}), /* @__PURE__ */ T("button", {
|
|
3098
3146
|
className: "file-viewer-nav file-viewer-next",
|
|
3099
3147
|
onClick: l,
|
|
3100
3148
|
"aria-label": s("fileViewer.nextAriaLabel"),
|
|
3101
3149
|
title: s("fileViewer.nextButtonTitle"),
|
|
3102
|
-
children: /* @__PURE__ */ T(
|
|
3150
|
+
children: /* @__PURE__ */ T(mt, {})
|
|
3103
3151
|
})] }),
|
|
3104
3152
|
/* @__PURE__ */ E("div", {
|
|
3105
3153
|
className: "file-viewer-counter",
|
|
@@ -3117,61 +3165,19 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3117
3165
|
onClick: u,
|
|
3118
3166
|
"aria-label": s("fileViewer.scrollLeftAriaLabel"),
|
|
3119
3167
|
title: s("fileViewer.scrollLeftTitle"),
|
|
3120
|
-
children: /* @__PURE__ */ T(
|
|
3168
|
+
children: /* @__PURE__ */ T(pt, {})
|
|
3121
3169
|
}),
|
|
3122
3170
|
/* @__PURE__ */ T("div", {
|
|
3123
3171
|
className: "file-viewer-thumbnails",
|
|
3124
3172
|
ref: o,
|
|
3125
|
-
children: t.map((e, t) =>
|
|
3126
|
-
let n = z(e.name);
|
|
3127
|
-
return /* @__PURE__ */ T("button", {
|
|
3128
|
-
className: `file-viewer-thumbnail ${t === i ? "active" : ""}`,
|
|
3129
|
-
onClick: () => a(t),
|
|
3130
|
-
title: e.name,
|
|
3131
|
-
"aria-label": `Go to image ${t + 1}`,
|
|
3132
|
-
children: n === "image" ? /* @__PURE__ */ T("img", {
|
|
3133
|
-
src: e.link,
|
|
3134
|
-
alt: `Thumb ${t + 1}`,
|
|
3135
|
-
className: "thumbnail-image"
|
|
3136
|
-
}) : n === "video" ? /* @__PURE__ */ E("div", {
|
|
3137
|
-
className: "video-thumbnail-container",
|
|
3138
|
-
children: [/* @__PURE__ */ T("video", {
|
|
3139
|
-
src: `${e.link}#t=0.1`,
|
|
3140
|
-
className: "thumbnail-video",
|
|
3141
|
-
muted: !0,
|
|
3142
|
-
preload: "metadata"
|
|
3143
|
-
}), /* @__PURE__ */ T("div", {
|
|
3144
|
-
className: "play-icon-overlay",
|
|
3145
|
-
children: /* @__PURE__ */ T("span", {
|
|
3146
|
-
className: "play-arrow",
|
|
3147
|
-
children: "▶"
|
|
3148
|
-
})
|
|
3149
|
-
})]
|
|
3150
|
-
}) : n === "audio" ? /* @__PURE__ */ T("div", {
|
|
3151
|
-
className: "audio-thumbnail-container",
|
|
3152
|
-
children: /* @__PURE__ */ T("div", {
|
|
3153
|
-
className: "audio-thumbnail-icon",
|
|
3154
|
-
children: "🎵"
|
|
3155
|
-
})
|
|
3156
|
-
}) : n === "pdf" ? /* @__PURE__ */ T("div", {
|
|
3157
|
-
className: "pdf-thumbnail-container",
|
|
3158
|
-
children: /* @__PURE__ */ T("div", {
|
|
3159
|
-
className: "pdf-thumbnail-icon",
|
|
3160
|
-
children: "📕"
|
|
3161
|
-
})
|
|
3162
|
-
}) : /* @__PURE__ */ T("div", {
|
|
3163
|
-
className: "thumbnail-icon",
|
|
3164
|
-
children: "📄"
|
|
3165
|
-
})
|
|
3166
|
-
}, e.id);
|
|
3167
|
-
})
|
|
3173
|
+
children: t.map((e, t) => _(e, t))
|
|
3168
3174
|
}),
|
|
3169
3175
|
/* @__PURE__ */ T("button", {
|
|
3170
3176
|
className: "file-viewer-thumbnails-scroll-btn file-viewer-thumbnails-scroll-next",
|
|
3171
3177
|
onClick: d,
|
|
3172
3178
|
"aria-label": s("fileViewer.scrollRightAriaLabel"),
|
|
3173
3179
|
title: s("fileViewer.scrollRightTitle"),
|
|
3174
|
-
children: /* @__PURE__ */ T(
|
|
3180
|
+
children: /* @__PURE__ */ T(mt, {})
|
|
3175
3181
|
})
|
|
3176
3182
|
]
|
|
3177
3183
|
})
|
|
@@ -3189,7 +3195,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3189
3195
|
"#6366f1",
|
|
3190
3196
|
"#14b8a6"
|
|
3191
3197
|
], rn = ({ isOpen: e, onClose: t, defaultColor: n = "#ffffff" }) => {
|
|
3192
|
-
let r = g(), { t: i } =
|
|
3198
|
+
let r = g(), { t: i } = X(), { primaryColor: a } = _((e) => e.setting);
|
|
3193
3199
|
return e ? /* @__PURE__ */ T("div", {
|
|
3194
3200
|
className: "modal-overlay",
|
|
3195
3201
|
onClick: t,
|
|
@@ -3224,7 +3230,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3224
3230
|
children: nn.map((e) => /* @__PURE__ */ T("button", {
|
|
3225
3231
|
className: `color-preset-btn ${a === e ? "active" : ""}`,
|
|
3226
3232
|
style: { backgroundColor: e },
|
|
3227
|
-
onClick: () => r(
|
|
3233
|
+
onClick: () => r(Ie(e)),
|
|
3228
3234
|
children: a === e && /* @__PURE__ */ T("span", {
|
|
3229
3235
|
className: "check-icon",
|
|
3230
3236
|
children: "✓"
|
|
@@ -3241,7 +3247,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3241
3247
|
children: [/* @__PURE__ */ T("input", {
|
|
3242
3248
|
type: "color",
|
|
3243
3249
|
value: a,
|
|
3244
|
-
onChange: (e) => r(
|
|
3250
|
+
onChange: (e) => r(Ie(e.target.value)),
|
|
3245
3251
|
className: "color-input"
|
|
3246
3252
|
}), /* @__PURE__ */ T("span", {
|
|
3247
3253
|
className: "color-hex-code",
|
|
@@ -3259,7 +3265,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3259
3265
|
children: i("themeModal.doneButton")
|
|
3260
3266
|
}), /* @__PURE__ */ T("button", {
|
|
3261
3267
|
className: "modal-btn cancel",
|
|
3262
|
-
onClick: () => r(
|
|
3268
|
+
onClick: () => r(Ie(n)),
|
|
3263
3269
|
children: i("themeModal.resetButton")
|
|
3264
3270
|
})]
|
|
3265
3271
|
})
|
|
@@ -3267,7 +3273,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3267
3273
|
})
|
|
3268
3274
|
}) : null;
|
|
3269
3275
|
}, an = ({ onClose: e }) => {
|
|
3270
|
-
let { t } =
|
|
3276
|
+
let { t } = X(), n = g(), { showToast: r } = Y(), { members: i, chats: o } = _((e) => e.chat), [s, c] = p([]), [l, u] = p(""), [d, m] = p(""), [h, v] = p(""), [y, b] = p(""), x = f(null), S = (e) => {
|
|
3271
3277
|
c((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
|
|
3272
3278
|
}, C = (e) => {
|
|
3273
3279
|
let t = e.target.files?.[0];
|
|
@@ -3312,7 +3318,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3312
3318
|
}), /* @__PURE__ */ T("button", {
|
|
3313
3319
|
className: "close-modal-btn",
|
|
3314
3320
|
onClick: e,
|
|
3315
|
-
children: /* @__PURE__ */ T(
|
|
3321
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
3316
3322
|
})]
|
|
3317
3323
|
}),
|
|
3318
3324
|
/* @__PURE__ */ E("div", {
|
|
@@ -3336,7 +3342,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3336
3342
|
src: y,
|
|
3337
3343
|
alt: "Group avatar",
|
|
3338
3344
|
className: "preview-avatar"
|
|
3339
|
-
}) : /* @__PURE__ */ T(
|
|
3345
|
+
}) : /* @__PURE__ */ T(Wt, {})
|
|
3340
3346
|
})]
|
|
3341
3347
|
}), /* @__PURE__ */ T("input", {
|
|
3342
3348
|
type: "text",
|
|
@@ -3363,7 +3369,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3363
3369
|
onClick: (t) => {
|
|
3364
3370
|
t.stopPropagation(), S(e);
|
|
3365
3371
|
},
|
|
3366
|
-
children: /* @__PURE__ */ T(
|
|
3372
|
+
children: /* @__PURE__ */ T(Q, { size: 14 })
|
|
3367
3373
|
})]
|
|
3368
3374
|
}, e))
|
|
3369
3375
|
}),
|
|
@@ -3406,7 +3412,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3406
3412
|
className: "avatar-letter",
|
|
3407
3413
|
children: e.name.charAt(0).toUpperCase()
|
|
3408
3414
|
})
|
|
3409
|
-
}), (e.socket_ids?.length ?? 0) > 0 || e.socket_id || e.status === "online" ? /* @__PURE__ */ T(
|
|
3415
|
+
}), (e.socket_ids?.length ?? 0) > 0 || e.socket_id || e.status === "online" ? /* @__PURE__ */ T(at, {
|
|
3410
3416
|
size: 12,
|
|
3411
3417
|
className: "status-dot"
|
|
3412
3418
|
}) : null]
|
|
@@ -3447,14 +3453,14 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3447
3453
|
/* @__PURE__ */ T("button", {
|
|
3448
3454
|
className: "close-modal-btn",
|
|
3449
3455
|
onClick: t,
|
|
3450
|
-
children: /* @__PURE__ */ T(
|
|
3456
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
3451
3457
|
}),
|
|
3452
3458
|
/* @__PURE__ */ E("div", {
|
|
3453
3459
|
className: "profile-header",
|
|
3454
3460
|
children: [
|
|
3455
3461
|
/* @__PURE__ */ E("div", {
|
|
3456
3462
|
className: "profile-avatar-wrapper",
|
|
3457
|
-
children: [/* @__PURE__ */ T(
|
|
3463
|
+
children: [/* @__PURE__ */ T($, { member: e }), n && /* @__PURE__ */ T("span", { className: "profile-online-status" })]
|
|
3458
3464
|
}),
|
|
3459
3465
|
/* @__PURE__ */ T("h3", {
|
|
3460
3466
|
className: "profile-name",
|
|
@@ -3471,7 +3477,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3471
3477
|
children: /* @__PURE__ */ E("button", {
|
|
3472
3478
|
className: "profile-action-btn",
|
|
3473
3479
|
onClick: r,
|
|
3474
|
-
children: [/* @__PURE__ */ T(
|
|
3480
|
+
children: [/* @__PURE__ */ T(ht, {}), /* @__PURE__ */ T("span", { children: "Nhắn tin" })]
|
|
3475
3481
|
})
|
|
3476
3482
|
}),
|
|
3477
3483
|
/* @__PURE__ */ E("div", {
|
|
@@ -3532,104 +3538,44 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3532
3538
|
]
|
|
3533
3539
|
})
|
|
3534
3540
|
}) : null, sn = ({ chats: e, onSelectChat: t }) => {
|
|
3535
|
-
let
|
|
3536
|
-
hour: "2-digit",
|
|
3537
|
-
minute: "2-digit"
|
|
3538
|
-
}) : "";
|
|
3541
|
+
let [n, r] = p(null), { hasGroupChat: i } = _(Ge), a = e.filter((e) => !(e.type === "group" && !i)), o = a.filter((e) => e.is_pined), s = a.filter((e) => !e.is_pined);
|
|
3539
3542
|
return /* @__PURE__ */ E("div", {
|
|
3540
3543
|
className: "chat-list",
|
|
3541
|
-
children: [
|
|
3542
|
-
|
|
3543
|
-
/* @__PURE__ */
|
|
3544
|
-
className: "
|
|
3545
|
-
children:
|
|
3546
|
-
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
|
|
3557
|
-
|
|
3558
|
-
|
|
3559
|
-
|
|
3560
|
-
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
|
|
3565
|
-
|
|
3566
|
-
|
|
3567
|
-
chat: e,
|
|
3568
|
-
currentUserId: n?.id
|
|
3569
|
-
}), e.type === "single" && u && /* @__PURE__ */ T(it, {
|
|
3570
|
-
size: 12,
|
|
3571
|
-
className: "online-indicator"
|
|
3572
|
-
})]
|
|
3573
|
-
}), /* @__PURE__ */ E("div", {
|
|
3574
|
-
className: "chat-item-info",
|
|
3575
|
-
children: [/* @__PURE__ */ E("div", {
|
|
3576
|
-
className: "info-top-row",
|
|
3577
|
-
children: [/* @__PURE__ */ T("div", {
|
|
3578
|
-
className: "chat-item-name",
|
|
3579
|
-
children: /* @__PURE__ */ T("span", {
|
|
3580
|
-
className: "name-text",
|
|
3581
|
-
children: O(e, n?.id)
|
|
3582
|
-
})
|
|
3583
|
-
}), /* @__PURE__ */ T("span", {
|
|
3584
|
-
className: "chat-item-time",
|
|
3585
|
-
children: f(e.message?.created_at ?? e.updated_at)
|
|
3586
|
-
})]
|
|
3587
|
-
}), /* @__PURE__ */ E("div", {
|
|
3588
|
-
className: "info-bottom-row",
|
|
3589
|
-
children: [/* @__PURE__ */ T("div", {
|
|
3590
|
-
className: "chat-item-last",
|
|
3591
|
-
children: /* @__PURE__ */ E("span", {
|
|
3592
|
-
className: "last-message-text",
|
|
3593
|
-
children: [a && `${s("chatList.yourMessage")}`, e.message?.content ?? (e.message?.files?.length ? s("chatMessage.states.attachment") : "")]
|
|
3594
|
-
})
|
|
3595
|
-
}), /* @__PURE__ */ E("div", {
|
|
3596
|
-
className: "info-bottom-right",
|
|
3597
|
-
children: [e.is_muted && /* @__PURE__ */ T(ut, {
|
|
3598
|
-
size: 14,
|
|
3599
|
-
className: "mute-icon-list"
|
|
3600
|
-
}), c > 0 && /* @__PURE__ */ T("div", {
|
|
3601
|
-
className: "unread-badge-circle",
|
|
3602
|
-
children: c > 99 ? "99+" : c
|
|
3603
|
-
})]
|
|
3604
|
-
})]
|
|
3605
|
-
})]
|
|
3606
|
-
})]
|
|
3607
|
-
}, e.id);
|
|
3608
|
-
}) : u.length === 0 ? /* @__PURE__ */ T("div", {
|
|
3609
|
-
className: "empty-chat-list",
|
|
3610
|
-
children: "Không có tin nhắn nào"
|
|
3611
|
-
}) : null]
|
|
3612
|
-
}),
|
|
3613
|
-
a && /* @__PURE__ */ T(on, {
|
|
3614
|
-
user: a.user,
|
|
3615
|
-
isOnline: a.isOnline,
|
|
3616
|
-
onClose: () => o(null),
|
|
3617
|
-
onMessage: () => {
|
|
3618
|
-
if (!a) return;
|
|
3619
|
-
let n = e.find((e) => e.type === "single" && e.members?.some((e) => e.id === a.user.id));
|
|
3620
|
-
n && t(n), o(null);
|
|
3621
|
-
}
|
|
3622
|
-
})
|
|
3623
|
-
]
|
|
3544
|
+
children: [/* @__PURE__ */ E("div", {
|
|
3545
|
+
className: "chat-list-section",
|
|
3546
|
+
children: [/* @__PURE__ */ T("div", {
|
|
3547
|
+
className: "section-header",
|
|
3548
|
+
children: /* @__PURE__ */ T("span", { children: "Tất cả tin nhắn" })
|
|
3549
|
+
}), s.length > 0 ? s.map((e) => /* @__PURE__ */ T(Sn, {
|
|
3550
|
+
chat: e,
|
|
3551
|
+
onSelectChat: t,
|
|
3552
|
+
onAvatarClick: (e, t) => r({
|
|
3553
|
+
user: e,
|
|
3554
|
+
isOnline: t
|
|
3555
|
+
})
|
|
3556
|
+
}, e.id)) : o.length === 0 ? /* @__PURE__ */ T("div", {
|
|
3557
|
+
className: "empty-chat-list",
|
|
3558
|
+
children: "Không có tin nhắn nào"
|
|
3559
|
+
}) : null]
|
|
3560
|
+
}), n && /* @__PURE__ */ T(on, {
|
|
3561
|
+
user: n.user,
|
|
3562
|
+
isOnline: n.isOnline,
|
|
3563
|
+
onClose: () => r(null),
|
|
3564
|
+
onMessage: () => {
|
|
3565
|
+
if (!n) return;
|
|
3566
|
+
let i = e.find((e) => e.type === "single" && e.members?.some((e) => e.id === n.user.id));
|
|
3567
|
+
i && t(i), r(null);
|
|
3568
|
+
}
|
|
3569
|
+
})]
|
|
3624
3570
|
});
|
|
3625
3571
|
}, cn = ({ value: e, onChange: t, onAddClick: n, placeholder: r, activeTab: i }) => {
|
|
3626
|
-
let { hasGroupChat: a } = _(
|
|
3572
|
+
let { hasGroupChat: a } = _(Ge), { t: o } = X(), s = o("chatSearchBar.searchPlaceholder");
|
|
3627
3573
|
return /* @__PURE__ */ E("div", {
|
|
3628
3574
|
className: "chat-search-bar",
|
|
3629
3575
|
children: [/* @__PURE__ */ E("div", {
|
|
3630
3576
|
className: "search-input-wrapper",
|
|
3631
3577
|
children: [
|
|
3632
|
-
/* @__PURE__ */ T(
|
|
3578
|
+
/* @__PURE__ */ T(vt, { className: "search-icon" }),
|
|
3633
3579
|
/* @__PURE__ */ T("input", {
|
|
3634
3580
|
type: "text",
|
|
3635
3581
|
className: "search-input",
|
|
@@ -3647,7 +3593,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3647
3593
|
className: "action-btn add-group-btn",
|
|
3648
3594
|
onClick: n,
|
|
3649
3595
|
title: o("chatSearchBar.createGroup"),
|
|
3650
|
-
children: /* @__PURE__ */ T(
|
|
3596
|
+
children: /* @__PURE__ */ T(lt, {})
|
|
3651
3597
|
})]
|
|
3652
3598
|
});
|
|
3653
3599
|
}, ln = ({ setIsThemeModalOpen: e, activeTab: t, setActiveTab: n }) => {
|
|
@@ -3660,21 +3606,21 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3660
3606
|
/* @__PURE__ */ T("div", {
|
|
3661
3607
|
className: `nav-item ${t === "chats" ? "active" : ""}`,
|
|
3662
3608
|
onClick: () => n("chats"),
|
|
3663
|
-
children: /* @__PURE__ */ T(
|
|
3609
|
+
children: /* @__PURE__ */ T(gt, {})
|
|
3664
3610
|
}),
|
|
3665
3611
|
/* @__PURE__ */ T("div", {
|
|
3666
3612
|
className: `nav-item ${t === "contacts" ? "active" : ""}`,
|
|
3667
3613
|
onClick: () => n("contacts"),
|
|
3668
|
-
children: /* @__PURE__ */ T(
|
|
3614
|
+
children: /* @__PURE__ */ T(lt, {})
|
|
3669
3615
|
}),
|
|
3670
3616
|
/* @__PURE__ */ T("div", { className: "nav-separator" }),
|
|
3671
3617
|
/* @__PURE__ */ T("div", {
|
|
3672
3618
|
className: "nav-item",
|
|
3673
|
-
children: /* @__PURE__ */ T(
|
|
3619
|
+
children: /* @__PURE__ */ T(_t, {})
|
|
3674
3620
|
}),
|
|
3675
3621
|
/* @__PURE__ */ T("div", {
|
|
3676
3622
|
className: "nav-item",
|
|
3677
|
-
children: /* @__PURE__ */ T(
|
|
3623
|
+
children: /* @__PURE__ */ T(vt, {})
|
|
3678
3624
|
})
|
|
3679
3625
|
]
|
|
3680
3626
|
}), /* @__PURE__ */ E("div", {
|
|
@@ -3682,21 +3628,15 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3682
3628
|
children: [/* @__PURE__ */ T("div", {
|
|
3683
3629
|
className: "nav-item",
|
|
3684
3630
|
onClick: () => e(!0),
|
|
3685
|
-
children: /* @__PURE__ */ T(
|
|
3631
|
+
children: /* @__PURE__ */ T(yt, {})
|
|
3686
3632
|
}), /* @__PURE__ */ T("div", {
|
|
3687
3633
|
className: "app-avatar",
|
|
3688
|
-
children: r
|
|
3689
|
-
src: r.avatar,
|
|
3690
|
-
alt: r.name
|
|
3691
|
-
}) : /* @__PURE__ */ T("div", {
|
|
3692
|
-
className: "app-avatar-fallback",
|
|
3693
|
-
children: r?.name?.[0].toUpperCase()
|
|
3694
|
-
})
|
|
3634
|
+
children: r && /* @__PURE__ */ T($, { member: r })
|
|
3695
3635
|
})]
|
|
3696
3636
|
})]
|
|
3697
3637
|
});
|
|
3698
3638
|
}, un = ({ onClose: e, onAddMember: t, onUpdateGroup: n, onRemoveMember: r }) => {
|
|
3699
|
-
let i = g(), { showToast: a, confirm: o } =
|
|
3639
|
+
let i = g(), { showToast: a, confirm: o } = Y(), { currentChatMembers: s, currentChat: c, currentUser: l } = _((e) => e.chat), { allowDeleteChat: u } = _(Ge), [d, f] = p("info"), [m, h] = p(null), [v, y] = p(!1), [b, x] = p(null), [S, C] = p({
|
|
3700
3640
|
canChangeInfo: !0,
|
|
3701
3641
|
canPinMessage: !0,
|
|
3702
3642
|
canCreateNote: !0,
|
|
@@ -3705,33 +3645,24 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3705
3645
|
approveNewMembers: !1,
|
|
3706
3646
|
markAdminMessages: !0,
|
|
3707
3647
|
allowNewMembersReadRecent: !0
|
|
3708
|
-
}),
|
|
3709
|
-
|
|
3648
|
+
}), D = (e) => {
|
|
3649
|
+
C((t) => ({
|
|
3710
3650
|
...t,
|
|
3711
3651
|
[e]: !t[e]
|
|
3712
3652
|
}));
|
|
3713
|
-
}
|
|
3714
|
-
|
|
3715
|
-
let e =
|
|
3716
|
-
v(null);
|
|
3717
|
-
};
|
|
3718
|
-
return h !== null && window.addEventListener("click", e), () => {
|
|
3719
|
-
window.removeEventListener("click", e);
|
|
3720
|
-
};
|
|
3721
|
-
}, [h]);
|
|
3722
|
-
let A = s.length ?? 0, j = O(l, u?.id, ""), M = s ?? [], ee = async () => {
|
|
3723
|
-
if (!x) return;
|
|
3724
|
-
let e = l;
|
|
3653
|
+
}, k = s.length ?? 0, A = O(c, l?.id, ""), j = s ?? [], M = async () => {
|
|
3654
|
+
if (!b) return;
|
|
3655
|
+
let e = c;
|
|
3725
3656
|
if (e) i(V(e));
|
|
3726
3657
|
else try {
|
|
3727
|
-
let e = await G.addChat(
|
|
3658
|
+
let e = await G.addChat(b.user.id);
|
|
3728
3659
|
e?.data && (i(we(e.data)), i(V(e.data)));
|
|
3729
3660
|
} catch (e) {
|
|
3730
3661
|
console.error("Lỗi khi tạo phòng chat mới:", e);
|
|
3731
3662
|
}
|
|
3732
|
-
|
|
3663
|
+
x(null);
|
|
3733
3664
|
};
|
|
3734
|
-
return
|
|
3665
|
+
return d === "group_management" ? /* @__PURE__ */ E("div", {
|
|
3735
3666
|
className: "side-bar-info-chat group-management-view",
|
|
3736
3667
|
children: [/* @__PURE__ */ E("div", {
|
|
3737
3668
|
className: "info-header",
|
|
@@ -3739,8 +3670,8 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3739
3670
|
className: "header-left",
|
|
3740
3671
|
children: [/* @__PURE__ */ T("button", {
|
|
3741
3672
|
className: "back-info-btn",
|
|
3742
|
-
onClick: () =>
|
|
3743
|
-
children: /* @__PURE__ */ T(
|
|
3673
|
+
onClick: () => f("info"),
|
|
3674
|
+
children: /* @__PURE__ */ T(ut, {})
|
|
3744
3675
|
}), /* @__PURE__ */ T("h3", {
|
|
3745
3676
|
className: "header-title",
|
|
3746
3677
|
children: "Quản lý nhóm"
|
|
@@ -3748,7 +3679,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3748
3679
|
}), /* @__PURE__ */ T("button", {
|
|
3749
3680
|
className: "close-info-btn",
|
|
3750
3681
|
onClick: e,
|
|
3751
|
-
children: /* @__PURE__ */ T(
|
|
3682
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
3752
3683
|
})]
|
|
3753
3684
|
}), /* @__PURE__ */ E("div", {
|
|
3754
3685
|
className: "info-content-scroll",
|
|
@@ -3763,46 +3694,46 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3763
3694
|
children: [
|
|
3764
3695
|
/* @__PURE__ */ E("div", {
|
|
3765
3696
|
className: "setting-item",
|
|
3766
|
-
onClick: () =>
|
|
3697
|
+
onClick: () => D("canChangeInfo"),
|
|
3767
3698
|
children: [/* @__PURE__ */ T("span", { children: "Thay đổi tên & ảnh đại diện của nhóm" }), /* @__PURE__ */ T("input", {
|
|
3768
3699
|
type: "checkbox",
|
|
3769
|
-
checked:
|
|
3700
|
+
checked: S.canChangeInfo,
|
|
3770
3701
|
readOnly: !0
|
|
3771
3702
|
})]
|
|
3772
3703
|
}),
|
|
3773
3704
|
/* @__PURE__ */ E("div", {
|
|
3774
3705
|
className: "setting-item",
|
|
3775
|
-
onClick: () =>
|
|
3706
|
+
onClick: () => D("canPinMessage"),
|
|
3776
3707
|
children: [/* @__PURE__ */ T("span", { children: "Ghim tin nhắn, ghi chú, bình chọn lên đầu hội thoại" }), /* @__PURE__ */ T("input", {
|
|
3777
3708
|
type: "checkbox",
|
|
3778
|
-
checked:
|
|
3709
|
+
checked: S.canPinMessage,
|
|
3779
3710
|
readOnly: !0
|
|
3780
3711
|
})]
|
|
3781
3712
|
}),
|
|
3782
3713
|
/* @__PURE__ */ E("div", {
|
|
3783
3714
|
className: "setting-item",
|
|
3784
|
-
onClick: () =>
|
|
3715
|
+
onClick: () => D("canCreateNote"),
|
|
3785
3716
|
children: [/* @__PURE__ */ T("span", { children: "Tạo mới ghi chú, nhắc hẹn" }), /* @__PURE__ */ T("input", {
|
|
3786
3717
|
type: "checkbox",
|
|
3787
|
-
checked:
|
|
3718
|
+
checked: S.canCreateNote,
|
|
3788
3719
|
readOnly: !0
|
|
3789
3720
|
})]
|
|
3790
3721
|
}),
|
|
3791
3722
|
/* @__PURE__ */ E("div", {
|
|
3792
3723
|
className: "setting-item",
|
|
3793
|
-
onClick: () =>
|
|
3724
|
+
onClick: () => D("canCreatePoll"),
|
|
3794
3725
|
children: [/* @__PURE__ */ T("span", { children: "Tạo mới bình chọn" }), /* @__PURE__ */ T("input", {
|
|
3795
3726
|
type: "checkbox",
|
|
3796
|
-
checked:
|
|
3727
|
+
checked: S.canCreatePoll,
|
|
3797
3728
|
readOnly: !0
|
|
3798
3729
|
})]
|
|
3799
3730
|
}),
|
|
3800
3731
|
/* @__PURE__ */ E("div", {
|
|
3801
3732
|
className: "setting-item",
|
|
3802
|
-
onClick: () =>
|
|
3733
|
+
onClick: () => D("canSendMessage"),
|
|
3803
3734
|
children: [/* @__PURE__ */ T("span", { children: "Gửi tin nhắn" }), /* @__PURE__ */ T("input", {
|
|
3804
3735
|
type: "checkbox",
|
|
3805
|
-
checked:
|
|
3736
|
+
checked: S.canSendMessage,
|
|
3806
3737
|
readOnly: !0
|
|
3807
3738
|
})]
|
|
3808
3739
|
})
|
|
@@ -3818,13 +3749,13 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3818
3749
|
className: "setting-item-switch",
|
|
3819
3750
|
children: [/* @__PURE__ */ E("div", {
|
|
3820
3751
|
className: "setting-info",
|
|
3821
|
-
children: [/* @__PURE__ */ T("span", { children: "Chế độ phê duyệt thành viên mới" }), /* @__PURE__ */ T(
|
|
3752
|
+
children: [/* @__PURE__ */ T("span", { children: "Chế độ phê duyệt thành viên mới" }), /* @__PURE__ */ T(bt, { className: "help-icon" })]
|
|
3822
3753
|
}), /* @__PURE__ */ E("label", {
|
|
3823
3754
|
className: "switch",
|
|
3824
3755
|
children: [/* @__PURE__ */ T("input", {
|
|
3825
3756
|
type: "checkbox",
|
|
3826
|
-
checked:
|
|
3827
|
-
onChange: () =>
|
|
3757
|
+
checked: S.approveNewMembers,
|
|
3758
|
+
onChange: () => D("approveNewMembers")
|
|
3828
3759
|
}), /* @__PURE__ */ T("span", { className: "slider round" })]
|
|
3829
3760
|
})]
|
|
3830
3761
|
}),
|
|
@@ -3832,13 +3763,13 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3832
3763
|
className: "setting-item-switch",
|
|
3833
3764
|
children: [/* @__PURE__ */ E("div", {
|
|
3834
3765
|
className: "setting-info",
|
|
3835
|
-
children: [/* @__PURE__ */ T("span", { children: "Đánh dấu tin nhắn từ trưởng/phó nhóm" }), /* @__PURE__ */ T(
|
|
3766
|
+
children: [/* @__PURE__ */ T("span", { children: "Đánh dấu tin nhắn từ trưởng/phó nhóm" }), /* @__PURE__ */ T(bt, { className: "help-icon" })]
|
|
3836
3767
|
}), /* @__PURE__ */ E("label", {
|
|
3837
3768
|
className: "switch",
|
|
3838
3769
|
children: [/* @__PURE__ */ T("input", {
|
|
3839
3770
|
type: "checkbox",
|
|
3840
|
-
checked:
|
|
3841
|
-
onChange: () =>
|
|
3771
|
+
checked: S.markAdminMessages,
|
|
3772
|
+
onChange: () => D("markAdminMessages")
|
|
3842
3773
|
}), /* @__PURE__ */ T("span", { className: "slider round" })]
|
|
3843
3774
|
})]
|
|
3844
3775
|
}),
|
|
@@ -3846,13 +3777,13 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3846
3777
|
className: "setting-item-switch",
|
|
3847
3778
|
children: [/* @__PURE__ */ E("div", {
|
|
3848
3779
|
className: "setting-info",
|
|
3849
|
-
children: [/* @__PURE__ */ T("span", { children: "Cho phép thành viên mới đọc tin nhắn gần nhất" }), /* @__PURE__ */ T(
|
|
3780
|
+
children: [/* @__PURE__ */ T("span", { children: "Cho phép thành viên mới đọc tin nhắn gần nhất" }), /* @__PURE__ */ T(bt, { className: "help-icon" })]
|
|
3850
3781
|
}), /* @__PURE__ */ E("label", {
|
|
3851
3782
|
className: "switch",
|
|
3852
3783
|
children: [/* @__PURE__ */ T("input", {
|
|
3853
3784
|
type: "checkbox",
|
|
3854
|
-
checked:
|
|
3855
|
-
onChange: () =>
|
|
3785
|
+
checked: S.allowNewMembersReadRecent,
|
|
3786
|
+
onChange: () => D("allowNewMembersReadRecent")
|
|
3856
3787
|
}), /* @__PURE__ */ T("span", { className: "slider round" })]
|
|
3857
3788
|
})]
|
|
3858
3789
|
})
|
|
@@ -3867,13 +3798,13 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3867
3798
|
className: "menu-item",
|
|
3868
3799
|
children: /* @__PURE__ */ E("div", {
|
|
3869
3800
|
className: "menu-left",
|
|
3870
|
-
children: [/* @__PURE__ */ T(
|
|
3801
|
+
children: [/* @__PURE__ */ T(xt, {}), /* @__PURE__ */ T("span", { children: "Chặn khỏi nhóm" })]
|
|
3871
3802
|
})
|
|
3872
3803
|
}), /* @__PURE__ */ T("div", {
|
|
3873
3804
|
className: "menu-item",
|
|
3874
3805
|
children: /* @__PURE__ */ E("div", {
|
|
3875
3806
|
className: "menu-left",
|
|
3876
|
-
children: [/* @__PURE__ */ T(
|
|
3807
|
+
children: [/* @__PURE__ */ T(St, {}), /* @__PURE__ */ T("span", { children: "Trưởng & phó nhóm" })]
|
|
3877
3808
|
})
|
|
3878
3809
|
})]
|
|
3879
3810
|
})
|
|
@@ -3888,39 +3819,36 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3888
3819
|
children: /* @__PURE__ */ T("button", {
|
|
3889
3820
|
className: "close-info-btn",
|
|
3890
3821
|
onClick: e,
|
|
3891
|
-
children: /* @__PURE__ */ T(
|
|
3822
|
+
children: /* @__PURE__ */ T(Q, {})
|
|
3892
3823
|
})
|
|
3893
3824
|
}),
|
|
3894
|
-
|
|
3825
|
+
c && /* @__PURE__ */ E("div", {
|
|
3895
3826
|
className: "info-content-scroll",
|
|
3896
3827
|
children: [
|
|
3897
3828
|
/* @__PURE__ */ E("div", {
|
|
3898
3829
|
className: "info-basic-section",
|
|
3899
3830
|
children: [/* @__PURE__ */ T("div", {
|
|
3900
3831
|
className: "info-avatar-large",
|
|
3901
|
-
children: /* @__PURE__ */ T(
|
|
3902
|
-
chat: l,
|
|
3903
|
-
currentUserId: u?.id
|
|
3904
|
-
})
|
|
3832
|
+
children: /* @__PURE__ */ T($, { member: c.type === "single" ? c.members?.find((e) => e.id !== l?.id) ?? c : c })
|
|
3905
3833
|
}), /* @__PURE__ */ E("div", {
|
|
3906
3834
|
className: "info-main-details",
|
|
3907
3835
|
children: [/* @__PURE__ */ E("h3", {
|
|
3908
3836
|
className: "info-chat-name",
|
|
3909
|
-
children: [
|
|
3837
|
+
children: [A, /* @__PURE__ */ T("span", {
|
|
3910
3838
|
className: "info-status-icons",
|
|
3911
|
-
children:
|
|
3912
|
-
e.stopPropagation(), n && n(
|
|
3839
|
+
children: c.type === "group" && /* @__PURE__ */ T(Ct, { onClick: (e) => {
|
|
3840
|
+
e.stopPropagation(), n && n(c);
|
|
3913
3841
|
} })
|
|
3914
3842
|
})]
|
|
3915
3843
|
}), /* @__PURE__ */ T("p", {
|
|
3916
3844
|
className: "info-member-count",
|
|
3917
|
-
children:
|
|
3845
|
+
children: c.type === "group" ? `Thành viên (${k})` : s.find((e) => e.id !== l?.id)?.socket_ids?.length ? "Đang hoạt động" : "Không hoạt động"
|
|
3918
3846
|
})]
|
|
3919
3847
|
})]
|
|
3920
3848
|
}),
|
|
3921
3849
|
/* @__PURE__ */ T("div", {
|
|
3922
3850
|
className: "info-quick-actions",
|
|
3923
|
-
children:
|
|
3851
|
+
children: c.type === "group" ? /* @__PURE__ */ T("div", {
|
|
3924
3852
|
className: "action-item",
|
|
3925
3853
|
onClick: t,
|
|
3926
3854
|
children: /* @__PURE__ */ E("div", {
|
|
@@ -3956,57 +3884,57 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
3956
3884
|
})
|
|
3957
3885
|
}) : /* @__PURE__ */ T(w, {})
|
|
3958
3886
|
}),
|
|
3959
|
-
|
|
3960
|
-
|
|
3887
|
+
c.type === "group" && null,
|
|
3888
|
+
c.type === "group" && /* @__PURE__ */ E("div", {
|
|
3961
3889
|
className: "info-members-section",
|
|
3962
3890
|
children: [/* @__PURE__ */ E("div", {
|
|
3963
3891
|
className: "section-title-row",
|
|
3964
3892
|
children: [/* @__PURE__ */ E("span", { children: [
|
|
3965
3893
|
"Thành viên (",
|
|
3966
|
-
|
|
3894
|
+
k,
|
|
3967
3895
|
")"
|
|
3968
3896
|
] }), /* @__PURE__ */ E("div", {
|
|
3969
3897
|
className: "title-actions",
|
|
3970
|
-
children: [/* @__PURE__ */ T(
|
|
3898
|
+
children: [/* @__PURE__ */ T(wt, {
|
|
3971
3899
|
size: 16,
|
|
3972
3900
|
onClick: t
|
|
3973
|
-
}), /* @__PURE__ */ T(
|
|
3974
|
-
className: `arrow-icon ${
|
|
3975
|
-
onClick: () =>
|
|
3901
|
+
}), /* @__PURE__ */ T(Tt, {
|
|
3902
|
+
className: `arrow-icon ${v ? "collapsed" : ""}`,
|
|
3903
|
+
onClick: () => y(!v)
|
|
3976
3904
|
})]
|
|
3977
3905
|
})]
|
|
3978
|
-
}),
|
|
3906
|
+
}), v ? /* @__PURE__ */ E("div", {
|
|
3979
3907
|
className: "members-facepile",
|
|
3980
|
-
children: [
|
|
3908
|
+
children: [j.slice(0, 8).map((e) => /* @__PURE__ */ E("div", {
|
|
3981
3909
|
className: "facepile-item",
|
|
3982
|
-
children: [/* @__PURE__ */ T(
|
|
3983
|
-
}, e.id)),
|
|
3910
|
+
children: [/* @__PURE__ */ T($, { member: e }), (e.id === l?.id || (e.socket_ids?.length ?? 0) > 0) && /* @__PURE__ */ T("div", { className: "online-status" })]
|
|
3911
|
+
}, e.id)), j.length > 8 && /* @__PURE__ */ E("div", {
|
|
3984
3912
|
className: "facepile-more",
|
|
3985
|
-
children: ["+",
|
|
3913
|
+
children: ["+", j.length - 8]
|
|
3986
3914
|
})]
|
|
3987
3915
|
}) : /* @__PURE__ */ T("div", {
|
|
3988
3916
|
className: "members-compact-list",
|
|
3989
|
-
children:
|
|
3990
|
-
let t =
|
|
3917
|
+
children: j.map((e) => {
|
|
3918
|
+
let t = c.owner_id === e.id, n = e.id === l?.id || e.socket_ids && e.socket_ids.length > 0;
|
|
3991
3919
|
return /* @__PURE__ */ E("div", {
|
|
3992
3920
|
className: "member-compact-item",
|
|
3993
3921
|
children: [/* @__PURE__ */ E("div", {
|
|
3994
3922
|
className: "member-item-left clickable",
|
|
3995
|
-
onClick: () =>
|
|
3923
|
+
onClick: () => x({
|
|
3996
3924
|
user: e,
|
|
3997
3925
|
isOnline: n ?? !1
|
|
3998
3926
|
}),
|
|
3999
3927
|
children: [/* @__PURE__ */ E("div", {
|
|
4000
3928
|
className: "member-avatar-small",
|
|
4001
|
-
children: [/* @__PURE__ */ T(
|
|
3929
|
+
children: [/* @__PURE__ */ T($, { member: e }), n && /* @__PURE__ */ T("div", { className: "online-status" })]
|
|
4002
3930
|
}), /* @__PURE__ */ E("div", {
|
|
4003
3931
|
className: "member-info",
|
|
4004
3932
|
children: [/* @__PURE__ */ E("div", {
|
|
4005
3933
|
className: "member-name-row",
|
|
4006
3934
|
children: [/* @__PURE__ */ T("span", {
|
|
4007
3935
|
className: "member-name",
|
|
4008
|
-
children: e.id ===
|
|
4009
|
-
}), t && /* @__PURE__ */ T(
|
|
3936
|
+
children: e.id === l?.id ? "Bạn" : e.name
|
|
3937
|
+
}), t && /* @__PURE__ */ T(ot, {})]
|
|
4010
3938
|
}), /* @__PURE__ */ T("span", {
|
|
4011
3939
|
className: "member-role",
|
|
4012
3940
|
children: t ? "Trưởng nhóm" : "Thành viên"
|
|
@@ -4016,20 +3944,23 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4016
3944
|
className: "member-item-right",
|
|
4017
3945
|
children: /* @__PURE__ */ E("div", {
|
|
4018
3946
|
className: "member-options-container",
|
|
3947
|
+
onBlur: (e) => {
|
|
3948
|
+
e.currentTarget.contains(e.relatedTarget) || h(null);
|
|
3949
|
+
},
|
|
4019
3950
|
children: [/* @__PURE__ */ T("button", {
|
|
4020
3951
|
className: "member-options-btn",
|
|
4021
3952
|
onClick: (t) => {
|
|
4022
|
-
t.stopPropagation(),
|
|
3953
|
+
t.stopPropagation(), h(m === e.id ? null : e.id);
|
|
4023
3954
|
},
|
|
4024
|
-
children: /* @__PURE__ */ T(
|
|
4025
|
-
}),
|
|
3955
|
+
children: /* @__PURE__ */ T(Et, {})
|
|
3956
|
+
}), m === e.id && /* @__PURE__ */ T("div", {
|
|
4026
3957
|
className: "member-dropdown-menu",
|
|
4027
3958
|
children: !t && /* @__PURE__ */ E("button", {
|
|
4028
3959
|
className: "dropdown-item delete",
|
|
4029
3960
|
onClick: (t) => {
|
|
4030
|
-
t.stopPropagation(), r && r(
|
|
3961
|
+
t.stopPropagation(), r && r(c.id, e.id), h(null);
|
|
4031
3962
|
},
|
|
4032
|
-
children: [/* @__PURE__ */ T(
|
|
3963
|
+
children: [/* @__PURE__ */ T(xt, { size: 16 }), /* @__PURE__ */ T("span", { children: "Xoá khỏi nhóm" })]
|
|
4033
3964
|
})
|
|
4034
3965
|
})]
|
|
4035
3966
|
})
|
|
@@ -4038,23 +3969,23 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4038
3969
|
})
|
|
4039
3970
|
})]
|
|
4040
3971
|
}),
|
|
4041
|
-
|
|
3972
|
+
u && /* @__PURE__ */ E("button", {
|
|
4042
3973
|
className: "info-panel-clear-history",
|
|
4043
3974
|
onClick: void 0,
|
|
4044
|
-
children: [/* @__PURE__ */ T(
|
|
3975
|
+
children: [/* @__PURE__ */ T(Bt, { size: 16 }), /* @__PURE__ */ T("span", { children: "Xoá lịch sử trò chuyện" })]
|
|
4045
3976
|
})
|
|
4046
3977
|
]
|
|
4047
3978
|
}),
|
|
4048
|
-
|
|
4049
|
-
user:
|
|
4050
|
-
isOnline:
|
|
4051
|
-
onClose: () =>
|
|
4052
|
-
onMessage: () => void
|
|
3979
|
+
b && /* @__PURE__ */ T(on, {
|
|
3980
|
+
user: b.user,
|
|
3981
|
+
isOnline: b.isOnline,
|
|
3982
|
+
onClose: () => x(null),
|
|
3983
|
+
onMessage: () => void M()
|
|
4053
3984
|
})
|
|
4054
3985
|
]
|
|
4055
3986
|
});
|
|
4056
3987
|
}, dn = ({ mode: e, title: t, logoUrl: n, onToggleMode: r, onClose: i }) => {
|
|
4057
|
-
let { t: a, toggleChangeLanguage: o } =
|
|
3988
|
+
let { t: a, toggleChangeLanguage: o } = X(), { hasMultipleLanguages: s } = _(Ge), c = t ?? a("chatHeader.defaultTitle");
|
|
4058
3989
|
return /* @__PURE__ */ E("div", {
|
|
4059
3990
|
className: `chat-header ${e}`,
|
|
4060
3991
|
children: [/* @__PURE__ */ E("div", {
|
|
@@ -4064,7 +3995,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4064
3995
|
children: n ? /* @__PURE__ */ T("img", {
|
|
4065
3996
|
src: n,
|
|
4066
3997
|
alt: "Logo"
|
|
4067
|
-
}) : /* @__PURE__ */ T(
|
|
3998
|
+
}) : /* @__PURE__ */ T(st, { size: 22 })
|
|
4068
3999
|
}), /* @__PURE__ */ E("div", {
|
|
4069
4000
|
className: "header-info-text",
|
|
4070
4001
|
children: [
|
|
@@ -4089,64 +4020,64 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4089
4020
|
className: "action-btn",
|
|
4090
4021
|
onClick: o,
|
|
4091
4022
|
title: a("chatHeader.language"),
|
|
4092
|
-
children: /* @__PURE__ */ T(
|
|
4023
|
+
children: /* @__PURE__ */ T(Ut, { size: 16 })
|
|
4093
4024
|
}),
|
|
4094
4025
|
/* @__PURE__ */ T("button", {
|
|
4095
4026
|
className: "action-btn",
|
|
4096
4027
|
onClick: i,
|
|
4097
4028
|
title: a("chatHeader.minimize"),
|
|
4098
|
-
children: /* @__PURE__ */ T(
|
|
4029
|
+
children: /* @__PURE__ */ T(Dt, { size: 16 })
|
|
4099
4030
|
}),
|
|
4100
4031
|
/* @__PURE__ */ T("button", {
|
|
4101
4032
|
className: "action-btn",
|
|
4102
4033
|
onClick: r,
|
|
4103
4034
|
title: a(e === "fullpage" ? "chatHeader.minimize" : "chatHeader.maximize"),
|
|
4104
|
-
children: T(e === "fullpage" ?
|
|
4035
|
+
children: T(e === "fullpage" ? kt : Ot, {})
|
|
4105
4036
|
}),
|
|
4106
4037
|
/* @__PURE__ */ T("button", {
|
|
4107
4038
|
className: "action-btn close-btn",
|
|
4108
4039
|
onClick: i,
|
|
4109
4040
|
title: a("chatHeader.close"),
|
|
4110
|
-
children: /* @__PURE__ */ T(
|
|
4041
|
+
children: /* @__PURE__ */ T(Q, { size: 14 })
|
|
4111
4042
|
})
|
|
4112
4043
|
]
|
|
4113
4044
|
})]
|
|
4114
4045
|
});
|
|
4115
4046
|
}, fn = r((e, t) => {
|
|
4116
|
-
let { t: n } =
|
|
4047
|
+
let { t: n } = X(), r = g(), { currentChat: i, replyingMessage: o } = _((e) => e.chat), { hasVoice: s, hasAttachment: u, hasMultipleAttachments: d, acceptFilter: m, isFileTypeAllowed: h } = _(Ge), [v, y] = p(""), [b, x] = p(!1), [S, C] = p(!1), [D, O] = p([]), [k, A] = p(!1), [j, M] = $e(), [ee, N] = p(!1), { showToast: P } = Y(), F = f(null), ne = f(null), I = f(null), L = f(/* @__PURE__ */ new Map()), ie = (e) => {
|
|
4117
4048
|
y((t) => t + e), x(!1);
|
|
4118
|
-
},
|
|
4049
|
+
}, se = async () => {
|
|
4119
4050
|
await M.startRecording();
|
|
4120
4051
|
}, de = async () => {
|
|
4121
|
-
|
|
4052
|
+
N(!0);
|
|
4122
4053
|
try {
|
|
4123
4054
|
await M.stopRecording();
|
|
4124
4055
|
} finally {
|
|
4125
|
-
|
|
4056
|
+
N(!1);
|
|
4126
4057
|
}
|
|
4127
4058
|
}, fe = () => {
|
|
4128
4059
|
j.recordedFile && (O((e) => [...e, j.recordedFile]), M.clearRecording());
|
|
4129
4060
|
}, pe = (e) => {
|
|
4130
4061
|
let t = `${e.name}-${e.size}`;
|
|
4131
|
-
|
|
4062
|
+
L.current.has(t) && clearTimeout(L.current.get(t));
|
|
4132
4063
|
let n = setTimeout(() => {
|
|
4133
|
-
O((e) => e.filter((e) => e.errorId !== t)),
|
|
4064
|
+
O((e) => e.filter((e) => e.errorId !== t)), L.current.delete(t);
|
|
4134
4065
|
}, 5e3);
|
|
4135
|
-
return
|
|
4066
|
+
return L.current.set(t, n), t;
|
|
4136
4067
|
}, me = (e) => {
|
|
4137
4068
|
if (!e?.length) return;
|
|
4138
4069
|
if (!u) {
|
|
4139
|
-
|
|
4070
|
+
P("Tính năng đính kèm file chưa được kích hoạt.", "warning");
|
|
4140
4071
|
return;
|
|
4141
4072
|
}
|
|
4142
4073
|
let t = Array.from(e).filter(h);
|
|
4143
4074
|
if (t.length === 0) {
|
|
4144
|
-
|
|
4075
|
+
P("Loại file không được phép.", "error");
|
|
4145
4076
|
return;
|
|
4146
4077
|
}
|
|
4147
|
-
let n =
|
|
4078
|
+
let n = B([...D, ...t], d, h);
|
|
4148
4079
|
if (n) {
|
|
4149
|
-
|
|
4080
|
+
P(n.message, n.type);
|
|
4150
4081
|
return;
|
|
4151
4082
|
}
|
|
4152
4083
|
let r = t.map((e) => {
|
|
@@ -4176,17 +4107,17 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4176
4107
|
e.currentTarget.value = "", C(!1);
|
|
4177
4108
|
};
|
|
4178
4109
|
if (!u) {
|
|
4179
|
-
|
|
4110
|
+
P("Tính năng đính kèm file chưa được kích hoạt.", "warning"), n();
|
|
4180
4111
|
return;
|
|
4181
4112
|
}
|
|
4182
4113
|
let r = Array.from(t).filter(h);
|
|
4183
4114
|
if (r.length === 0) {
|
|
4184
|
-
|
|
4115
|
+
P("Loại file được chọn không được phép.", "error"), n();
|
|
4185
4116
|
return;
|
|
4186
4117
|
}
|
|
4187
|
-
let i =
|
|
4118
|
+
let i = B([...D, ...r], d, h);
|
|
4188
4119
|
if (i) {
|
|
4189
|
-
|
|
4120
|
+
P(i.message, i.type), n();
|
|
4190
4121
|
return;
|
|
4191
4122
|
}
|
|
4192
4123
|
let a = r.map((e) => {
|
|
@@ -4201,24 +4132,24 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4201
4132
|
}, ge = a((e) => {
|
|
4202
4133
|
O((t) => t.filter((t, n) => n !== e));
|
|
4203
4134
|
}, []), _e = a(() => {
|
|
4204
|
-
|
|
4135
|
+
F.current?.click();
|
|
4205
4136
|
}, []);
|
|
4206
4137
|
c(() => {
|
|
4207
4138
|
if (!S) return;
|
|
4208
4139
|
let e = (e) => {
|
|
4209
|
-
|
|
4140
|
+
ne.current && !ne.current.contains(e.target) && C(!1);
|
|
4210
4141
|
};
|
|
4211
4142
|
return document.addEventListener("click", e), () => {
|
|
4212
4143
|
document.removeEventListener("click", e);
|
|
4213
4144
|
};
|
|
4214
4145
|
}, [S]), c(() => {
|
|
4215
|
-
k ||
|
|
4146
|
+
k || I.current?.focus();
|
|
4216
4147
|
}, [k]);
|
|
4217
|
-
let
|
|
4148
|
+
let H = async (e, t) => {
|
|
4218
4149
|
if (i && !(!e && (!t || t.length === 0))) {
|
|
4219
4150
|
A(!0);
|
|
4220
4151
|
try {
|
|
4221
|
-
let n =
|
|
4152
|
+
let n = z(t ?? []), a = await Promise.all(n.map(async (e) => await ue(e))), { data: s } = await G.addMessage(i.id, e, a, o?.id);
|
|
4222
4153
|
r(Se({
|
|
4223
4154
|
chat: i,
|
|
4224
4155
|
message: s
|
|
@@ -4229,19 +4160,19 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4229
4160
|
A(!1);
|
|
4230
4161
|
}
|
|
4231
4162
|
}
|
|
4232
|
-
},
|
|
4163
|
+
}, ve = () => {
|
|
4233
4164
|
let e = v.trim();
|
|
4234
4165
|
if (!e && D.length === 0) return;
|
|
4235
|
-
let t =
|
|
4166
|
+
let t = B(D, d, h);
|
|
4236
4167
|
if (t) {
|
|
4237
|
-
|
|
4168
|
+
P(t.message, t.type);
|
|
4238
4169
|
return;
|
|
4239
4170
|
}
|
|
4240
|
-
|
|
4171
|
+
H(e, D);
|
|
4241
4172
|
}, ye = (e) => {
|
|
4242
|
-
e.key === "Enter" &&
|
|
4173
|
+
e.key === "Enter" && ve();
|
|
4243
4174
|
}, be = (e) => {
|
|
4244
|
-
let t =
|
|
4175
|
+
let t = I.current?.getRootNode(), n = t?.getElementById ? t.getElementById(`chat-message-${e}`) : document.getElementById(`chat-message-${e}`);
|
|
4245
4176
|
n ? (n.scrollIntoView({
|
|
4246
4177
|
behavior: "smooth",
|
|
4247
4178
|
block: "center"
|
|
@@ -4253,18 +4184,18 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4253
4184
|
D.length > 0 && /* @__PURE__ */ T("div", {
|
|
4254
4185
|
className: "selected-files-list",
|
|
4255
4186
|
children: D.map((e, t) => {
|
|
4256
|
-
let r = e.isError, i =
|
|
4187
|
+
let r = e.isError, i = le(e);
|
|
4257
4188
|
return /* @__PURE__ */ E("div", {
|
|
4258
4189
|
className: `selected-file-item ${i ? "image-file" : "other-file"} ${r ? "error-file-item" : ""}`,
|
|
4259
4190
|
children: [i ? /* @__PURE__ */ T("img", {
|
|
4260
|
-
src:
|
|
4191
|
+
src: ce(e),
|
|
4261
4192
|
alt: e.name,
|
|
4262
4193
|
className: "file-preview-image"
|
|
4263
4194
|
}) : /* @__PURE__ */ E("div", {
|
|
4264
4195
|
className: "file-content-wrapper",
|
|
4265
4196
|
children: [/* @__PURE__ */ T("span", {
|
|
4266
4197
|
className: "file-icon",
|
|
4267
|
-
children:
|
|
4198
|
+
children: R(e.name)
|
|
4268
4199
|
}), /* @__PURE__ */ E("div", {
|
|
4269
4200
|
className: "file-info",
|
|
4270
4201
|
children: [/* @__PURE__ */ T("span", {
|
|
@@ -4312,7 +4243,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4312
4243
|
}),
|
|
4313
4244
|
/* @__PURE__ */ T("div", {
|
|
4314
4245
|
className: "reply-icon",
|
|
4315
|
-
children: /* @__PURE__ */ T(
|
|
4246
|
+
children: /* @__PURE__ */ T(At, {})
|
|
4316
4247
|
})
|
|
4317
4248
|
]
|
|
4318
4249
|
}),
|
|
@@ -4328,7 +4259,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4328
4259
|
})]
|
|
4329
4260
|
}), /* @__PURE__ */ T("span", {
|
|
4330
4261
|
className: "recording-duration",
|
|
4331
|
-
children:
|
|
4262
|
+
children: te(j.duration)
|
|
4332
4263
|
})]
|
|
4333
4264
|
}), /* @__PURE__ */ E("div", {
|
|
4334
4265
|
className: "voice-recording-controls",
|
|
@@ -4363,7 +4294,7 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4363
4294
|
}),
|
|
4364
4295
|
/* @__PURE__ */ T("span", {
|
|
4365
4296
|
className: "voice-duration",
|
|
4366
|
-
children:
|
|
4297
|
+
children: te(j.duration)
|
|
4367
4298
|
})
|
|
4368
4299
|
]
|
|
4369
4300
|
}), /* @__PURE__ */ E("div", {
|
|
@@ -4395,14 +4326,14 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4395
4326
|
children: [
|
|
4396
4327
|
b && /* @__PURE__ */ T("div", {
|
|
4397
4328
|
className: "emoji-picker",
|
|
4398
|
-
children:
|
|
4329
|
+
children: re.map((e) => /* @__PURE__ */ T("button", {
|
|
4399
4330
|
className: "emoji-btn",
|
|
4400
|
-
onClick: () =>
|
|
4331
|
+
onClick: () => ie(e),
|
|
4401
4332
|
children: e
|
|
4402
4333
|
}, e))
|
|
4403
4334
|
}),
|
|
4404
4335
|
/* @__PURE__ */ T("input", {
|
|
4405
|
-
ref:
|
|
4336
|
+
ref: F,
|
|
4406
4337
|
type: "file",
|
|
4407
4338
|
multiple: !0,
|
|
4408
4339
|
onChange: V,
|
|
@@ -4417,35 +4348,35 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4417
4348
|
onClick: () => _e(),
|
|
4418
4349
|
title: n("chatInput.selectFiles"),
|
|
4419
4350
|
disabled: k,
|
|
4420
|
-
children: /* @__PURE__ */ T(
|
|
4351
|
+
children: /* @__PURE__ */ T(jt, {})
|
|
4421
4352
|
}),
|
|
4422
4353
|
u && /* @__PURE__ */ T("button", {
|
|
4423
4354
|
className: "action-btn",
|
|
4424
4355
|
onClick: () => _e(),
|
|
4425
4356
|
title: n("chatInput.selectFiles"),
|
|
4426
4357
|
disabled: k,
|
|
4427
|
-
children: /* @__PURE__ */ T(
|
|
4358
|
+
children: /* @__PURE__ */ T(Mt, {})
|
|
4428
4359
|
}),
|
|
4429
4360
|
s && /* @__PURE__ */ T("button", {
|
|
4430
4361
|
className: "action-btn",
|
|
4431
|
-
onClick: () => void
|
|
4362
|
+
onClick: () => void se(),
|
|
4432
4363
|
title: n("chatInput.recordVoice"),
|
|
4433
4364
|
disabled: k,
|
|
4434
|
-
children: /* @__PURE__ */ T(
|
|
4365
|
+
children: /* @__PURE__ */ T(Nt, {})
|
|
4435
4366
|
}),
|
|
4436
4367
|
/* @__PURE__ */ T("button", {
|
|
4437
4368
|
className: `action-btn ${b ? "active" : ""}`,
|
|
4438
4369
|
onClick: () => x(!b),
|
|
4439
4370
|
title: "emoji",
|
|
4440
4371
|
disabled: k,
|
|
4441
|
-
children: /* @__PURE__ */ T(
|
|
4372
|
+
children: /* @__PURE__ */ T(Pt, {})
|
|
4442
4373
|
})
|
|
4443
4374
|
]
|
|
4444
4375
|
}),
|
|
4445
4376
|
/* @__PURE__ */ T("div", {
|
|
4446
4377
|
className: "chat-input-container",
|
|
4447
4378
|
children: /* @__PURE__ */ T("input", {
|
|
4448
|
-
ref:
|
|
4379
|
+
ref: I,
|
|
4449
4380
|
type: "text",
|
|
4450
4381
|
className: "chat-input",
|
|
4451
4382
|
placeholder: n("chatInput.placeholder"),
|
|
@@ -4458,9 +4389,9 @@ var Ct = Q("AddMember", /* @__PURE__ */ E(w, { children: [
|
|
|
4458
4389
|
}),
|
|
4459
4390
|
/* @__PURE__ */ T("button", {
|
|
4460
4391
|
className: "send-btn",
|
|
4461
|
-
onClick:
|
|
4392
|
+
onClick: ve,
|
|
4462
4393
|
disabled: k || !v.trim() && D.length === 0,
|
|
4463
|
-
children: k ? "⏳" : /* @__PURE__ */ T(
|
|
4394
|
+
children: k ? "⏳" : /* @__PURE__ */ T(Ft, {})
|
|
4464
4395
|
})
|
|
4465
4396
|
]
|
|
4466
4397
|
})
|
|
@@ -4472,11 +4403,11 @@ fn.displayName = "ChatInput";
|
|
|
4472
4403
|
var pn = [{
|
|
4473
4404
|
label: "A-Z",
|
|
4474
4405
|
value: "asc",
|
|
4475
|
-
icon: /* @__PURE__ */ T(
|
|
4406
|
+
icon: /* @__PURE__ */ T(It, {})
|
|
4476
4407
|
}, {
|
|
4477
4408
|
label: "Z-A",
|
|
4478
4409
|
value: "desc",
|
|
4479
|
-
icon: /* @__PURE__ */ T(
|
|
4410
|
+
icon: /* @__PURE__ */ T(Lt, {})
|
|
4480
4411
|
}], mn = [
|
|
4481
4412
|
{
|
|
4482
4413
|
label: "Tất cả",
|
|
@@ -4491,7 +4422,7 @@ var pn = [{
|
|
|
4491
4422
|
value: "offline"
|
|
4492
4423
|
}
|
|
4493
4424
|
], hn = ({ onMessageClick: e }) => {
|
|
4494
|
-
let [t, n] = p(""), [r, i] = p("asc"), [a, o] = p(!1), [s, c] = p("all"), [l, u] = p(!1), { members: f } = _((e) => e.chat), m = d(() => {
|
|
4425
|
+
let [t, n] = p(""), [r, i] = p("asc"), [a, o] = p(!1), [s, c] = p("all"), [l, u] = p(!1), { members: f } = _((e) => e.chat), [m, h] = p(null), g = d(() => {
|
|
4495
4426
|
let e = f.filter((e) => e.name.toLowerCase().includes(t.toLowerCase()));
|
|
4496
4427
|
return s === "online" ? e = e.filter((e) => (e.socket_ids?.length ?? 0) > 0) : s === "offline" && (e = e.filter((e) => (e.socket_ids?.length ?? 0) === 0)), [...e].sort((e, t) => {
|
|
4497
4428
|
let n = e.name.localeCompare(t.name);
|
|
@@ -4502,26 +4433,26 @@ var pn = [{
|
|
|
4502
4433
|
t,
|
|
4503
4434
|
r,
|
|
4504
4435
|
s
|
|
4505
|
-
]),
|
|
4436
|
+
]), v = d(() => {
|
|
4506
4437
|
let e = /* @__PURE__ */ new Set();
|
|
4507
|
-
|
|
4438
|
+
g.forEach((t) => {
|
|
4508
4439
|
t.name && e.add(t.name.charAt(0).toUpperCase());
|
|
4509
4440
|
});
|
|
4510
4441
|
let t = Array.from(e);
|
|
4511
4442
|
return r === "asc" ? t.sort((e, t) => e.localeCompare(t)) : t.sort((e, t) => t.localeCompare(e));
|
|
4512
|
-
}, [
|
|
4443
|
+
}, [g, r]);
|
|
4513
4444
|
return /* @__PURE__ */ E("div", {
|
|
4514
4445
|
className: "contact-list-view",
|
|
4515
4446
|
children: [
|
|
4516
4447
|
/* @__PURE__ */ T("div", {
|
|
4517
4448
|
className: "contact-list-header",
|
|
4518
|
-
children: /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T(
|
|
4449
|
+
children: /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T(lt, {}), /* @__PURE__ */ T("div", { children: "Danh sách thành viên" })] })
|
|
4519
4450
|
}),
|
|
4520
4451
|
/* @__PURE__ */ E("div", {
|
|
4521
4452
|
className: "contact-list-toolbar",
|
|
4522
4453
|
children: [/* @__PURE__ */ E("div", {
|
|
4523
4454
|
className: "toolbar-search",
|
|
4524
|
-
children: [/* @__PURE__ */ T(
|
|
4455
|
+
children: [/* @__PURE__ */ T(vt, { strokeColor: "#94a3b8" }), /* @__PURE__ */ T("input", {
|
|
4525
4456
|
type: "text",
|
|
4526
4457
|
placeholder: "Tìm bạn",
|
|
4527
4458
|
value: t,
|
|
@@ -4536,7 +4467,7 @@ var pn = [{
|
|
|
4536
4467
|
},
|
|
4537
4468
|
children: [
|
|
4538
4469
|
/* @__PURE__ */ T("span", { children: r === "asc" ? "Tên (A-Z)" : "Tên (Z-A)" }),
|
|
4539
|
-
/* @__PURE__ */ T(
|
|
4470
|
+
/* @__PURE__ */ T(Tt, {}),
|
|
4540
4471
|
a && /* @__PURE__ */ T("div", {
|
|
4541
4472
|
className: "dropdown-select",
|
|
4542
4473
|
children: pn.map((e) => /* @__PURE__ */ E("div", {
|
|
@@ -4555,7 +4486,7 @@ var pn = [{
|
|
|
4555
4486
|
},
|
|
4556
4487
|
children: [
|
|
4557
4488
|
/* @__PURE__ */ T("span", { children: mn.find((e) => e.value === s)?.label }),
|
|
4558
|
-
/* @__PURE__ */ T(
|
|
4489
|
+
/* @__PURE__ */ T(Tt, {}),
|
|
4559
4490
|
l && /* @__PURE__ */ T("div", {
|
|
4560
4491
|
className: "dropdown-select",
|
|
4561
4492
|
children: mn.map((e) => /* @__PURE__ */ T("div", {
|
|
@@ -4572,8 +4503,8 @@ var pn = [{
|
|
|
4572
4503
|
}),
|
|
4573
4504
|
/* @__PURE__ */ T("div", {
|
|
4574
4505
|
className: "contact-scroll-area",
|
|
4575
|
-
children:
|
|
4576
|
-
let n =
|
|
4506
|
+
children: v.map((t) => {
|
|
4507
|
+
let n = g.filter((e) => e.name.charAt(0).toUpperCase() === t);
|
|
4577
4508
|
return /* @__PURE__ */ E("div", {
|
|
4578
4509
|
className: "contact-letter-group",
|
|
4579
4510
|
children: [/* @__PURE__ */ T("div", {
|
|
@@ -4606,21 +4537,28 @@ var pn = [{
|
|
|
4606
4537
|
className: "contact-item-actions",
|
|
4607
4538
|
children: [/* @__PURE__ */ T("button", {
|
|
4608
4539
|
className: "contact-action-btn",
|
|
4609
|
-
|
|
4540
|
+
onClick: () => h(t),
|
|
4541
|
+
children: /* @__PURE__ */ T(ct, { size: 16 })
|
|
4610
4542
|
}), /* @__PURE__ */ T("button", {
|
|
4611
4543
|
className: "contact-action-btn",
|
|
4612
4544
|
onClick: () => e(String(t.id)),
|
|
4613
|
-
children: /* @__PURE__ */ T(
|
|
4545
|
+
children: /* @__PURE__ */ T(ht, { size: 16 })
|
|
4614
4546
|
})]
|
|
4615
4547
|
})]
|
|
4616
4548
|
}, t.id))]
|
|
4617
4549
|
}, t);
|
|
4618
4550
|
})
|
|
4551
|
+
}),
|
|
4552
|
+
m && /* @__PURE__ */ T(on, {
|
|
4553
|
+
user: m,
|
|
4554
|
+
isOnline: (m.socket_ids?.length ?? 0) > 0,
|
|
4555
|
+
onClose: () => h(null),
|
|
4556
|
+
onMessage: () => void e(String(m.id))
|
|
4619
4557
|
})
|
|
4620
4558
|
]
|
|
4621
4559
|
});
|
|
4622
|
-
}, gn = ({ groups: e, onGroupClick: t
|
|
4623
|
-
let [
|
|
4560
|
+
}, gn = ({ groups: e, onGroupClick: t }) => {
|
|
4561
|
+
let [n, r] = p(""), i = d(() => e.filter((e) => e.name?.toLowerCase().includes(n.toLowerCase())), [e, n]);
|
|
4624
4562
|
return /* @__PURE__ */ E("div", {
|
|
4625
4563
|
className: "contact-list-view",
|
|
4626
4564
|
children: [
|
|
@@ -4632,7 +4570,7 @@ var pn = [{
|
|
|
4632
4570
|
alignItems: "center",
|
|
4633
4571
|
gap: "8px"
|
|
4634
4572
|
},
|
|
4635
|
-
children: [/* @__PURE__ */ T(
|
|
4573
|
+
children: [/* @__PURE__ */ T(lt, {}), /* @__PURE__ */ T("div", { children: "Danh sách nhóm và cộng đồng" })]
|
|
4636
4574
|
})
|
|
4637
4575
|
}),
|
|
4638
4576
|
/* @__PURE__ */ T("div", {
|
|
@@ -4641,11 +4579,11 @@ var pn = [{
|
|
|
4641
4579
|
children: /* @__PURE__ */ E("div", {
|
|
4642
4580
|
className: "toolbar-search",
|
|
4643
4581
|
style: { flex: 1 },
|
|
4644
|
-
children: [/* @__PURE__ */ T(
|
|
4582
|
+
children: [/* @__PURE__ */ T(vt, { strokeColor: "#94a3b8" }), /* @__PURE__ */ T("input", {
|
|
4645
4583
|
type: "text",
|
|
4646
4584
|
placeholder: "Tìm nhóm",
|
|
4647
|
-
value:
|
|
4648
|
-
onChange: (e) =>
|
|
4585
|
+
value: n,
|
|
4586
|
+
onChange: (e) => r(e.target.value)
|
|
4649
4587
|
})]
|
|
4650
4588
|
})
|
|
4651
4589
|
}),
|
|
@@ -4654,7 +4592,7 @@ var pn = [{
|
|
|
4654
4592
|
children: /* @__PURE__ */ T("div", {
|
|
4655
4593
|
className: "contact-letter-group",
|
|
4656
4594
|
style: { marginTop: "0" },
|
|
4657
|
-
children:
|
|
4595
|
+
children: i.map((e) => /* @__PURE__ */ T("div", {
|
|
4658
4596
|
className: "contact-item-row",
|
|
4659
4597
|
style: { cursor: "pointer" },
|
|
4660
4598
|
onClick: () => t(e),
|
|
@@ -4662,10 +4600,7 @@ var pn = [{
|
|
|
4662
4600
|
className: "contact-item-left",
|
|
4663
4601
|
children: [/* @__PURE__ */ T("div", {
|
|
4664
4602
|
className: "contact-avatar",
|
|
4665
|
-
children: /* @__PURE__ */ T(
|
|
4666
|
-
chat: e,
|
|
4667
|
-
currentUserId: n
|
|
4668
|
-
})
|
|
4603
|
+
children: /* @__PURE__ */ T($, { member: e })
|
|
4669
4604
|
}), /* @__PURE__ */ E("div", {
|
|
4670
4605
|
className: "contact-info",
|
|
4671
4606
|
children: [/* @__PURE__ */ T("div", {
|
|
@@ -4704,7 +4639,7 @@ var pn = [{
|
|
|
4704
4639
|
});
|
|
4705
4640
|
}, vn = ({ file: e }) => /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("span", {
|
|
4706
4641
|
className: "file-icon",
|
|
4707
|
-
children:
|
|
4642
|
+
children: R(e.ext)
|
|
4708
4643
|
}), /* @__PURE__ */ E("div", {
|
|
4709
4644
|
className: "file-info",
|
|
4710
4645
|
children: [/* @__PURE__ */ T("div", {
|
|
@@ -4715,10 +4650,10 @@ var pn = [{
|
|
|
4715
4650
|
children: oe(e.size)
|
|
4716
4651
|
})]
|
|
4717
4652
|
})] }), yn = ({ files: e }) => {
|
|
4718
|
-
let { openViewer: t } =
|
|
4653
|
+
let { openViewer: t } = Ze();
|
|
4719
4654
|
if (!e || e.length === 0) return null;
|
|
4720
4655
|
let n = e.filter((e) => {
|
|
4721
|
-
let t =
|
|
4656
|
+
let t = se(e.name);
|
|
4722
4657
|
return [
|
|
4723
4658
|
"image",
|
|
4724
4659
|
"video",
|
|
@@ -4729,7 +4664,7 @@ var pn = [{
|
|
|
4729
4664
|
let r = e.findIndex((e) => e.id === n);
|
|
4730
4665
|
r !== -1 && t(e, r);
|
|
4731
4666
|
}, s = (e) => {
|
|
4732
|
-
switch (
|
|
4667
|
+
switch (se(e.name)) {
|
|
4733
4668
|
case "image": return r.includes(e) ? /* @__PURE__ */ E(_n, {
|
|
4734
4669
|
file: e,
|
|
4735
4670
|
className: "file-image-wrapper",
|
|
@@ -4781,17 +4716,17 @@ var pn = [{
|
|
|
4781
4716
|
className: "message-files",
|
|
4782
4717
|
children: e.map((e) => s(e))
|
|
4783
4718
|
});
|
|
4784
|
-
}, bn = ({ message: e }) => {
|
|
4785
|
-
let { currentUser:
|
|
4719
|
+
}, bn = ({ message: e, onHandleClick: t }) => {
|
|
4720
|
+
let { currentUser: n, currentChat: r, currentChatMessages: i } = _((e) => e.chat), { allowDeleteMessage: a, allowRevokeMessage: o } = _(Ge), s = g(), { t: c } = X(), { showToast: l } = Y(), u = e.member.code === n?.code, [f, m] = p(!1), h = new Date(e.created_at).toLocaleTimeString([], {
|
|
4786
4721
|
hour: "2-digit",
|
|
4787
4722
|
minute: "2-digit"
|
|
4788
|
-
}),
|
|
4789
|
-
if (
|
|
4790
|
-
await G.actionMessage(
|
|
4723
|
+
}), v = async (t) => {
|
|
4724
|
+
if (r) try {
|
|
4725
|
+
await G.actionMessage(r.id, e.id, t);
|
|
4791
4726
|
} catch (e) {
|
|
4792
|
-
console.error("Lỗi khi tương tác tin nhắn:", e),
|
|
4727
|
+
console.error("Lỗi khi tương tác tin nhắn:", e), l("Thao tác không thành công, vui lòng thử lại!", "error");
|
|
4793
4728
|
}
|
|
4794
|
-
},
|
|
4729
|
+
}, y = (e, t) => {
|
|
4795
4730
|
e.stopPropagation();
|
|
4796
4731
|
let n = e.currentTarget.getRootNode(), r = n.getElementById ? n.getElementById(`chat-message-${t}`) : document.getElementById(`chat-message-${t}`);
|
|
4797
4732
|
r && r.scrollIntoView({
|
|
@@ -4800,10 +4735,10 @@ var pn = [{
|
|
|
4800
4735
|
}), r?.classList.add("highlight-message"), setTimeout(() => {
|
|
4801
4736
|
r?.classList.remove("highlight-message");
|
|
4802
4737
|
}, 2e3);
|
|
4803
|
-
},
|
|
4738
|
+
}, b = d(() => i.find((e) => e.member.code === n?.code)?.id, [i, n?.code]), x = d(() => r?.members ? Math.max(...r.members.filter((e) => e.id !== n?.id).map((e) => e.last_read_id ?? 0)) : 0, [r, n?.id]), S = u && e.id === x && x > 0, C = u && e.id === b && e.id > x;
|
|
4804
4739
|
return e.removed ? null : e.revoked ? /* @__PURE__ */ E("div", {
|
|
4805
|
-
className: `message-item ${
|
|
4806
|
-
children: [!
|
|
4740
|
+
className: `message-item ${u ? "current-user" : "other-user"}`,
|
|
4741
|
+
children: [!u && e.member.avatar && /* @__PURE__ */ T("img", {
|
|
4807
4742
|
src: e.member.avatar,
|
|
4808
4743
|
alt: e.member.name,
|
|
4809
4744
|
className: "message-avatar",
|
|
@@ -4811,26 +4746,28 @@ var pn = [{
|
|
|
4811
4746
|
}), /* @__PURE__ */ T("div", {
|
|
4812
4747
|
className: "message-content",
|
|
4813
4748
|
children: /* @__PURE__ */ T("div", {
|
|
4814
|
-
className: `message-bubble ${
|
|
4749
|
+
className: `message-bubble ${u ? "current-user" : "other-user"} revoked`,
|
|
4815
4750
|
children: /* @__PURE__ */ T("div", {
|
|
4816
4751
|
className: "message-text",
|
|
4817
|
-
children:
|
|
4752
|
+
children: c("chatMessage.states.revoked")
|
|
4818
4753
|
})
|
|
4819
4754
|
})
|
|
4820
4755
|
})]
|
|
4821
4756
|
}) : /* @__PURE__ */ E("div", {
|
|
4822
4757
|
id: `chat-message-${e.id}`,
|
|
4823
|
-
className: `message-item ${
|
|
4824
|
-
children: [!
|
|
4758
|
+
className: `message-item ${u ? "current-user" : "other-user"}`,
|
|
4759
|
+
children: [!u && e.member.avatar && /* @__PURE__ */ T("img", {
|
|
4825
4760
|
src: e.member.avatar,
|
|
4826
4761
|
alt: e.member.name,
|
|
4827
4762
|
className: "message-avatar",
|
|
4828
|
-
title: e.member.name
|
|
4763
|
+
title: e.member.name,
|
|
4764
|
+
onClick: () => t(e.member)
|
|
4829
4765
|
}), /* @__PURE__ */ E("div", {
|
|
4830
4766
|
className: "message-content",
|
|
4831
4767
|
children: [
|
|
4832
|
-
!
|
|
4768
|
+
!u && /* @__PURE__ */ T("div", {
|
|
4833
4769
|
className: "message-member-name",
|
|
4770
|
+
onClick: () => t(e.member),
|
|
4834
4771
|
children: e.member.name
|
|
4835
4772
|
}),
|
|
4836
4773
|
/* @__PURE__ */ E("div", {
|
|
@@ -4838,84 +4775,84 @@ var pn = [{
|
|
|
4838
4775
|
children: [
|
|
4839
4776
|
/* @__PURE__ */ T("div", {
|
|
4840
4777
|
className: "message-actions-bar",
|
|
4841
|
-
children:
|
|
4842
|
-
/* @__PURE__ */ T("button", {
|
|
4843
|
-
className: "action-icon",
|
|
4844
|
-
title: s("chatMessage.actions.like"),
|
|
4845
|
-
onClick: () => void h("like"),
|
|
4846
|
-
children: /* @__PURE__ */ T(Lt, {})
|
|
4847
|
-
}),
|
|
4778
|
+
children: u ? /* @__PURE__ */ E(w, { children: [
|
|
4848
4779
|
/* @__PURE__ */ T("button", {
|
|
4849
4780
|
className: "action-icon",
|
|
4850
|
-
title:
|
|
4851
|
-
onClick: () => void
|
|
4781
|
+
title: c("chatMessage.actions.like"),
|
|
4782
|
+
onClick: () => void v("like"),
|
|
4852
4783
|
children: /* @__PURE__ */ T(Rt, {})
|
|
4853
4784
|
}),
|
|
4854
4785
|
/* @__PURE__ */ T("button", {
|
|
4855
4786
|
className: "action-icon",
|
|
4856
|
-
title:
|
|
4857
|
-
onClick: () =>
|
|
4858
|
-
children: /* @__PURE__ */ T(
|
|
4787
|
+
title: c("chatMessage.actions.love"),
|
|
4788
|
+
onClick: () => void v("love"),
|
|
4789
|
+
children: /* @__PURE__ */ T(zt, {})
|
|
4859
4790
|
}),
|
|
4860
|
-
|
|
4791
|
+
/* @__PURE__ */ T("button", {
|
|
4861
4792
|
className: "action-icon",
|
|
4862
|
-
title:
|
|
4863
|
-
onClick: () =>
|
|
4864
|
-
children: /* @__PURE__ */ T(
|
|
4793
|
+
title: c("chatMessage.actions.reply"),
|
|
4794
|
+
onClick: () => s(ke(e)),
|
|
4795
|
+
children: /* @__PURE__ */ T(At, {})
|
|
4865
4796
|
}),
|
|
4866
4797
|
a(e.created_at) && /* @__PURE__ */ T("button", {
|
|
4867
4798
|
className: "action-icon",
|
|
4868
|
-
title:
|
|
4869
|
-
onClick: () => void
|
|
4799
|
+
title: c("chatMessage.actions.delete"),
|
|
4800
|
+
onClick: () => void v("remove"),
|
|
4870
4801
|
children: /* @__PURE__ */ T(Bt, {})
|
|
4802
|
+
}),
|
|
4803
|
+
o(e.created_at) && /* @__PURE__ */ T("button", {
|
|
4804
|
+
className: "action-icon",
|
|
4805
|
+
title: c("chatMessage.actions.revoke"),
|
|
4806
|
+
onClick: () => void v("revoke"),
|
|
4807
|
+
children: /* @__PURE__ */ T(Vt, {})
|
|
4871
4808
|
})
|
|
4872
4809
|
] }) : /* @__PURE__ */ E(w, { children: [
|
|
4873
4810
|
/* @__PURE__ */ T("button", {
|
|
4874
4811
|
className: "action-icon",
|
|
4875
|
-
title:
|
|
4876
|
-
onClick: () =>
|
|
4877
|
-
children: /* @__PURE__ */ T(
|
|
4812
|
+
title: c("chatMessage.actions.reply"),
|
|
4813
|
+
onClick: () => s(ke(e)),
|
|
4814
|
+
children: /* @__PURE__ */ T(At, {})
|
|
4878
4815
|
}),
|
|
4879
4816
|
/* @__PURE__ */ T("button", {
|
|
4880
4817
|
className: "action-icon",
|
|
4881
|
-
title:
|
|
4882
|
-
onClick: () => void
|
|
4883
|
-
children: /* @__PURE__ */ T(
|
|
4818
|
+
title: c("chatMessage.actions.like"),
|
|
4819
|
+
onClick: () => void v("like"),
|
|
4820
|
+
children: /* @__PURE__ */ T(Rt, {})
|
|
4884
4821
|
}),
|
|
4885
4822
|
/* @__PURE__ */ T("button", {
|
|
4886
4823
|
className: "action-icon",
|
|
4887
|
-
title:
|
|
4888
|
-
onClick: () => void
|
|
4889
|
-
children: /* @__PURE__ */ T(
|
|
4824
|
+
title: c("chatMessage.actions.love"),
|
|
4825
|
+
onClick: () => void v("love"),
|
|
4826
|
+
children: /* @__PURE__ */ T(zt, {})
|
|
4890
4827
|
})
|
|
4891
4828
|
] })
|
|
4892
4829
|
}),
|
|
4893
4830
|
e.content || e.reply ? /* @__PURE__ */ E("div", {
|
|
4894
|
-
className: `message-bubble ${
|
|
4831
|
+
className: `message-bubble ${u ? "current-user" : "other-user"}`,
|
|
4895
4832
|
children: [e.reply && /* @__PURE__ */ E("div", {
|
|
4896
4833
|
className: "message-reply-preview",
|
|
4897
|
-
onClick: (t) =>
|
|
4834
|
+
onClick: (t) => y(t, e.reply.id),
|
|
4898
4835
|
children: [/* @__PURE__ */ T("div", {
|
|
4899
4836
|
className: "reply-user-name",
|
|
4900
4837
|
children: e.reply.member.name
|
|
4901
4838
|
}), /* @__PURE__ */ T("div", {
|
|
4902
4839
|
className: "reply-content-text",
|
|
4903
|
-
children: e.reply.content ?? (e.reply.files?.length ?
|
|
4840
|
+
children: e.reply.content ?? (e.reply.files?.length ? c("chatMessage.states.attachment") : "")
|
|
4904
4841
|
})]
|
|
4905
4842
|
}), e.content && /* @__PURE__ */ T("div", {
|
|
4906
4843
|
className: "message-text",
|
|
4907
|
-
children: e.content.length > 500 && !
|
|
4844
|
+
children: e.content.length > 500 && !f ? /* @__PURE__ */ E(w, { children: [
|
|
4908
4845
|
e.content.substring(0, 500),
|
|
4909
4846
|
"...",
|
|
4910
4847
|
/* @__PURE__ */ T("span", {
|
|
4911
4848
|
className: "see-more-btn",
|
|
4912
|
-
onClick: () =>
|
|
4913
|
-
children:
|
|
4849
|
+
onClick: () => m(!0),
|
|
4850
|
+
children: c("chatMessage.actions.seeMore")
|
|
4914
4851
|
})
|
|
4915
4852
|
] }) : /* @__PURE__ */ E(w, { children: [e.content, e.content.length > 500 && /* @__PURE__ */ T("span", {
|
|
4916
4853
|
className: "see-more-btn",
|
|
4917
|
-
onClick: () =>
|
|
4918
|
-
children:
|
|
4854
|
+
onClick: () => m(!1),
|
|
4855
|
+
children: c("chatMessage.actions.seeLess")
|
|
4919
4856
|
})] })
|
|
4920
4857
|
})]
|
|
4921
4858
|
}) : null,
|
|
@@ -4928,25 +4865,25 @@ var pn = [{
|
|
|
4928
4865
|
}),
|
|
4929
4866
|
/* @__PURE__ */ E("div", {
|
|
4930
4867
|
className: "message-time",
|
|
4931
|
-
children: [
|
|
4932
|
-
className: `message-item-status ${
|
|
4933
|
-
children:
|
|
4868
|
+
children: [h, u && (S || C) && /* @__PURE__ */ T("span", {
|
|
4869
|
+
className: `message-item-status ${S ? "seen" : ""}`,
|
|
4870
|
+
children: S ? /* @__PURE__ */ T(Ht, {}) : `• ${c("chatMessage.status.sent")}`
|
|
4934
4871
|
})]
|
|
4935
4872
|
})
|
|
4936
4873
|
]
|
|
4937
4874
|
})]
|
|
4938
4875
|
});
|
|
4939
4876
|
}, xn = () => {
|
|
4940
|
-
let { currentChat: t, currentChatMessages: n, messagesPagination: r, currentUser: i } = _((e) => e.chat), o = g(), s = f(null), l = f(null), u = f(null),
|
|
4877
|
+
let { currentChat: t, currentChatMessages: n, messagesPagination: r, currentUser: i } = _((e) => e.chat), o = g(), s = f(null), l = f(null), u = f(null), { chats: d } = _((e) => e.chat), [m, h] = p(!1), [v, y] = p(!1), [b, x] = p(!1), [S, C] = p(null), w = f(null), D = f(!1);
|
|
4941
4878
|
c(() => {
|
|
4942
4879
|
(async () => {
|
|
4943
|
-
if (t &&
|
|
4944
|
-
|
|
4880
|
+
if (t && w.current !== Number(t.id)) {
|
|
4881
|
+
w.current = Number(t.id);
|
|
4945
4882
|
try {
|
|
4946
4883
|
let e = G.getMessages(t.id, 20, 1), n = t.type === "group" ? G.getMembers(t.id).then((e) => e.data ?? []) : Promise.resolve(t.members ?? []), [r, i] = await Promise.all([e, n]);
|
|
4947
4884
|
r?.data && (o(ge(r.data)), o(be(r.pagination)), o(_e(i)));
|
|
4948
4885
|
} catch (e) {
|
|
4949
|
-
console.error("Lỗi khi tải tin nhắn:", e),
|
|
4886
|
+
console.error("Lỗi khi tải tin nhắn:", e), w.current = null;
|
|
4950
4887
|
}
|
|
4951
4888
|
}
|
|
4952
4889
|
})();
|
|
@@ -4965,20 +4902,20 @@ var pn = [{
|
|
|
4965
4902
|
i?.code,
|
|
4966
4903
|
i?.id
|
|
4967
4904
|
]);
|
|
4968
|
-
let
|
|
4905
|
+
let O = async (e) => {
|
|
4969
4906
|
let n = e.currentTarget, i = Math.abs(n.scrollTop);
|
|
4970
|
-
if (
|
|
4971
|
-
|
|
4907
|
+
if (y(i > 300), i < 10 && x(!1), Math.abs(n.scrollTop) + n.clientHeight >= n.scrollHeight - 1 && !m && !D.current && r && r.current_page < r.total_pages) {
|
|
4908
|
+
D.current = !0, h(!0);
|
|
4972
4909
|
try {
|
|
4973
4910
|
let e = r.current_page + 1, n = await G.getMessages(Number(t?.id), 20, e);
|
|
4974
4911
|
n.data && (o(xe(n.data)), o(be(n.pagination)));
|
|
4975
4912
|
} catch (e) {
|
|
4976
4913
|
console.error("Load more error", e);
|
|
4977
4914
|
} finally {
|
|
4978
|
-
|
|
4915
|
+
h(!1), D.current = !1;
|
|
4979
4916
|
}
|
|
4980
4917
|
}
|
|
4981
|
-
},
|
|
4918
|
+
}, k = a(() => {
|
|
4982
4919
|
let e = s.current;
|
|
4983
4920
|
e && requestAnimationFrame(() => {
|
|
4984
4921
|
let t = 1e3, n = e.scrollTop, r = null, i = (a) => {
|
|
@@ -4989,39 +4926,116 @@ var pn = [{
|
|
|
4989
4926
|
requestAnimationFrame(i);
|
|
4990
4927
|
});
|
|
4991
4928
|
}, []);
|
|
4992
|
-
|
|
4929
|
+
c(() => {
|
|
4993
4930
|
if (!t) return;
|
|
4994
4931
|
let e = t.id !== l.current, r = n[0]?.id, i = r !== u.current;
|
|
4995
|
-
e ? (
|
|
4932
|
+
e ? (k(), x(!1)) : i && (Math.abs(s.current?.scrollTop ?? 0) < 100 ? k() : x(!0)), l.current = t?.id ?? null, u.current = r ?? null;
|
|
4996
4933
|
}, [
|
|
4997
4934
|
n,
|
|
4998
4935
|
t,
|
|
4999
|
-
|
|
5000
|
-
])
|
|
4936
|
+
k
|
|
4937
|
+
]);
|
|
4938
|
+
let A = (e) => {
|
|
4939
|
+
C(e);
|
|
4940
|
+
}, j = () => {
|
|
4941
|
+
if (!S) return;
|
|
4942
|
+
let e = d.find((e) => e.type === "single" && e.members?.some((e) => e.id === S.id));
|
|
4943
|
+
e && o(V(e)), C(null);
|
|
4944
|
+
};
|
|
4945
|
+
return /* @__PURE__ */ E("div", {
|
|
5001
4946
|
className: "message-list-wrapper",
|
|
5002
|
-
children: [
|
|
5003
|
-
|
|
5004
|
-
|
|
5005
|
-
|
|
5006
|
-
|
|
5007
|
-
|
|
5008
|
-
|
|
5009
|
-
|
|
5010
|
-
|
|
5011
|
-
|
|
4947
|
+
children: [
|
|
4948
|
+
/* @__PURE__ */ T("div", {
|
|
4949
|
+
className: "message-list",
|
|
4950
|
+
ref: s,
|
|
4951
|
+
onScroll: (e) => void O(e),
|
|
4952
|
+
children: n.map((t, r) => {
|
|
4953
|
+
let i = new Date(t.created_at).toDateString(), a = n[r + 1], o = i !== (a ? new Date(a.created_at).toDateString() : null);
|
|
4954
|
+
return /* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(bn, {
|
|
4955
|
+
message: t,
|
|
4956
|
+
onHandleClick: A
|
|
4957
|
+
}), o && /* @__PURE__ */ T("div", {
|
|
4958
|
+
className: "chat-date-divider",
|
|
4959
|
+
children: /* @__PURE__ */ T("span", { children: P(t.created_at) })
|
|
4960
|
+
})] }, t.id);
|
|
4961
|
+
})
|
|
4962
|
+
}),
|
|
4963
|
+
v && /* @__PURE__ */ E("button", {
|
|
4964
|
+
className: "scroll-bottom-btn",
|
|
4965
|
+
onClick: () => k(),
|
|
4966
|
+
children: ["↓", b && /* @__PURE__ */ T("span", { className: "unread-dot" })]
|
|
4967
|
+
}),
|
|
4968
|
+
S && /* @__PURE__ */ T(on, {
|
|
4969
|
+
user: S,
|
|
4970
|
+
isOnline: (S.socket_ids?.length ?? 0) > 0,
|
|
4971
|
+
onClose: () => C(null),
|
|
4972
|
+
onMessage: () => void j()
|
|
5012
4973
|
})
|
|
5013
|
-
|
|
5014
|
-
|
|
5015
|
-
|
|
5016
|
-
|
|
4974
|
+
]
|
|
4975
|
+
});
|
|
4976
|
+
}, Sn = ({ chat: e, onSelectChat: t, onAvatarClick: n }) => {
|
|
4977
|
+
let { currentUser: r, members: i, currentChat: a } = _((e) => e.chat), { t: o } = X(), s = (e) => e ? new Date(e).toLocaleTimeString([], {
|
|
4978
|
+
hour: "2-digit",
|
|
4979
|
+
minute: "2-digit"
|
|
4980
|
+
}) : "", c = e.message?.member.id === r?.id, l = r?.id && e.new?.[r.id] ? e.new[r.id] : 0, u = e.type === "single" ? e.members?.find((e) => e.id !== r?.id) : null, d = !!u && i.some((e) => e.id === u.id && (e.socket_ids?.length ?? 0) > 0);
|
|
4981
|
+
return /* @__PURE__ */ E("div", {
|
|
4982
|
+
className: `chat-item ${a?.id === e.id ? "active" : ""} `,
|
|
4983
|
+
onClick: () => t(e),
|
|
4984
|
+
children: [/* @__PURE__ */ E("div", {
|
|
4985
|
+
className: "chat-item-avatar",
|
|
4986
|
+
style: {
|
|
4987
|
+
position: "relative",
|
|
4988
|
+
background: e.avatar ? "transparent" : void 0,
|
|
4989
|
+
cursor: e.type === "single" ? "pointer" : "default"
|
|
4990
|
+
},
|
|
4991
|
+
onClick: (t) => {
|
|
4992
|
+
t.stopPropagation(), e.type === "single" && u && n(u, d);
|
|
4993
|
+
},
|
|
4994
|
+
children: [/* @__PURE__ */ T($, { member: e.type === "single" && u ? u : e }), e.type === "single" && d && /* @__PURE__ */ T(at, {
|
|
4995
|
+
size: 12,
|
|
4996
|
+
className: "online-indicator"
|
|
4997
|
+
})]
|
|
4998
|
+
}), /* @__PURE__ */ E("div", {
|
|
4999
|
+
className: "chat-item-info",
|
|
5000
|
+
children: [/* @__PURE__ */ E("div", {
|
|
5001
|
+
className: "info-top-row",
|
|
5002
|
+
children: [/* @__PURE__ */ T("div", {
|
|
5003
|
+
className: "chat-item-name",
|
|
5004
|
+
children: /* @__PURE__ */ T("span", {
|
|
5005
|
+
className: "name-text",
|
|
5006
|
+
children: O(e, r?.id)
|
|
5007
|
+
})
|
|
5008
|
+
}), /* @__PURE__ */ T("span", {
|
|
5009
|
+
className: "chat-item-time",
|
|
5010
|
+
children: s(e.message?.created_at ?? e.updated_at)
|
|
5011
|
+
})]
|
|
5012
|
+
}), /* @__PURE__ */ E("div", {
|
|
5013
|
+
className: "info-bottom-row",
|
|
5014
|
+
children: [/* @__PURE__ */ T("div", {
|
|
5015
|
+
className: "chat-item-last",
|
|
5016
|
+
children: /* @__PURE__ */ E("span", {
|
|
5017
|
+
className: "last-message-text",
|
|
5018
|
+
children: [c && `${o("chatList.yourMessage")}`, e.message?.content ?? (e.message?.files?.length ? o("chatMessage.states.attachment") : "")]
|
|
5019
|
+
})
|
|
5020
|
+
}), /* @__PURE__ */ E("div", {
|
|
5021
|
+
className: "info-bottom-right",
|
|
5022
|
+
children: [e.is_muted && /* @__PURE__ */ T(dt, {
|
|
5023
|
+
size: 14,
|
|
5024
|
+
className: "mute-icon-list"
|
|
5025
|
+
}), l > 0 && /* @__PURE__ */ T("div", {
|
|
5026
|
+
className: "unread-badge-circle",
|
|
5027
|
+
children: l > 99 ? "99+" : l
|
|
5028
|
+
})]
|
|
5029
|
+
})]
|
|
5030
|
+
})]
|
|
5017
5031
|
})]
|
|
5018
5032
|
});
|
|
5019
5033
|
};
|
|
5020
5034
|
//#endregion
|
|
5021
5035
|
//#region src/index.ts
|
|
5022
|
-
function
|
|
5036
|
+
function Cn(e) {
|
|
5023
5037
|
let t = document.createElement("div");
|
|
5024
|
-
t.id = "chatbot-widget-umd-root", document.body.appendChild(t), m(t).render(n(
|
|
5038
|
+
t.id = "chatbot-widget-umd-root", document.body.appendChild(t), m(t).render(n(rt, e));
|
|
5025
5039
|
}
|
|
5026
5040
|
//#endregion
|
|
5027
|
-
export {
|
|
5041
|
+
export { rt as ChatWidget, Cn as init };
|