@buoy-gg/network 7.0.44 → 7.0.46
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/lib/commonjs/network/components/NetworkEventItemCompact.web.js +2 -2
- package/lib/commonjs/network/components/NetworkHeaderLive.web.js +1 -1
- package/lib/module/network/components/NetworkEventItemCompact.web.js +2 -2
- package/lib/module/network/components/NetworkHeaderLive.web.js +1 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkEventItemCompact=void 0;var _react=require("react");var _formatGraphQLVariables=require("../utils/formatGraphQLVariables");var _jsxRuntime=require("react/jsx-runtime");const macOSColors={text:{
|
|
2
|
-
(${e.operationName})`}return(0,_jsxRuntime.jsxs)(DevToolsCardWeb,{onPress:()=>r(e),onLongPress:s?()=>s(e):void 0,contentStyle:{flexDirection:"row",alignItems:"center",borderLeft:`3px solid ${l}`},children:[(0,_jsxRuntime.jsxs)("span",{style:styles.topRightContainer,children:[n?(0,_jsxRuntime.jsx)(Pin,{size:10,active:true,color:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkEventItemCompact=void 0;var _react=require("react");var _formatGraphQLVariables=require("../utils/formatGraphQLVariables");var _jsxRuntime=require("react/jsx-runtime");const macOSColors={text:{muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6"}};const buoy={primary:"#20C997",success:"#20C997",warning:"#FFA94D",error:"#EF4444"};const night={cardScrim:"rgba(12, 12, 12, 0.9)",border:"#1A1A1C",separator:"rgba(255, 255, 255, 0.08)",text:"#ECEDEE",textSecondary:"#9BA1A6",textTertiary:"#636366",accent:"#20C997",danger:"#FF3B30",dangerSoft:"rgba(255, 59, 48, 0.10)",warning:"#FF8329",warningSoft:"rgba(255, 131, 41, 0.12)",info:"#1E6DFF"};function Svg({size:t=14,color:e="currentColor",children:r}){return(0,_jsxRuntime.jsx)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",stroke:e,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:r})}const ChevronRight=t=>(0,_jsxRuntime.jsx)(Svg,{...t,children:(0,_jsxRuntime.jsx)("path",{d:"m9 18 6-6-6-6"})});const Upload=t=>(0,_jsxRuntime.jsxs)(Svg,{...t,children:[(0,_jsxRuntime.jsx)("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),(0,_jsxRuntime.jsx)("polyline",{points:"17 8 12 3 7 8"}),(0,_jsxRuntime.jsx)("line",{x1:"12",x2:"12",y1:"3",y2:"15"})]});const Download=t=>(0,_jsxRuntime.jsxs)(Svg,{...t,children:[(0,_jsxRuntime.jsx)("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),(0,_jsxRuntime.jsx)("polyline",{points:"7 10 12 15 17 10"}),(0,_jsxRuntime.jsx)("line",{x1:"12",x2:"12",y1:"15",y2:"3"})]});const Clock=t=>(0,_jsxRuntime.jsxs)(Svg,{...t,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("polyline",{points:"12 6 12 12 16 14"})]});const AlertCircle=t=>(0,_jsxRuntime.jsxs)(Svg,{...t,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("line",{x1:"12",x2:"12",y1:"8",y2:"12"}),(0,_jsxRuntime.jsx)("line",{x1:"12",x2:"12.01",y1:"16",y2:"16"})]});const Bookmark=t=>(0,_jsxRuntime.jsx)(Svg,{...t,children:(0,_jsxRuntime.jsx)("path",{d:"m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"})});const FlaskConical=t=>(0,_jsxRuntime.jsxs)(Svg,{...t,children:[(0,_jsxRuntime.jsx)("path",{d:"M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2"}),(0,_jsxRuntime.jsx)("path",{d:"M8.5 2h7"}),(0,_jsxRuntime.jsx)("path",{d:"M7 16h10"})]});const Pin=({active:t,...e})=>(0,_jsxRuntime.jsx)(Svg,{...e,children:(0,_jsxRuntime.jsxs)("g",{transform:t?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[(0,_jsxRuntime.jsx)("path",{d:"M2.97 21.03 8.18 15.82"}),(0,_jsxRuntime.jsx)("path",{d:"M4.4 10.81 13.19 19.6"}),(0,_jsxRuntime.jsx)("path",{d:"M5.17 10.54 11.43 8.83"}),(0,_jsxRuntime.jsx)("path",{d:"M13.46 18.83 15.17 12.57"}),(0,_jsxRuntime.jsx)("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});function formatBytes(t){if(t===void 0||t===null)return"N/A";if(t===0)return"0 B";const e=1024;const r=["B","KB","MB","GB","TB"];const n=Math.floor(Math.log(t)/Math.log(e));return`${(t/Math.pow(e,n)).toFixed(1)} ${r[n]}`}function formatDuration(t){if(t===void 0||t===null)return"N/A";if(t<1e3){return`${t}ms`}if(t<6e4){return`${(t/1e3).toFixed(1)}s`}if(t<36e5){const n=Math.floor(t/6e4);const o=Math.floor(t%6e4/1e3);return o>0?`${n}m ${o}s`:`${n}m`}const e=Math.floor(t/36e5);const r=Math.floor(t%36e5/6e4);return r>0?`${e}h ${r}m`:`${e}h`}function formatRelativeTime(t,e=Date.now()){const r=t instanceof Date?t.getTime():t;const n=Math.floor((e-r)/1e3);if(n<0){return"just now"}if(n<60){return n===0?"just now":`${n}s ago`}const o=Math.floor(n/60);if(o<60){return`${o}m ago`}const i=Math.floor(o/60);if(i<24){return`${i}h ago`}const s=Math.floor(i/24);return`${s}d ago`}const tickListeners=new Set;let tickInterval=null;function subscribeTick(t){tickListeners.add(t);if(tickInterval==null){tickInterval=setInterval(()=>{const e=Date.now();tickListeners.forEach(r=>r(e))},5e3)}return()=>{tickListeners.delete(t);if(tickListeners.size===0&&tickInterval!=null){clearInterval(tickInterval);tickInterval=null}}}function useSharedTick(){const[t,e]=(0,_react.useState)(()=>Date.now());(0,_react.useEffect)(()=>subscribeTick(e),[]);return t}function getStatusColor(t,e){if(e)return macOSColors.semantic.error;if(!t)return macOSColors.semantic.warning;if(t>=200&&t<300)return macOSColors.semantic.success;if(t>=300&&t<400)return macOSColors.semantic.info;if(t>=400)return macOSColors.semantic.error;return macOSColors.text.muted}function getContentTypeBadge(t){const e=t?.["content-type"]||t?.["Content-Type"]||"";if(e.includes("json"))return"JSON";if(e.includes("xml"))return"XML";if(e.includes("html"))return"HTML";if(e.includes("text"))return"TEXT";if(e.includes("image"))return"IMG";if(e.includes("video"))return"VIDEO";if(e.includes("audio"))return"AUDIO";if(e.includes("form"))return"FORM";return null}function getClientChipColors(t){switch(t){case"fetch":return{backgroundColor:"rgba(74, 144, 226, 0.15)",color:"#4A90E2"};case"graphql":return{backgroundColor:"rgba(229, 53, 171, 0.15)",color:"#E535AB"};case"grpc-web":return{backgroundColor:"rgba(16, 185, 129, 0.15)",color:"#10B981"};case"xhr":return{backgroundColor:"rgba(245, 158, 11, 0.15)",color:"#F59E0B"};default:return{backgroundColor:"rgba(147, 51, 234, 0.15)",color:"#9333EA"}}}const METHOD_COLORS={GET:buoy.success,POST:buoy.primary,PUT:buoy.warning,PATCH:night.textSecondary,DELETE:buoy.error,HEAD:night.textTertiary,OPTIONS:buoy.primary};function MethodBadgeWeb({method:t}){const e=METHOD_COLORS[t.toUpperCase()]||"#6B7280";return(0,_jsxRuntime.jsx)("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",minWidth:45,boxSizing:"border-box",padding:"2px 6px",fontSize:11,fontWeight:700,color:e,backgroundColor:`${e}15`,border:`1px solid ${e}40`,borderRadius:4},children:t.toUpperCase()})}function TypeBadgeWeb({type:t}){const e=night.textTertiary;return(0,_jsxRuntime.jsx)("span",{style:{display:"inline-flex",alignItems:"center",padding:"2px 6px",fontSize:11,fontWeight:600,color:e,backgroundColor:`${e}15`,border:`1px solid ${e}40`,borderRadius:4},children:t})}function DevToolsCardWeb({onPress:t,onLongPress:e,children:r,contentStyle:n}){const[o,i]=(0,_react.useState)(false);const s=(0,_react.useRef)(null);const l=(0,_react.useRef)(false);const a=()=>{if(s.current!=null){clearTimeout(s.current);s.current=null}};return(0,_jsxRuntime.jsx)("div",{style:{margin:"4px 8px"},children:(0,_jsxRuntime.jsx)("button",{type:"button",onPointerDown:()=>{i(true);if(e){l.current=false;a();s.current=setTimeout(()=>{l.current=true;e()},500)}},onPointerUp:()=>{i(false);a()},onPointerLeave:()=>{i(false);a()},onPointerCancel:()=>{i(false);a()},onClick:()=>{if(l.current){l.current=false;return}t()},style:{position:"relative",display:"flex",width:"100%",boxSizing:"border-box",backgroundColor:night.cardScrim,borderRadius:8,border:`1px solid ${night.border}`,borderBottom:`1px solid ${night.separator}`,padding:12,minHeight:44,margin:0,textAlign:"left",cursor:"pointer",fontFamily:"inherit",color:"inherit",userSelect:"none",WebkitUserSelect:"none",opacity:o?.8:1,...n},children:r})})}function StatusIndicator({event:t,isPending:e,statusColor:r}){if(e){return(0,_jsxRuntime.jsxs)("span",{style:styles.pendingBadge,children:[(0,_jsxRuntime.jsx)(Clock,{size:10,color:night.warning}),(0,_jsxRuntime.jsx)("span",{style:styles.pendingText,children:"..."})]})}if(t.error){return(0,_jsxRuntime.jsxs)("span",{style:styles.errorBadge,children:[(0,_jsxRuntime.jsx)(AlertCircle,{size:10,color:night.danger}),(0,_jsxRuntime.jsx)("span",{style:styles.errorText,children:"ERR"})]})}return(0,_jsxRuntime.jsx)("span",{style:styles.statusBadge,children:(0,_jsxRuntime.jsx)("span",{style:{...styles.statusText,color:r},children:String(t.status)})})}function SizeIndicators({requestSize:t,responseSize:e}){if(!t&&!e)return null;return(0,_jsxRuntime.jsxs)("span",{style:styles.sizeRow,children:[t?(0,_jsxRuntime.jsxs)("span",{style:styles.sizeItem,children:[(0,_jsxRuntime.jsx)(Upload,{size:8,color:night.info}),(0,_jsxRuntime.jsx)("span",{style:styles.sizeText,children:formatBytes(t)})]}):null,e?(0,_jsxRuntime.jsxs)("span",{style:styles.sizeItem,children:[(0,_jsxRuntime.jsx)(Download,{size:8,color:night.accent}),(0,_jsxRuntime.jsx)("span",{style:styles.sizeText,children:formatBytes(e)})]}):null]})}function BottomRightTime({timestamp:t,duration:e}){const r=useSharedTick();const n=formatRelativeTime(t,r);return e?(0,_jsxRuntime.jsxs)("span",{style:styles.bottomRightText,children:[formatDuration(e)," ",n]}):(0,_jsxRuntime.jsx)("span",{style:styles.bottomRightText,children:n})}const NetworkEventItemCompact=exports.NetworkEventItemCompact=(0,_react.memo)(function t({event:e,onPress:r,pinned:n=false,saved:o=false,overridden:i=false,onLongPress:s}){const l=getStatusColor(e.status,e.error);const a=!e.status&&!e.error;const d=getContentTypeBadge(e.responseHeaders);let c=e.path||e.url.replace(/^https?:\/\/[^/]+/,"");if(e.requestClient==="graphql"){if(e.operationName){c=(0,_formatGraphQLVariables.formatGraphQLDisplay)(e.operationName,e.graphqlVariables)}else{c=c.replace(/\/graphql[^?]*/,"/graphql")}}else if(e.operationName){c=`${c}
|
|
2
|
+
(${e.operationName})`}return(0,_jsxRuntime.jsxs)(DevToolsCardWeb,{onPress:()=>r(e),onLongPress:s?()=>s(e):void 0,contentStyle:{flexDirection:"row",alignItems:"center",borderLeft:`3px solid ${l}`},children:[(0,_jsxRuntime.jsxs)("span",{style:styles.topRightContainer,children:[n?(0,_jsxRuntime.jsx)(Pin,{size:10,active:true,color:night.info}):null,o?(0,_jsxRuntime.jsx)(Bookmark,{size:10,color:night.accent}):null,i||e.override?(0,_jsxRuntime.jsx)(FlaskConical,{size:10,color:night.warning}):null,(0,_jsxRuntime.jsx)(StatusIndicator,{event:e,isPending:a,statusColor:l}),e.requestClient?(0,_jsxRuntime.jsx)("span",{style:{...styles.topRightBadge,backgroundColor:getClientChipColors(e.requestClient).backgroundColor},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.clientText,color:getClientChipColors(e.requestClient).color},children:e.requestClient==="graphql"?"GQL":e.requestClient==="grpc-web"?"gRPC":e.requestClient==="xhr"?"XHR":e.requestClient})}):null]}),(0,_jsxRuntime.jsxs)("span",{style:styles.leftSection,children:[(0,_jsxRuntime.jsx)(MethodBadgeWeb,{method:e.method}),(0,_jsxRuntime.jsx)(SizeIndicators,{requestSize:e.requestSize,responseSize:e.responseSize})]}),(0,_jsxRuntime.jsx)("span",{style:styles.middleSection,children:(0,_jsxRuntime.jsx)("span",{style:styles.urlText,children:c})}),(0,_jsxRuntime.jsxs)("span",{style:styles.rightSection,children:[d?(0,_jsxRuntime.jsx)(TypeBadgeWeb,{type:d}):null,(0,_jsxRuntime.jsx)(ChevronRight,{size:14,color:night.textTertiary})]}),(0,_jsxRuntime.jsx)("span",{style:styles.bottomRightContainer,children:(0,_jsxRuntime.jsx)(BottomRightTime,{timestamp:e.timestamp,duration:e.duration})})]})});NetworkEventItemCompact.displayName="NetworkEventItemCompact";const styles={leftSection:{display:"flex",flexDirection:"column",marginRight:8,alignItems:"flex-start"},topRightContainer:{position:"absolute",top:1,right:1,display:"flex",flexDirection:"row",alignItems:"center",gap:4},topRightBadge:{display:"inline-flex",padding:"2px 4px",borderRadius:4},middleSection:{flex:1,minWidth:0,display:"flex",flexDirection:"column",justifyContent:"center",paddingRight:8},urlText:{fontSize:12,color:night.text,lineHeight:"16px",fontFamily:"ui-monospace, Menlo, monospace",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",whiteSpace:"pre-wrap",wordBreak:"break-all"},rightSection:{display:"flex",flexDirection:"row",alignItems:"center",gap:6},bottomRightContainer:{position:"absolute",bottom:4,right:8},bottomRightText:{fontSize:9,color:night.textTertiary,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"pre"},statusBadge:{display:"inline-flex",padding:"1px 4px",borderRadius:3},statusText:{fontSize:10,fontWeight:600},pendingBadge:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2,padding:"1px 4px",backgroundColor:night.warningSoft,borderRadius:3},pendingText:{fontSize:10,color:night.warning,fontWeight:600},errorBadge:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2,padding:"1px 4px",backgroundColor:night.dangerSoft,borderRadius:3},errorText:{fontSize:10,color:night.danger,fontWeight:600},sizeRow:{display:"flex",flexDirection:"row",gap:4,marginTop:4},sizeItem:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2},sizeText:{fontSize:8,color:night.textSecondary,fontFamily:"ui-monospace, Menlo, monospace"},clientText:{fontSize:8,fontWeight:700,letterSpacing:.3,textTransform:"uppercase"}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkClearButton=NetworkClearButton;exports.NetworkDetailPinActions=NetworkDetailPinActions;exports.NetworkHeaderBadges=NetworkHeaderBadges;exports.NetworkHeaderCopyButton=NetworkHeaderCopyButton;exports.NetworkSavedButton=NetworkSavedButton;var _react=require("react");var _sharedUi=require("@buoy-gg/shared-ui");var _networkEventStore=require("../utils/networkEventStore");var _networkSavedStore=require("../utils/networkSavedStore");var _useNetworkSaved=require("../hooks/useNetworkSaved");var _useNetworkSelection=require("../hooks/useNetworkSelection");var _useNetworkBadgeCounts=require("../hooks/useNetworkBadgeCounts");var _useNetworkHasMatches=require("../hooks/useNetworkHasMatches");var _generateNetworkCopyText=require("../utils/generateNetworkCopyText");var _filterNetworkEvents=require("../utils/filterNetworkEvents");var _jsxRuntime=require("react/jsx-runtime");const macOSColors={background:{hover:"#1D1D1F"},border:{default:"#2D2D2F"},text:{primary:"#F5F5F7",secondary:"#A1A1A6",muted:"#8E8E93",disabled:"#9E9EA0"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6",infoBackground:"rgba(0, 184, 230, 0.1)",debug:"#BF5AF2"}};function Svg({size:e=14,color:t="currentColor",children:r}){return(0,_jsxRuntime.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:t,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:r})}const CheckCircle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M21.801 10A10 10 0 1 1 17 3.335"}),(0,_jsxRuntime.jsx)("path",{d:"m9 11 3 3L22 4"})]});const XCircle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"m15 9-6 6"}),(0,_jsxRuntime.jsx)("path",{d:"m9 9 6 6"})]});const Clock=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("polyline",{points:"12 6 12 12 16 14"})]});const Trash2=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M3 6h18"}),(0,_jsxRuntime.jsx)("path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"}),(0,_jsxRuntime.jsx)("path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"}),(0,_jsxRuntime.jsx)("line",{x1:"10",x2:"10",y1:"11",y2:"17"}),(0,_jsxRuntime.jsx)("line",{x1:"14",x2:"14",y1:"11",y2:"17"})]});const Bookmark=e=>(0,_jsxRuntime.jsx)(Svg,{...e,children:(0,_jsxRuntime.jsx)("path",{d:"m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"})});const Pin=({active:e,...t})=>(0,_jsxRuntime.jsx)(Svg,{...t,children:(0,_jsxRuntime.jsxs)("g",{transform:e?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[(0,_jsxRuntime.jsx)("path",{d:"M2.97 21.03 8.18 15.82"}),(0,_jsxRuntime.jsx)("path",{d:"M4.4 10.81 13.19 19.6"}),(0,_jsxRuntime.jsx)("path",{d:"M5.17 10.54 11.43 8.83"}),(0,_jsxRuntime.jsx)("path",{d:"M13.46 18.83 15.17 12.57"}),(0,_jsxRuntime.jsx)("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});const Copy=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),(0,_jsxRuntime.jsx)("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]});const CheckCircle2=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"m9 12 2 2 4-4"})]});const AlertTriangle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"}),(0,_jsxRuntime.jsx)("path",{d:"M12 9v4"}),(0,_jsxRuntime.jsx)("path",{d:"M12 17h.01"})]});function NetworkHeaderBadges({activeStatus:e,onToggleStatus:t,ignoredPatterns:r,paused:a}){const o=(0,_useNetworkBadgeCounts.useNetworkBadgeCounts)({ignoredPatterns:r,paused:a});return(0,_jsxRuntime.jsxs)("div",{style:styles.headerChipRow,children:[(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="success"?styles.headerChipActive:null},onClick:()=>t("success"),children:[(0,_jsxRuntime.jsx)(CheckCircle,{size:12,color:macOSColors.semantic.success}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.success},children:o.successful})]}),(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="error"?styles.headerChipActive:null},onClick:()=>t("error"),children:[(0,_jsxRuntime.jsx)(XCircle,{size:12,color:macOSColors.semantic.error}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.error},children:o.failed})]}),(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="pending"?styles.headerChipActive:null},onClick:()=>t("pending"),children:[(0,_jsxRuntime.jsx)(Clock,{size:12,color:macOSColors.semantic.warning}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.warning},children:o.pending})]})]})}function NetworkClearButton({paused:e}){const t=(0,_useNetworkHasMatches.useNetworkHasEvents)({paused:e});return(0,_jsxRuntime.jsx)("button",{type:"button","aria-label":"Clear network requests",onClick:()=>_networkEventStore.networkEventStore.clearEvents(),style:{...styles.headerActionButton,...!t?styles.headerActionButtonDisabled:null},disabled:!t,children:(0,_jsxRuntime.jsx)(Trash2,{size:14,color:t?macOSColors.text.muted:macOSColors.text.disabled})})}function NetworkSavedButton({onPress:e}){const{savedRecords:t}=(0,_useNetworkSaved.useNetworkSaved)();const r=t.length;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:e,"aria-label":"Saved requests",style:styles.headerActionButton,children:[(0,_jsxRuntime.jsx)(Bookmark,{size:14,color:r>0?macOSColors.semantic.debug:macOSColors.text.muted}),r>0?(0,_jsxRuntime.jsx)("span",{style:styles.savedBadge,children:(0,_jsxRuntime.jsx)("span",{style:styles.savedBadgeText,children:r>99?"99+":r})}):null]})}function NetworkDetailPinActions({isPro:e,onUpgradePress:t}){const r=(0,_useNetworkSelection.useSelectedNetworkEventId)();const a=(0,_useNetworkSaved.useNetworkSaved)();const{pinned:o,saved:l}=(0,_networkSavedStore.flagsForEventId)(a,r);const i=(0,_sharedUi.useLimit)("network.saved");const s=!o&&a.pinnedEvents.length>=_networkSavedStore.MAX_PINNED;const n=!l&&a.savedRecords.length>=i;const u=()=>{if(!r)return null;return _networkEventStore.networkEventStore.getEvents().find(c=>c.id===r)??_networkSavedStore.networkSavedStore.getEventById(r)};const d=()=>{const c=u();if(c)a.togglePin(c)};const h=()=>{if(n&&!e){t();return}const c=u();if(c)a.toggleSave(c)};return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)("button",{type:"button",onClick:d,disabled:s,"aria-label":o?"Unpin request":"Pin request",title:s?`Pin limit reached (${_networkSavedStore.MAX_PINNED})`:void 0,style:{...styles.headerActionButton,...o?styles.headerActionButtonActive:null,...s?styles.headerActionButtonDisabled:null},children:(0,_jsxRuntime.jsx)(Pin,{size:14,active:o,color:o?macOSColors.semantic.info:s?macOSColors.text.disabled:macOSColors.text.secondary})}),(0,_jsxRuntime.jsx)("button",{type:"button",onClick:h,disabled:n&&e,"aria-label":l?"Remove from saved":"Save request",title:n&&e?`Saved limit reached (${_networkSavedStore.MAX_SAVED})`:void 0,style:{...styles.headerActionButton,...l?styles.headerActionButtonSaved:null,...n&&e?styles.headerActionButtonDisabled:null},children:(0,_jsxRuntime.jsx)(Bookmark,{size:14,color:l?macOSColors.semantic.debug:n&&e?macOSColors.text.disabled:macOSColors.text.secondary})})]})}function NetworkHeaderCopyButton({isPro:e,filter:t,ignoredPatterns:r,copySettings:a,paused:o,onUpgradePress:l,label:i}){const s=(0,_useNetworkHasMatches.useNetworkHasMatches)({filter:t,ignoredPatterns:r,paused:o});const[n,u]=(0,_react.useState)("idle");const d=(0,_react.useRef)(null);(0,_react.useEffect)(()=>()=>{if(d.current)clearTimeout(d.current)},[]);if(!e){return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:l,style:{...i?styles.copyMenuRow:styles.headerActionButton,...!s?styles.headerActionButtonDisabled:null},disabled:!s,"aria-label":i??"Copy requests",children:[(0,_jsxRuntime.jsx)(Copy,{size:14,color:s?macOSColors.text.secondary:macOSColors.text.disabled}),i?(0,_jsxRuntime.jsx)("span",{style:styles.copyMenuLabel,children:i}):null]})}const h=p=>{u(p);if(d.current)clearTimeout(d.current);d.current=setTimeout(()=>{u("idle");d.current=null},1500)};const c=async()=>{try{const p=(0,_generateNetworkCopyText.generateNetworkCopyText)((0,_filterNetworkEvents.filterNetworkEvents)((0,_filterNetworkEvents.applyIgnoredPatterns)(_networkEventStore.networkEventStore.getEvents(),r),t),a);await navigator.clipboard.writeText(p);h("success")}catch{h("error")}};const x=n==="success"?macOSColors.semantic.success:n==="error"?macOSColors.semantic.error:s?macOSColors.text.secondary:macOSColors.text.disabled;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:n==="idle"?c:void 0,style:{...i?styles.copyMenuRow:styles.headerActionButton,...!s?styles.headerActionButtonDisabled:null},disabled:!s,"aria-label":n==="idle"?i??"Copy to clipboard":n==="success"?"Copied to clipboard":"Failed to copy",children:[n==="success"?(0,_jsxRuntime.jsx)(CheckCircle2,{size:14,color:x}):n==="error"?(0,_jsxRuntime.jsx)(AlertTriangle,{size:14,color:x}):(0,_jsxRuntime.jsx)(Copy,{size:14,color:x}),i?(0,_jsxRuntime.jsx)("span",{style:styles.copyMenuLabel,children:i}):null]})}const styles={copyMenuRow:{display:"flex",width:"100%",boxSizing:"border-box",flexDirection:"row",alignItems:"center",gap:10,padding:"11px 6px",justifyContent:"flex-start",background:"none",border:"none",cursor:"pointer",margin:0,fontFamily:"inherit",textAlign:"left"},copyMenuLabel:{fontSize:13,fontWeight:600,color:macOSColors.text.primary},headerChipRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},headerChip:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:4,backgroundColor:macOSColors.background.hover,padding:"5px 10px",borderRadius:12,border:`1px solid ${macOSColors.border.default}`,cursor:"pointer",margin:0},headerChipActive:{backgroundColor:macOSColors.semantic.infoBackground,border:`1px solid ${macOSColors.semantic.info}50`,boxShadow:"0 1px 2px rgba(0, 184, 230, 0.08)"},headerChipValue:{fontSize:12,fontWeight:600,fontFamily:"ui-monospace, Menlo, monospace"},headerActionButton:{position:"relative",display:"inline-flex",width:32,height:32,boxSizing:"border-box",borderRadius:8,backgroundColor:macOSColors.background.hover,border:`1px solid ${macOSColors.border.default}`,alignItems:"center",justifyContent:"center",cursor:"pointer",padding:0,margin:0},headerActionButtonDisabled:{opacity:.55,cursor:"default"},headerActionButtonActive:{backgroundColor:macOSColors.semantic.infoBackground,border:`1px solid ${macOSColors.semantic.info}50`},headerActionButtonSaved:{backgroundColor:`${macOSColors.semantic.debug}1A`,border:`1px solid ${macOSColors.semantic.debug}50`},savedBadge:{position:"absolute",top:-3,right:-3,minWidth:14,height:14,boxSizing:"border-box",padding:"0 3px",borderRadius:7,backgroundColor:macOSColors.semantic.debug,display:"inline-flex",alignItems:"center",justifyContent:"center"},savedBadgeText:{color:"#FFFFFF",fontSize:9,fontWeight:700,fontFamily:"ui-monospace, Menlo, monospace"}};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkClearButton=NetworkClearButton;exports.NetworkDetailPinActions=NetworkDetailPinActions;exports.NetworkHeaderBadges=NetworkHeaderBadges;exports.NetworkHeaderCopyButton=NetworkHeaderCopyButton;exports.NetworkSavedButton=NetworkSavedButton;var _react=require("react");var _sharedUi=require("@buoy-gg/shared-ui");var _networkEventStore=require("../utils/networkEventStore");var _networkSavedStore=require("../utils/networkSavedStore");var _useNetworkSaved=require("../hooks/useNetworkSaved");var _useNetworkSelection=require("../hooks/useNetworkSelection");var _useNetworkBadgeCounts=require("../hooks/useNetworkBadgeCounts");var _useNetworkHasMatches=require("../hooks/useNetworkHasMatches");var _generateNetworkCopyText=require("../utils/generateNetworkCopyText");var _filterNetworkEvents=require("../utils/filterNetworkEvents");var _jsxRuntime=require("react/jsx-runtime");const macOSColors={semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B"}};const night={buttonSurface:"rgba(8, 10, 14, 0.85)",border:"#1A1A1C",text:"#ECEDEE",textSecondary:"#9BA1A6",textTertiary:"#636366",accent:"#20C997",accentSoft:"rgba(32, 201, 151, 0.12)",accentBorderStrong:"rgba(32, 201, 151, 0.35)",onAccent:"#000000"};function Svg({size:e=14,color:t="currentColor",children:r}){return(0,_jsxRuntime.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:t,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:r})}const CheckCircle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M21.801 10A10 10 0 1 1 17 3.335"}),(0,_jsxRuntime.jsx)("path",{d:"m9 11 3 3L22 4"})]});const XCircle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"m15 9-6 6"}),(0,_jsxRuntime.jsx)("path",{d:"m9 9 6 6"})]});const Clock=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("polyline",{points:"12 6 12 12 16 14"})]});const Trash2=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M3 6h18"}),(0,_jsxRuntime.jsx)("path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"}),(0,_jsxRuntime.jsx)("path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"}),(0,_jsxRuntime.jsx)("line",{x1:"10",x2:"10",y1:"11",y2:"17"}),(0,_jsxRuntime.jsx)("line",{x1:"14",x2:"14",y1:"11",y2:"17"})]});const Bookmark=e=>(0,_jsxRuntime.jsx)(Svg,{...e,children:(0,_jsxRuntime.jsx)("path",{d:"m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"})});const Pin=({active:e,...t})=>(0,_jsxRuntime.jsx)(Svg,{...t,children:(0,_jsxRuntime.jsxs)("g",{transform:e?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[(0,_jsxRuntime.jsx)("path",{d:"M2.97 21.03 8.18 15.82"}),(0,_jsxRuntime.jsx)("path",{d:"M4.4 10.81 13.19 19.6"}),(0,_jsxRuntime.jsx)("path",{d:"M5.17 10.54 11.43 8.83"}),(0,_jsxRuntime.jsx)("path",{d:"M13.46 18.83 15.17 12.57"}),(0,_jsxRuntime.jsx)("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});const Copy=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),(0,_jsxRuntime.jsx)("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]});const CheckCircle2=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"m9 12 2 2 4-4"})]});const AlertTriangle=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"}),(0,_jsxRuntime.jsx)("path",{d:"M12 9v4"}),(0,_jsxRuntime.jsx)("path",{d:"M12 17h.01"})]});function NetworkHeaderBadges({activeStatus:e,onToggleStatus:t,ignoredPatterns:r,paused:a}){const o=(0,_useNetworkBadgeCounts.useNetworkBadgeCounts)({ignoredPatterns:r,paused:a});return(0,_jsxRuntime.jsxs)("div",{style:styles.headerChipRow,children:[(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="success"?styles.headerChipActive:null},onClick:()=>t("success"),children:[(0,_jsxRuntime.jsx)(CheckCircle,{size:12,color:macOSColors.semantic.success}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.success},children:o.successful})]}),(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="error"?styles.headerChipActive:null},onClick:()=>t("error"),children:[(0,_jsxRuntime.jsx)(XCircle,{size:12,color:macOSColors.semantic.error}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.error},children:o.failed})]}),(0,_jsxRuntime.jsxs)("button",{type:"button",style:{...styles.headerChip,...e==="pending"?styles.headerChipActive:null},onClick:()=>t("pending"),children:[(0,_jsxRuntime.jsx)(Clock,{size:12,color:macOSColors.semantic.warning}),(0,_jsxRuntime.jsx)("span",{style:{...styles.headerChipValue,color:macOSColors.semantic.warning},children:o.pending})]})]})}function NetworkClearButton({paused:e}){const t=(0,_useNetworkHasMatches.useNetworkHasEvents)({paused:e});return(0,_jsxRuntime.jsx)("button",{type:"button","aria-label":"Clear network requests",onClick:()=>_networkEventStore.networkEventStore.clearEvents(),style:{...styles.headerActionButton,...!t?styles.headerActionButtonDisabled:null},disabled:!t,children:(0,_jsxRuntime.jsx)(Trash2,{size:14,color:t?night.textSecondary:night.textTertiary})})}function NetworkSavedButton({onPress:e}){const{savedRecords:t}=(0,_useNetworkSaved.useNetworkSaved)();const r=t.length;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:e,"aria-label":"Saved requests",style:styles.headerActionButton,children:[(0,_jsxRuntime.jsx)(Bookmark,{size:14,color:r>0?night.accent:night.textSecondary}),r>0?(0,_jsxRuntime.jsx)("span",{style:styles.savedBadge,children:(0,_jsxRuntime.jsx)("span",{style:styles.savedBadgeText,children:r>99?"99+":r})}):null]})}function NetworkDetailPinActions({isPro:e,onUpgradePress:t}){const r=(0,_useNetworkSelection.useSelectedNetworkEventId)();const a=(0,_useNetworkSaved.useNetworkSaved)();const{pinned:o,saved:l}=(0,_networkSavedStore.flagsForEventId)(a,r);const i=(0,_sharedUi.useLimit)("network.saved");const s=!o&&a.pinnedEvents.length>=_networkSavedStore.MAX_PINNED;const n=!l&&a.savedRecords.length>=i;const u=()=>{if(!r)return null;return _networkEventStore.networkEventStore.getEvents().find(c=>c.id===r)??_networkSavedStore.networkSavedStore.getEventById(r)};const d=()=>{const c=u();if(c)a.togglePin(c)};const h=()=>{if(n&&!e){t();return}const c=u();if(c)a.toggleSave(c)};return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)("button",{type:"button",onClick:d,disabled:s,"aria-label":o?"Unpin request":"Pin request",title:s?`Pin limit reached (${_networkSavedStore.MAX_PINNED})`:void 0,style:{...styles.headerActionButton,...o?styles.headerActionButtonActive:null,...s?styles.headerActionButtonDisabled:null},children:(0,_jsxRuntime.jsx)(Pin,{size:14,active:o,color:o?night.accent:s?night.textTertiary:night.textSecondary})}),(0,_jsxRuntime.jsx)("button",{type:"button",onClick:h,disabled:n&&e,"aria-label":l?"Remove from saved":"Save request",title:n&&e?`Saved limit reached (${_networkSavedStore.MAX_SAVED})`:void 0,style:{...styles.headerActionButton,...l?styles.headerActionButtonSaved:null,...n&&e?styles.headerActionButtonDisabled:null},children:(0,_jsxRuntime.jsx)(Bookmark,{size:14,color:l?night.accent:n&&e?night.textTertiary:night.textSecondary})})]})}function NetworkHeaderCopyButton({isPro:e,filter:t,ignoredPatterns:r,copySettings:a,paused:o,onUpgradePress:l,label:i}){const s=(0,_useNetworkHasMatches.useNetworkHasMatches)({filter:t,ignoredPatterns:r,paused:o});const[n,u]=(0,_react.useState)("idle");const d=(0,_react.useRef)(null);(0,_react.useEffect)(()=>()=>{if(d.current)clearTimeout(d.current)},[]);if(!e){return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:l,style:{...i?styles.copyMenuRow:styles.headerActionButton,...!s?styles.headerActionButtonDisabled:null},disabled:!s,"aria-label":i??"Copy requests",children:[(0,_jsxRuntime.jsx)(Copy,{size:14,color:s?night.textSecondary:night.textTertiary}),i?(0,_jsxRuntime.jsx)("span",{style:styles.copyMenuLabel,children:i}):null]})}const h=p=>{u(p);if(d.current)clearTimeout(d.current);d.current=setTimeout(()=>{u("idle");d.current=null},1500)};const c=async()=>{try{const p=(0,_generateNetworkCopyText.generateNetworkCopyText)((0,_filterNetworkEvents.filterNetworkEvents)((0,_filterNetworkEvents.applyIgnoredPatterns)(_networkEventStore.networkEventStore.getEvents(),r),t),a);await navigator.clipboard.writeText(p);h("success")}catch{h("error")}};const x=n==="success"?macOSColors.semantic.success:n==="error"?macOSColors.semantic.error:s?night.textSecondary:night.textTertiary;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:n==="idle"?c:void 0,style:{...i?styles.copyMenuRow:styles.headerActionButton,...!s?styles.headerActionButtonDisabled:null},disabled:!s,"aria-label":n==="idle"?i??"Copy to clipboard":n==="success"?"Copied to clipboard":"Failed to copy",children:[n==="success"?(0,_jsxRuntime.jsx)(CheckCircle2,{size:14,color:x}):n==="error"?(0,_jsxRuntime.jsx)(AlertTriangle,{size:14,color:x}):(0,_jsxRuntime.jsx)(Copy,{size:14,color:x}),i?(0,_jsxRuntime.jsx)("span",{style:styles.copyMenuLabel,children:i}):null]})}const styles={copyMenuRow:{display:"flex",width:"100%",boxSizing:"border-box",flexDirection:"row",alignItems:"center",gap:10,padding:"11px 6px",justifyContent:"flex-start",background:"none",border:"none",cursor:"pointer",margin:0,fontFamily:"inherit",textAlign:"left"},copyMenuLabel:{fontSize:13,fontWeight:600,color:night.text},headerChipRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},headerChip:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:4,backgroundColor:night.buttonSurface,padding:"5px 10px",borderRadius:12,border:`1px solid ${night.border}`,cursor:"pointer",margin:0},headerChipActive:{backgroundColor:night.accentSoft,border:`1px solid ${night.accentBorderStrong}`},headerChipValue:{fontSize:12,fontWeight:600,fontFamily:"ui-monospace, Menlo, monospace"},headerActionButton:{position:"relative",display:"inline-flex",width:32,height:32,boxSizing:"border-box",borderRadius:8,backgroundColor:night.buttonSurface,border:`1px solid ${night.border}`,alignItems:"center",justifyContent:"center",cursor:"pointer",padding:0,margin:0},headerActionButtonDisabled:{opacity:.55,cursor:"default"},headerActionButtonActive:{backgroundColor:night.accentSoft,border:`1px solid ${night.accentBorderStrong}`},headerActionButtonSaved:{backgroundColor:night.accentSoft,border:`1px solid ${night.accentBorderStrong}`},savedBadge:{position:"absolute",top:-3,right:-3,minWidth:14,height:14,boxSizing:"border-box",padding:"0 3px",borderRadius:7,backgroundColor:night.accent,display:"inline-flex",alignItems:"center",justifyContent:"center"},savedBadgeText:{color:night.onAccent,fontSize:9,fontWeight:700,fontFamily:"ui-monospace, Menlo, monospace"}};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";import{memo as k,useEffect as
|
|
2
|
-
(${e.operationName})`}return
|
|
1
|
+
"use strict";import{memo as k,useEffect as B,useState as C,useRef as T}from"react";import{formatGraphQLDisplay as M}from"../utils/formatGraphQLVariables";import{jsx as r,jsxs as a}from"react/jsx-runtime";const h={text:{muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6"}};const x={primary:"#20C997",success:"#20C997",warning:"#FFA94D",error:"#EF4444"};const n={cardScrim:"rgba(12, 12, 12, 0.9)",border:"#1A1A1C",separator:"rgba(255, 255, 255, 0.08)",text:"#ECEDEE",textSecondary:"#9BA1A6",textTertiary:"#636366",accent:"#20C997",danger:"#FF3B30",dangerSoft:"rgba(255, 59, 48, 0.10)",warning:"#FF8329",warningSoft:"rgba(255, 131, 41, 0.12)",info:"#1E6DFF"};function u({size:t=14,color:e="currentColor",children:i}){return r("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",stroke:e,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:i})}const z=t=>r(u,{...t,children:r("path",{d:"m9 18 6-6-6-6"})});const R=t=>a(u,{...t,children:[r("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),r("polyline",{points:"17 8 12 3 7 8"}),r("line",{x1:"12",x2:"12",y1:"3",y2:"15"})]});const E=t=>a(u,{...t,children:[r("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),r("polyline",{points:"7 10 12 15 17 10"}),r("line",{x1:"12",x2:"12",y1:"15",y2:"3"})]});const D=t=>a(u,{...t,children:[r("circle",{cx:"12",cy:"12",r:"10"}),r("polyline",{points:"12 6 12 12 16 14"})]});const I=t=>a(u,{...t,children:[r("circle",{cx:"12",cy:"12",r:"10"}),r("line",{x1:"12",x2:"12",y1:"8",y2:"12"}),r("line",{x1:"12",x2:"12.01",y1:"16",y2:"16"})]});const F=t=>r(u,{...t,children:r("path",{d:"m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"})});const $=t=>a(u,{...t,children:[r("path",{d:"M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2"}),r("path",{d:"M8.5 2h7"}),r("path",{d:"M7 16h10"})]});const A=({active:t,...e})=>r(u,{...e,children:a("g",{transform:t?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[r("path",{d:"M2.97 21.03 8.18 15.82"}),r("path",{d:"M4.4 10.81 13.19 19.6"}),r("path",{d:"M5.17 10.54 11.43 8.83"}),r("path",{d:"M13.46 18.83 15.17 12.57"}),r("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});function S(t){if(t===void 0||t===null)return"N/A";if(t===0)return"0 B";const e=1024;const i=["B","KB","MB","GB","TB"];const l=Math.floor(Math.log(t)/Math.log(e));return`${(t/Math.pow(e,l)).toFixed(1)} ${i[l]}`}function P(t){if(t===void 0||t===null)return"N/A";if(t<1e3){return`${t}ms`}if(t<6e4){return`${(t/1e3).toFixed(1)}s`}if(t<36e5){const l=Math.floor(t/6e4);const s=Math.floor(t%6e4/1e3);return s>0?`${l}m ${s}s`:`${l}m`}const e=Math.floor(t/36e5);const i=Math.floor(t%36e5/6e4);return i>0?`${e}h ${i}m`:`${e}h`}function W(t,e=Date.now()){const i=t instanceof Date?t.getTime():t;const l=Math.floor((e-i)/1e3);if(l<0){return"just now"}if(l<60){return l===0?"just now":`${l}s ago`}const s=Math.floor(l/60);if(s<60){return`${s}m ago`}const c=Math.floor(s/60);if(c<24){return`${c}h ago`}const d=Math.floor(c/24);return`${d}d ago`}const y=new Set;let m=null;function q(t){y.add(t);if(m==null){m=setInterval(()=>{const e=Date.now();y.forEach(i=>i(e))},5e3)}return()=>{y.delete(t);if(y.size===0&&m!=null){clearInterval(m);m=null}}}function L(){const[t,e]=C(()=>Date.now());B(()=>q(e),[]);return t}function N(t,e){if(e)return h.semantic.error;if(!t)return h.semantic.warning;if(t>=200&&t<300)return h.semantic.success;if(t>=300&&t<400)return h.semantic.info;if(t>=400)return h.semantic.error;return h.text.muted}function O(t){const e=t?.["content-type"]||t?.["Content-Type"]||"";if(e.includes("json"))return"JSON";if(e.includes("xml"))return"XML";if(e.includes("html"))return"HTML";if(e.includes("text"))return"TEXT";if(e.includes("image"))return"IMG";if(e.includes("video"))return"VIDEO";if(e.includes("audio"))return"AUDIO";if(e.includes("form"))return"FORM";return null}function w(t){switch(t){case"fetch":return{backgroundColor:"rgba(74, 144, 226, 0.15)",color:"#4A90E2"};case"graphql":return{backgroundColor:"rgba(229, 53, 171, 0.15)",color:"#E535AB"};case"grpc-web":return{backgroundColor:"rgba(16, 185, 129, 0.15)",color:"#10B981"};case"xhr":return{backgroundColor:"rgba(245, 158, 11, 0.15)",color:"#F59E0B"};default:return{backgroundColor:"rgba(147, 51, 234, 0.15)",color:"#9333EA"}}}const j={GET:x.success,POST:x.primary,PUT:x.warning,PATCH:n.textSecondary,DELETE:x.error,HEAD:n.textTertiary,OPTIONS:x.primary};function H({method:t}){const e=j[t.toUpperCase()]||"#6B7280";return r("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",minWidth:45,boxSizing:"border-box",padding:"2px 6px",fontSize:11,fontWeight:700,color:e,backgroundColor:`${e}15`,border:`1px solid ${e}40`,borderRadius:4},children:t.toUpperCase()})}function U({type:t}){const e=n.textTertiary;return r("span",{style:{display:"inline-flex",alignItems:"center",padding:"2px 6px",fontSize:11,fontWeight:600,color:e,backgroundColor:`${e}15`,border:`1px solid ${e}40`,borderRadius:4},children:t})}function G({onPress:t,onLongPress:e,children:i,contentStyle:l}){const[s,c]=C(false);const d=T(null);const p=T(false);const f=()=>{if(d.current!=null){clearTimeout(d.current);d.current=null}};return r("div",{style:{margin:"4px 8px"},children:r("button",{type:"button",onPointerDown:()=>{c(true);if(e){p.current=false;f();d.current=setTimeout(()=>{p.current=true;e()},500)}},onPointerUp:()=>{c(false);f()},onPointerLeave:()=>{c(false);f()},onPointerCancel:()=>{c(false);f()},onClick:()=>{if(p.current){p.current=false;return}t()},style:{position:"relative",display:"flex",width:"100%",boxSizing:"border-box",backgroundColor:n.cardScrim,borderRadius:8,border:`1px solid ${n.border}`,borderBottom:`1px solid ${n.separator}`,padding:12,minHeight:44,margin:0,textAlign:"left",cursor:"pointer",fontFamily:"inherit",color:"inherit",userSelect:"none",WebkitUserSelect:"none",opacity:s?.8:1,...l},children:i})})}function V({event:t,isPending:e,statusColor:i}){if(e){return a("span",{style:o.pendingBadge,children:[r(D,{size:10,color:n.warning}),r("span",{style:o.pendingText,children:"..."})]})}if(t.error){return a("span",{style:o.errorBadge,children:[r(I,{size:10,color:n.danger}),r("span",{style:o.errorText,children:"ERR"})]})}return r("span",{style:o.statusBadge,children:r("span",{style:{...o.statusText,color:i},children:String(t.status)})})}function _({requestSize:t,responseSize:e}){if(!t&&!e)return null;return a("span",{style:o.sizeRow,children:[t?a("span",{style:o.sizeItem,children:[r(R,{size:8,color:n.info}),r("span",{style:o.sizeText,children:S(t)})]}):null,e?a("span",{style:o.sizeItem,children:[r(E,{size:8,color:n.accent}),r("span",{style:o.sizeText,children:S(e)})]}):null]})}function X({timestamp:t,duration:e}){const i=L();const l=W(t,i);return e?a("span",{style:o.bottomRightText,children:[P(e)," ",l]}):r("span",{style:o.bottomRightText,children:l})}export const NetworkEventItemCompact=k(function t({event:e,onPress:i,pinned:l=false,saved:s=false,overridden:c=false,onLongPress:d}){const p=N(e.status,e.error);const f=!e.status&&!e.error;const b=O(e.responseHeaders);let g=e.path||e.url.replace(/^https?:\/\/[^/]+/,"");if(e.requestClient==="graphql"){if(e.operationName){g=M(e.operationName,e.graphqlVariables)}else{g=g.replace(/\/graphql[^?]*/,"/graphql")}}else if(e.operationName){g=`${g}
|
|
2
|
+
(${e.operationName})`}return a(G,{onPress:()=>i(e),onLongPress:d?()=>d(e):void 0,contentStyle:{flexDirection:"row",alignItems:"center",borderLeft:`3px solid ${p}`},children:[a("span",{style:o.topRightContainer,children:[l?r(A,{size:10,active:true,color:n.info}):null,s?r(F,{size:10,color:n.accent}):null,c||e.override?r($,{size:10,color:n.warning}):null,r(V,{event:e,isPending:f,statusColor:p}),e.requestClient?r("span",{style:{...o.topRightBadge,backgroundColor:w(e.requestClient).backgroundColor},children:r("span",{style:{...o.clientText,color:w(e.requestClient).color},children:e.requestClient==="graphql"?"GQL":e.requestClient==="grpc-web"?"gRPC":e.requestClient==="xhr"?"XHR":e.requestClient})}):null]}),a("span",{style:o.leftSection,children:[r(H,{method:e.method}),r(_,{requestSize:e.requestSize,responseSize:e.responseSize})]}),r("span",{style:o.middleSection,children:r("span",{style:o.urlText,children:g})}),a("span",{style:o.rightSection,children:[b?r(U,{type:b}):null,r(z,{size:14,color:n.textTertiary})]}),r("span",{style:o.bottomRightContainer,children:r(X,{timestamp:e.timestamp,duration:e.duration})})]})});NetworkEventItemCompact.displayName="NetworkEventItemCompact";const o={leftSection:{display:"flex",flexDirection:"column",marginRight:8,alignItems:"flex-start"},topRightContainer:{position:"absolute",top:1,right:1,display:"flex",flexDirection:"row",alignItems:"center",gap:4},topRightBadge:{display:"inline-flex",padding:"2px 4px",borderRadius:4},middleSection:{flex:1,minWidth:0,display:"flex",flexDirection:"column",justifyContent:"center",paddingRight:8},urlText:{fontSize:12,color:n.text,lineHeight:"16px",fontFamily:"ui-monospace, Menlo, monospace",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",whiteSpace:"pre-wrap",wordBreak:"break-all"},rightSection:{display:"flex",flexDirection:"row",alignItems:"center",gap:6},bottomRightContainer:{position:"absolute",bottom:4,right:8},bottomRightText:{fontSize:9,color:n.textTertiary,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"pre"},statusBadge:{display:"inline-flex",padding:"1px 4px",borderRadius:3},statusText:{fontSize:10,fontWeight:600},pendingBadge:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2,padding:"1px 4px",backgroundColor:n.warningSoft,borderRadius:3},pendingText:{fontSize:10,color:n.warning,fontWeight:600},errorBadge:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2,padding:"1px 4px",backgroundColor:n.dangerSoft,borderRadius:3},errorText:{fontSize:10,color:n.danger,fontWeight:600},sizeRow:{display:"flex",flexDirection:"row",gap:4,marginTop:4},sizeItem:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:2},sizeText:{fontSize:8,color:n.textSecondary,fontFamily:"ui-monospace, Menlo, monospace"},clientText:{fontSize:8,fontWeight:700,letterSpacing:.3,textTransform:"uppercase"}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useEffect as
|
|
1
|
+
"use strict";import{useEffect as w,useRef as M,useState as E}from"react";import{useLimit as z}from"@buoy-gg/shared-ui";import{networkEventStore as v}from"../utils/networkEventStore";import{flagsForEventId as N,networkSavedStore as D,MAX_PINNED as k,MAX_SAVED as R}from"../utils/networkSavedStore";import{useNetworkSaved as S}from"../hooks/useNetworkSaved";import{useSelectedNetworkEventId as T}from"../hooks/useNetworkSelection";import{useNetworkBadgeCounts as F}from"../hooks/useNetworkBadgeCounts";import{useNetworkHasEvents as I,useNetworkHasMatches as V}from"../hooks/useNetworkHasMatches";import{generateNetworkCopyText as j}from"../utils/generateNetworkCopyText";import{applyIgnoredPatterns as L,filterNetworkEvents as $}from"../utils/filterNetworkEvents";import{jsx as e,jsxs as c,Fragment as q}from"react/jsx-runtime";const f={semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B"}};const o={buttonSurface:"rgba(8, 10, 14, 0.85)",border:"#1A1A1C",text:"#ECEDEE",textSecondary:"#9BA1A6",textTertiary:"#636366",accent:"#20C997",accentSoft:"rgba(32, 201, 151, 0.12)",accentBorderStrong:"rgba(32, 201, 151, 0.35)",onAccent:"#000000"};function p({size:t=14,color:r="currentColor",children:i}){return e("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",stroke:r,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:i})}const H=t=>c(p,{...t,children:[e("path",{d:"M21.801 10A10 10 0 1 1 17 3.335"}),e("path",{d:"m9 11 3 3L22 4"})]});const W=t=>c(p,{...t,children:[e("circle",{cx:"12",cy:"12",r:"10"}),e("path",{d:"m15 9-6 6"}),e("path",{d:"m9 9 6 6"})]});const _=t=>c(p,{...t,children:[e("circle",{cx:"12",cy:"12",r:"10"}),e("polyline",{points:"12 6 12 12 16 14"})]});const P=t=>c(p,{...t,children:[e("path",{d:"M3 6h18"}),e("path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"}),e("path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"}),e("line",{x1:"10",x2:"10",y1:"11",y2:"17"}),e("line",{x1:"14",x2:"14",y1:"11",y2:"17"})]});const A=t=>e(p,{...t,children:e("path",{d:"m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"})});const X=({active:t,...r})=>e(p,{...r,children:c("g",{transform:t?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[e("path",{d:"M2.97 21.03 8.18 15.82"}),e("path",{d:"M4.4 10.81 13.19 19.6"}),e("path",{d:"M5.17 10.54 11.43 8.83"}),e("path",{d:"M13.46 18.83 15.17 12.57"}),e("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});const B=t=>c(p,{...t,children:[e("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),e("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]});const O=t=>c(p,{...t,children:[e("circle",{cx:"12",cy:"12",r:"10"}),e("path",{d:"m9 12 2 2 4-4"})]});const U=t=>c(p,{...t,children:[e("path",{d:"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"}),e("path",{d:"M12 9v4"}),e("path",{d:"M12 17h.01"})]});export function NetworkHeaderBadges({activeStatus:t,onToggleStatus:r,ignoredPatterns:i,paused:u}){const s=F({ignoredPatterns:i,paused:u});return c("div",{style:n.headerChipRow,children:[c("button",{type:"button",style:{...n.headerChip,...t==="success"?n.headerChipActive:null},onClick:()=>r("success"),children:[e(H,{size:12,color:f.semantic.success}),e("span",{style:{...n.headerChipValue,color:f.semantic.success},children:s.successful})]}),c("button",{type:"button",style:{...n.headerChip,...t==="error"?n.headerChipActive:null},onClick:()=>r("error"),children:[e(W,{size:12,color:f.semantic.error}),e("span",{style:{...n.headerChipValue,color:f.semantic.error},children:s.failed})]}),c("button",{type:"button",style:{...n.headerChip,...t==="pending"?n.headerChipActive:null},onClick:()=>r("pending"),children:[e(_,{size:12,color:f.semantic.warning}),e("span",{style:{...n.headerChipValue,color:f.semantic.warning},children:s.pending})]})]})}export function NetworkClearButton({paused:t}){const r=I({paused:t});return e("button",{type:"button","aria-label":"Clear network requests",onClick:()=>v.clearEvents(),style:{...n.headerActionButton,...!r?n.headerActionButtonDisabled:null},disabled:!r,children:e(P,{size:14,color:r?o.textSecondary:o.textTertiary})})}export function NetworkSavedButton({onPress:t}){const{savedRecords:r}=S();const i=r.length;return c("button",{type:"button",onClick:t,"aria-label":"Saved requests",style:n.headerActionButton,children:[e(A,{size:14,color:i>0?o.accent:o.textSecondary}),i>0?e("span",{style:n.savedBadge,children:e("span",{style:n.savedBadgeText,children:i>99?"99+":i})}):null]})}export function NetworkDetailPinActions({isPro:t,onUpgradePress:r}){const i=T();const u=S();const{pinned:s,saved:b}=N(u,i);const l=z("network.saved");const d=!s&&u.pinnedEvents.length>=k;const a=!b&&u.savedRecords.length>=l;const g=()=>{if(!i)return null;return v.getEvents().find(h=>h.id===i)??D.getEventById(i)};const y=()=>{const h=g();if(h)u.togglePin(h)};const m=()=>{if(a&&!t){r();return}const h=g();if(h)u.toggleSave(h)};return c(q,{children:[e("button",{type:"button",onClick:y,disabled:d,"aria-label":s?"Unpin request":"Pin request",title:d?`Pin limit reached (${k})`:void 0,style:{...n.headerActionButton,...s?n.headerActionButtonActive:null,...d?n.headerActionButtonDisabled:null},children:e(X,{size:14,active:s,color:s?o.accent:d?o.textTertiary:o.textSecondary})}),e("button",{type:"button",onClick:m,disabled:a&&t,"aria-label":b?"Remove from saved":"Save request",title:a&&t?`Saved limit reached (${R})`:void 0,style:{...n.headerActionButton,...b?n.headerActionButtonSaved:null,...a&&t?n.headerActionButtonDisabled:null},children:e(A,{size:14,color:b?o.accent:a&&t?o.textTertiary:o.textSecondary})})]})}export function NetworkHeaderCopyButton({isPro:t,filter:r,ignoredPatterns:i,copySettings:u,paused:s,onUpgradePress:b,label:l}){const d=V({filter:r,ignoredPatterns:i,paused:s});const[a,g]=E("idle");const y=M(null);w(()=>()=>{if(y.current)clearTimeout(y.current)},[]);if(!t){return c("button",{type:"button",onClick:b,style:{...l?n.copyMenuRow:n.headerActionButton,...!d?n.headerActionButtonDisabled:null},disabled:!d,"aria-label":l??"Copy requests",children:[e(B,{size:14,color:d?o.textSecondary:o.textTertiary}),l?e("span",{style:n.copyMenuLabel,children:l}):null]})}const m=C=>{g(C);if(y.current)clearTimeout(y.current);y.current=setTimeout(()=>{g("idle");y.current=null},1500)};const h=async()=>{try{const C=j($(L(v.getEvents(),i),r),u);await navigator.clipboard.writeText(C);m("success")}catch{m("error")}};const x=a==="success"?f.semantic.success:a==="error"?f.semantic.error:d?o.textSecondary:o.textTertiary;return c("button",{type:"button",onClick:a==="idle"?h:void 0,style:{...l?n.copyMenuRow:n.headerActionButton,...!d?n.headerActionButtonDisabled:null},disabled:!d,"aria-label":a==="idle"?l??"Copy to clipboard":a==="success"?"Copied to clipboard":"Failed to copy",children:[a==="success"?e(O,{size:14,color:x}):a==="error"?e(U,{size:14,color:x}):e(B,{size:14,color:x}),l?e("span",{style:n.copyMenuLabel,children:l}):null]})}const n={copyMenuRow:{display:"flex",width:"100%",boxSizing:"border-box",flexDirection:"row",alignItems:"center",gap:10,padding:"11px 6px",justifyContent:"flex-start",background:"none",border:"none",cursor:"pointer",margin:0,fontFamily:"inherit",textAlign:"left"},copyMenuLabel:{fontSize:13,fontWeight:600,color:o.text},headerChipRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},headerChip:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:4,backgroundColor:o.buttonSurface,padding:"5px 10px",borderRadius:12,border:`1px solid ${o.border}`,cursor:"pointer",margin:0},headerChipActive:{backgroundColor:o.accentSoft,border:`1px solid ${o.accentBorderStrong}`},headerChipValue:{fontSize:12,fontWeight:600,fontFamily:"ui-monospace, Menlo, monospace"},headerActionButton:{position:"relative",display:"inline-flex",width:32,height:32,boxSizing:"border-box",borderRadius:8,backgroundColor:o.buttonSurface,border:`1px solid ${o.border}`,alignItems:"center",justifyContent:"center",cursor:"pointer",padding:0,margin:0},headerActionButtonDisabled:{opacity:.55,cursor:"default"},headerActionButtonActive:{backgroundColor:o.accentSoft,border:`1px solid ${o.accentBorderStrong}`},headerActionButtonSaved:{backgroundColor:o.accentSoft,border:`1px solid ${o.accentBorderStrong}`},savedBadge:{position:"absolute",top:-3,right:-3,minWidth:14,height:14,boxSizing:"border-box",padding:"0 3px",borderRadius:7,backgroundColor:o.accent,display:"inline-flex",alignItems:"center",justifyContent:"center"},savedBadgeText:{color:o.onAccent,fontSize:9,fontWeight:700,fontFamily:"ui-monospace, Menlo, monospace"}};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@buoy-gg/network",
|
|
3
|
-
"version": "7.0.
|
|
3
|
+
"version": "7.0.46",
|
|
4
4
|
"description": "In-app network inspector for React Native — requests, responses, timing & errors live, with GraphQL operation parsing. Part of Buoy devtools.",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
],
|
|
35
35
|
"sideEffects": false,
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@buoy-gg/shared-ui": "^7.0.
|
|
37
|
+
"@buoy-gg/shared-ui": "^7.0.46"
|
|
38
38
|
},
|
|
39
39
|
"peerDependencies": {
|
|
40
40
|
"react": "*"
|