p3x-redis-ui-material
Version:
💿 P3X Redis UI triple frontend — Angular + React/MUI + Vue/Vuetify with 54 languages, 7 themes, Socket.IO, desktop notifications, and full feature parity
2 lines • 3.4 kB
JavaScript
import{i as e}from"./rolldown-runtime-aKtaBQYM.js";import{F as t,it as n,t as r}from"./Box-CN-vzd2M.js";import{n as i,o as a}from"./i18n.store-cEFY1tQT.js";import{t as o}from"./Download-TUclGRoE.js";import{r as s}from"./redis-state.store-DegzWxJZ.js";import{A as c,r as l,z as u}from"./index-B6abhTyw.js";import{t as d}from"./P3xrAccordion-DoDeoAbj.js";import{clearPubSub as f,onPubsubEntry as p,useMonitoringDataStore as m}from"./monitoring-data.store-BzyWar1_.js";var h=e(a()),g=n(),_=66,v=48;function y(e){return e.replace(/&/g,`&`).replace(/</g,`<`).replace(/>/g,`>`).replace(/"/g,`"`)}function b(e,t){let n=new Blob([e],{type:`text/plain`}),r=URL.createObjectURL(n),i=document.createElement(`a`);i.href=r,i.download=t,i.click(),URL.revokeObjectURL(r)}function x(){let e=i(e=>e.strings),n=s(e=>e.connection),a=m(e=>e.pubsubPattern),x=t().palette.mode===`dark`,S=(0,h.useRef)(null),C=(0,h.useRef)(0),w=x?`rgba(255,255,255,0.05)`:`rgba(0,0,0,0.04)`,T=(0,h.useCallback)(e=>{let t=S.current;if(!t)return;let n=C.current++%2==1,r=document.createElement(`div`);for(r.style.padding=`6px 16px`,r.style.wordBreak=`break-all`,r.style.whiteSpace=`normal`,n&&(r.style.backgroundColor=w),r.innerHTML=`<span style="opacity:0.5">${y(e.displayTime)}</span> <strong>${y(e.channel)}</strong> ${y(e.message)}`,t.appendChild(r);t.children.length>_;)t.removeChild(t.firstChild);requestAnimationFrame(()=>{t.scrollTop=t.scrollHeight})},[w]),E=(0,h.useCallback)(()=>{let e=S.current;if(!e)return;let t=e.getBoundingClientRect(),n=getComputedStyle(document.documentElement).getPropertyValue(`--p3xr-console-drawer-height-active`).trim(),r=0;n.endsWith(`vh`)?r=Math.round(parseFloat(n)/100*window.innerHeight):n.endsWith(`px`)&&(r=parseFloat(n));let i=window.innerHeight-t.top-v-r-8;e.style.height=Math.max(i,100)+`px`},[]);(0,h.useEffect)(()=>{let e=setTimeout(()=>E(),160);return()=>clearTimeout(e)},[s(e=>e.consoleDrawerOpen),E]),(0,h.useEffect)(()=>{document.body.classList.add(`p3xr-no-main-scroll`),E();let e=S.current;e&&(e.innerHTML=``);let t=m.getState().pubsubEntries,n=Math.max(0,t.length-_);C.current=n;for(let e=n;e<t.length;e++)T(t[e]);e&&requestAnimationFrame(()=>{e.scrollTop=e.scrollHeight});let r=p(T),i=()=>E();return window.addEventListener(`resize`,i),()=>{document.body.classList.remove(`p3xr-no-main-scroll`),r(),window.removeEventListener(`resize`,i)}},[T,E]);let D=(0,h.useCallback)(()=>{f(),C.current=0,S.current&&(S.current.innerHTML=``)},[]),O=(0,h.useCallback)(()=>{let e=n?.name||`redis`;b(m.getState().pubsubEntries.map(e=>`${e.fullTimestamp} ${e.channel} ${e.message}`).join(`
`),`${e}-pubsub-export.txt`)},[n]),k=e=>{m.setState({pubsubPattern:e})};return(0,g.jsx)(r,{children:(0,g.jsxs)(d,{title:``,accordionKey:`profiler-pubsub`,collapsible:!1,actions:(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(l,{icon:(0,g.jsx)(c,{sx:{fontSize:18}}),label:e?.intention?.clear,color:`inherit`,onClick:e=>{e.stopPropagation(),D()}}),(0,g.jsx)(l,{icon:(0,g.jsx)(o,{sx:{fontSize:18}}),label:e?.intention?.export,color:`inherit`,onClick:e=>{e.stopPropagation(),O()}})]}),children:[(0,g.jsx)(r,{sx:{px:2,py:1},children:(0,g.jsx)(u,{fullWidth:!0,size:`small`,label:`Pattern`,placeholder:`*`,value:a,onChange:e=>k(e.target.value)})}),(0,g.jsx)(r,{ref:S,sx:{fontFamily:`'Roboto Mono', monospace`,fontSize:13,overflowY:`auto`,wordBreak:`break-all`,whiteSpace:`normal`}})]})})}export{x as default};