@buoy-gg/network 7.0.45 → 7.0.47
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/NetworkFilterViewV3.js +1 -1
- package/lib/commonjs/network/components/NetworkFilterViewV3.web.js +1 -1
- package/lib/commonjs/network/components/NetworkModal.js +1 -1
- package/lib/module/network/components/NetworkFilterViewV3.js +1 -1
- package/lib/module/network/components/NetworkFilterViewV3.web.js +1 -1
- package/lib/module/network/components/NetworkModal.js +1 -1
- package/lib/typescript/network/components/NetworkFilterViewV3.d.ts +3 -1
- package/lib/typescript/network/components/NetworkFilterViewV3.web.d.ts +3 -1
- package/lib/web/index.mjs +52 -52
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkFilterViewV3=NetworkFilterViewV3;var _sharedUi=require("@buoy-gg/shared-ui");var _react=require("react");var _reactNative=require("react-native");var _jsxRuntime=require("react/jsx-runtime");function getContentType(n){const s=n.responseHeaders||n.requestHeaders;const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkFilterViewV3=NetworkFilterViewV3;var _sharedUi=require("@buoy-gg/shared-ui");var _react=require("react");var _reactNative=require("react-native");var _jsxRuntime=require("react/jsx-runtime");const noTeamPatterns=()=>false;function getContentType(n){const s=n.responseHeaders||n.requestHeaders;const a=s?.["content-type"]||s?.["Content-Type"]||"";if(a.includes("json"))return{type:"JSON",color:_sharedUi.macOSColors.semantic.info};if(a.includes("xml"))return{type:"XML",color:_sharedUi.macOSColors.semantic.success};if(a.includes("html"))return{type:"HTML",color:_sharedUi.macOSColors.semantic.warning};if(a.includes("text"))return{type:"TEXT",color:_sharedUi.macOSColors.semantic.success};if(a.includes("image"))return{type:"IMAGE",color:_sharedUi.macOSColors.semantic.error};if(a.includes("video"))return{type:"VIDEO",color:_sharedUi.macOSColors.semantic.error};if(a.includes("audio"))return{type:"AUDIO",color:_sharedUi.macOSColors.semantic.debug};if(a.includes("form"))return{type:"FORM",color:_sharedUi.macOSColors.semantic.info};return{type:"OTHER",color:_sharedUi.night.color.textTertiary}}function getContentTypeIcon(n){switch(n){case"JSON":return _sharedUi.FileJson;case"HTML":case"XML":case"TEXT":return _sharedUi.FileText;case"IMAGE":return _sharedUi.Image;case"VIDEO":return _sharedUi.Film;case"AUDIO":return _sharedUi.Music;default:return _sharedUi.Globe}}function getMethodColor(n){switch(n){case"GET":return _sharedUi.macOSColors.semantic.success;case"POST":return _sharedUi.macOSColors.semantic.info;case"PUT":return _sharedUi.macOSColors.semantic.warning;case"DELETE":return _sharedUi.macOSColors.semantic.error;case"PATCH":return _sharedUi.macOSColors.semantic.success;default:return _sharedUi.night.color.textTertiary}}function NetworkFilterViewV3({events:n,filter:s,onFilterChange:a,ignoredPatterns:d=[],onRemovePattern:g=()=>{},isTeamPattern:h=noTeamPatterns,onAddPattern:p=()=>{},onTogglePatternMode:y=()=>{}}){const[m,R]=(0,_react.useState)("contains");const T=(0,_react.useMemo)(()=>{const o=new Map;for(const e of d)o.set(e.value,e.mode);return o},[d]);const S=(0,_react.useMemo)(()=>new Set(d.map(o=>o.value)),[d]);const f=(0,_react.useCallback)(o=>{p({value:o,mode:m})},[p,m]);const x=(0,_react.useCallback)(o=>{if(h(o)){const c=_sharedUi.night.color.accent;return(0,_jsxRuntime.jsx)(_reactNative.View,{accessibilityLabel:"Set by your team on buoy.gg",style:[styles.modeBadge,{borderColor:`${c}60`,backgroundColor:`${c}15`}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.modeBadgeText,{color:c}],children:"TEAM"})})}const e=T.get(o)??"contains";const r=e==="exact";const t=r?_sharedUi.night.color.warning:_sharedUi.night.color.info;return(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{accessibilityRole:"button",accessibilityLabel:`Match mode: ${e}. Tap to toggle.`,onPress:()=>y(o),style:[styles.modeBadge,{borderColor:`${t}60`,backgroundColor:`${t}15`}],hitSlop:{top:6,bottom:6,left:6,right:6},children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.modeBadgeText,{color:t}],children:r?"EXACT":"CONTAINS"})})},[T,y,h]);const b=(0,_react.useCallback)(()=>{const o=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.modeToggleRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.modeToggleLabel,children:"Match:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.modeToggleGroup,children:o.map(e=>{const r=m===e.value;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{onPress:()=>R(e.value),style:[styles.modeToggleButton,r&&styles.modeToggleButtonActive],accessibilityRole:"button",accessibilityState:{selected:r},children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.modeToggleButtonText,r&&styles.modeToggleButtonTextActive],children:e.label}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.modeToggleButtonHint,children:e.hint})]},e.value)})})]})},[m]);const C=(0,_react.useMemo)(()=>{const o={all:n.length,success:0,error:0,pending:0};n.forEach(e=>{if(e.error||e.status&&e.status>=400){o.error+=1;return}if(e.status&&e.status>=200&&e.status<300){o.success+=1;return}if(!e.status&&!e.error){o.pending+=1}});return o},[n]);const O=(0,_react.useMemo)(()=>{return n.reduce((o,e)=>{if(!e.method)return o;o[e.method]=(o[e.method]||0)+1;return o},{})},[n]);const E=(0,_react.useMemo)(()=>{return n.reduce((o,e)=>{const{type:r}=getContentType(e);o[r]=(o[r]||0)+1;return o},{})},[n]);const M=(0,_react.useMemo)(()=>{const o=new Set;n.forEach(e=>{if(e.host){o.add(e.host);return}try{if(e.url){const r=new URL(e.url);const t=String(r.host||"");if(t)o.add(t)}}catch{}});return Array.from(o).filter(e=>e&&e!=="").sort((e,r)=>e.localeCompare(r))},[n]);const A=(0,_react.useMemo)(()=>{const o=new Set;n.forEach(e=>{if(!e.url)return;try{const r=new URL(e.url);const t=String(r.origin||"");const c=String(r.pathname||"");const i=`${t}${c}`;o.add(i)}catch{o.add(e.url)}});return Array.from(o).filter(e=>e&&e!=="").sort((e,r)=>e.localeCompare(r))},[n]);const w=(0,_react.useMemo)(()=>{const o=30;const e=M.slice(0,o);const r=A.slice(0,o);return[...e,...r]},[M,A]);const I=(0,_react.useCallback)((o,e)=>{const[r]=o.split("::");if(r==="status"){const t=e==="all"?void 0:e;a({...s,status:t});return}if(r==="method"){const t=String(e);const c=s.method||[];const i=c.includes(t);const l=i?c.filter(u=>u!==t):[t];a({...s,method:l.length>0?l:void 0});return}if(r==="contentType"){const t=String(e);const c=s.contentType||[];const i=c.includes(t);const l=i?c.filter(u=>u!==t):[t];a({...s,contentType:l.length>0?l:void 0})}},[s,a]);const L=(0,_react.useMemo)(()=>{const o=[];o.push({id:"status",title:"Status",type:"status",data:["all","success","error","pending"].map(t=>({id:`status::${t}`,label:t.charAt(0).toUpperCase()+t.slice(1),count:C[t],icon:t==="success"?_sharedUi.CheckCircle:t==="error"?_sharedUi.XCircle:t==="pending"?_sharedUi.Clock:_sharedUi.Globe,color:t==="success"?_sharedUi.macOSColors.semantic.success:t==="error"?_sharedUi.macOSColors.semantic.error:t==="pending"?_sharedUi.macOSColors.semantic.warning:_sharedUi.macOSColors.semantic.info,isActive:s.status===t||!s.status&&t==="all",value:t}))});const e=Object.entries(O);if(e.length>0){o.push({id:"method",title:"Method",type:"method",data:e.map(([t,c])=>({id:`method::${t}`,label:t,count:c,color:getMethodColor(t),isActive:s.method?.includes(t)??false,value:t}))})}const r=Object.entries(E);if(r.length>0){o.push({id:"contentType",title:"Content Type",type:"contentType",data:r.map(([t,c])=>{const i=n.find(u=>getContentType(u).type===t);const{color:l}=i?getContentType(i):{color:_sharedUi.night.color.textTertiary};return{id:`contentType::${t}`,label:t,count:c,icon:getContentTypeIcon(t),color:l,isActive:s.contentType?.includes(t)??false,value:t}})})}return o},[E,n,s.contentType,s.method,s.status,O,C]);const B=(0,_react.useMemo)(()=>({sections:L,addFilterSection:{enabled:true,placeholder:"Enter domain or URL pattern...",title:"ACTIVE FILTERS",icon:_sharedUi.Filter,renderExtra:b},availableItemsSection:{enabled:true,title:"AVAILABLE DOMAINS & URLS",emptyMessage:"No network events captured yet. Domains and URLs will appear here.",items:w},howItWorksSection:{enabled:true,title:"HOW NETWORK FILTERS WORK",description:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match.",examples:["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"],icon:_sharedUi.Filter},onFilterChange:I,onPatternAdd:f,onPatternToggle:g,activePatterns:S,renderPatternMeta:x}),[S,L,I,f,g,b,x,w]);return(0,_jsxRuntime.jsx)(_sharedUi.DynamicFilterView,{...B})}const styles=_reactNative.StyleSheet.create({modeBadge:{paddingHorizontal:8,paddingVertical:3,borderRadius:6,borderWidth:1},modeBadgeText:{fontSize:9,fontFamily:_sharedUi.monoFont,fontWeight:"700",letterSpacing:.5},modeToggleRow:{flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:"600",color:_sharedUi.night.color.textSecondary,fontFamily:_sharedUi.monoFont,letterSpacing:.3},modeToggleGroup:{flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,paddingVertical:6,paddingHorizontal:10,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,backgroundColor:_sharedUi.night.color.buttonSurface,alignItems:"center"},modeToggleButtonActive:{borderColor:_sharedUi.night.color.accentBorderStrong,backgroundColor:_sharedUi.night.color.accentSoft},modeToggleButtonText:{fontSize:11,fontWeight:"700",color:_sharedUi.night.color.textSecondary,fontFamily:_sharedUi.monoFont,letterSpacing:.3},modeToggleButtonTextActive:{color:_sharedUi.night.color.accent},modeToggleButtonHint:{fontSize:9,color:_sharedUi.night.color.textTertiary,marginTop:1}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkFilterViewV3=NetworkFilterViewV3;var _react=require("react");var _jsxRuntime=require("react/jsx-runtime");const buoyColors={base:"#121212",card:"#1A1A1A",hover:"#242424",input:"#2A2A2A",border:"#333333",text:"#E0E0E0",textSecondary:"#A0A0A0",textMuted:"#888888",primary:"#20C997"};const macOSColors={background:{hover:"#1D1D1F"},border:{default:"#2D2D2F"},text:{secondary:"#A1A1A6",muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6",debug:"#BF5AF2"}};function Svg({size:o=14,color:r="currentColor",children:i}){return(0,_jsxRuntime.jsx)("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:r,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:i})}const CheckCircle=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,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=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,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=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("polyline",{points:"12 6 12 12 16 14"})]});const Globe=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"}),(0,_jsxRuntime.jsx)("path",{d:"M2 12h20"})]});const FileJson=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),(0,_jsxRuntime.jsx)("path",{d:"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4"}),(0,_jsxRuntime.jsx)("path",{d:"M4 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"}),(0,_jsxRuntime.jsx)("path",{d:"M8 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"})]});const FileText=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),(0,_jsxRuntime.jsx)("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),(0,_jsxRuntime.jsx)("path",{d:"M10 9H8"}),(0,_jsxRuntime.jsx)("path",{d:"M16 13H8"}),(0,_jsxRuntime.jsx)("path",{d:"M16 17H8"})]});const ImageIcon=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2"}),(0,_jsxRuntime.jsx)("circle",{cx:"9",cy:"9",r:"2"}),(0,_jsxRuntime.jsx)("path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"})]});const Film=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),(0,_jsxRuntime.jsx)("path",{d:"M7 3v18"}),(0,_jsxRuntime.jsx)("path",{d:"M3 7.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M3 12h18"}),(0,_jsxRuntime.jsx)("path",{d:"M3 16.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M17 3v18"}),(0,_jsxRuntime.jsx)("path",{d:"M17 7.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M17 16.5h4"})]});const Music=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M9 18V5l12-2v13"}),(0,_jsxRuntime.jsx)("circle",{cx:"6",cy:"18",r:"3"}),(0,_jsxRuntime.jsx)("circle",{cx:"18",cy:"16",r:"3"})]});const Filter=o=>(0,_jsxRuntime.jsx)(Svg,{...o,children:(0,_jsxRuntime.jsx)("polygon",{points:"22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"})});const Plus=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M5 12h14"}),(0,_jsxRuntime.jsx)("path",{d:"M12 5v14"})]});const X=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M18 6 6 18"}),(0,_jsxRuntime.jsx)("path",{d:"m6 6 12 12"})]});function getContentType(o){const r=o.responseHeaders||o.requestHeaders;const i=r?.["content-type"]||r?.["Content-Type"]||"";if(i.includes("json"))return{type:"JSON",color:macOSColors.semantic.info};if(i.includes("xml"))return{type:"XML",color:macOSColors.semantic.success};if(i.includes("html"))return{type:"HTML",color:macOSColors.semantic.warning};if(i.includes("text"))return{type:"TEXT",color:macOSColors.semantic.success};if(i.includes("image"))return{type:"IMAGE",color:macOSColors.semantic.error};if(i.includes("video"))return{type:"VIDEO",color:macOSColors.semantic.error};if(i.includes("audio"))return{type:"AUDIO",color:macOSColors.semantic.debug};if(i.includes("form"))return{type:"FORM",color:macOSColors.semantic.info};return{type:"OTHER",color:macOSColors.text.muted}}function getContentTypeIcon(o){switch(o){case"JSON":return FileJson;case"HTML":case"XML":case"TEXT":return FileText;case"IMAGE":return ImageIcon;case"VIDEO":return Film;case"AUDIO":return Music;default:return Globe}}function getMethodColor(o){switch(o){case"GET":return macOSColors.semantic.success;case"POST":return macOSColors.semantic.info;case"PUT":return macOSColors.semantic.warning;case"DELETE":return macOSColors.semantic.error;case"PATCH":return macOSColors.semantic.success;default:return macOSColors.text.muted}}function SectionHeader({icon:o,iconColor:r,title:i,badgeCount:a,badgeColor:d}){return(0,_jsxRuntime.jsxs)("div",{style:styles.sectionHeader,children:[o?(0,_jsxRuntime.jsx)("span",{style:styles.sectionHeaderIcon,children:(0,_jsxRuntime.jsx)(o,{size:12,color:r??buoyColors.primary})}):null,(0,_jsxRuntime.jsx)("span",{style:styles.sectionHeaderTitle,children:i}),a!==void 0?(0,_jsxRuntime.jsx)("span",{style:{...styles.sectionHeaderBadge,backgroundColor:`${d??buoyColors.primary}15`,border:`1px solid ${d??buoyColors.primary}33`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.sectionHeaderBadgeText,color:d??buoyColors.primary},children:a})}):null]})}function AddFilterButton({onPress:o,color:r,label:i}){return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:o,style:{...styles.addButton,borderColor:`${r}40`},children:[(0,_jsxRuntime.jsx)(Plus,{size:14,color:r}),(0,_jsxRuntime.jsx)("span",{style:{...styles.addButtonText,color:r},children:i})]})}function AddFilterInput({value:o,onChange:r,onSubmit:i,onCancel:a,placeholder:d,color:c}){return(0,_jsxRuntime.jsxs)("div",{style:{...styles.inputContainer,borderColor:`${c}40`},children:[(0,_jsxRuntime.jsx)("input",{value:o,onChange:u=>r(u.target.value),onKeyDown:u=>{if(u.key==="Enter")i()},placeholder:d,style:{...styles.input,color:c},autoFocus:true,autoCorrect:"off",autoCapitalize:"none",autoComplete:"off",spellCheck:false}),(0,_jsxRuntime.jsxs)("div",{style:styles.inputButtons,children:[o.trim()?(0,_jsxRuntime.jsx)("button",{type:"button",onClick:i,style:{...styles.inlineAddButton,backgroundColor:`${c}15`,borderColor:`${c}40`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.inlineAddButtonText,color:c},children:"Add"})}):null,(0,_jsxRuntime.jsx)("button",{type:"button",onClick:a,style:styles.cancelButton,children:(0,_jsxRuntime.jsx)(X,{size:16,color:`${c}60`})})]})]})}function NetworkFilterViewV3({events:o,filter:r,onFilterChange:i,ignoredPatterns:a=[],onRemovePattern:d=()=>{},onAddPattern:c=()=>{},onTogglePatternMode:u=()=>{}}){const[h,I]=(0,_react.useState)("contains");const[k,g]=(0,_react.useState)(false);const[f,y]=(0,_react.useState)("");const B=(0,_react.useMemo)(()=>{const e=new Map;for(const t of a)e.set(t.value,t.mode);return e},[a]);const x=(0,_react.useMemo)(()=>a.map(e=>e.value),[a]);const b=(0,_react.useCallback)(e=>{c({value:e,mode:h})},[c,h]);const F=(0,_react.useCallback)(()=>{const e=f.trim();if(!e)return;b(e);y("");g(false)},[f,b]);const E=(0,_react.useMemo)(()=>{const e={all:o.length,success:0,error:0,pending:0};o.forEach(t=>{if(t.error||t.status&&t.status>=400){e.error+=1;return}if(t.status&&t.status>=200&&t.status<300){e.success+=1;return}if(!t.status&&!t.error){e.pending+=1}});return e},[o]);const R=(0,_react.useMemo)(()=>{return o.reduce((e,t)=>{if(!t.method)return e;e[t.method]=(e[t.method]||0)+1;return e},{})},[o]);const z=(0,_react.useMemo)(()=>{return o.reduce((e,t)=>{const{type:n}=getContentType(t);e[n]=(e[n]||0)+1;return e},{})},[o]);const S=(0,_react.useMemo)(()=>{const e=new Set;o.forEach(t=>{if(t.host){e.add(t.host);return}try{if(t.url){const n=new URL(t.url);const s=String(n.host||"");if(s)e.add(s)}}catch{}});return Array.from(e).filter(t=>t&&t!=="").sort((t,n)=>t.localeCompare(n))},[o]);const v=(0,_react.useMemo)(()=>{const e=new Set;o.forEach(t=>{if(!t.url)return;try{const n=new URL(t.url);const s=String(n.origin||"");const l=String(n.pathname||"");const p=`${s}${l}`;e.add(p)}catch{e.add(t.url)}});return Array.from(e).filter(t=>t&&t!=="").sort((t,n)=>t.localeCompare(n))},[o]);const w=(0,_react.useMemo)(()=>{const e=30;const t=S.slice(0,e);const n=v.slice(0,e);return[...t,...n]},[S,v]);const j=(0,_react.useMemo)(()=>w.filter(e=>!x.some(t=>e.includes(t))),[w,x]);const H=(0,_react.useCallback)((e,t)=>{const[n]=e.split("::");if(n==="status"){const s=t==="all"?void 0:t;i({...r,status:s});return}if(n==="method"){const s=String(t);const l=r.method||[];const p=l.includes(s);const m=p?l.filter(T=>T!==s):[s];i({...r,method:m.length>0?m:void 0});return}if(n==="contentType"){const s=String(t);const l=r.contentType||[];const p=l.includes(s);const m=p?l.filter(T=>T!==s):[s];i({...r,contentType:m.length>0?m:void 0})}},[r,i]);const C=e=>{const t=e.count===0;const n=!e.isMethod||e.icon;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>H(e.id,e.value),style:{...styles.filterCard,...e.isActive?styles.activeFilterCard:null},children:[e.icon?(0,_jsxRuntime.jsx)(e.icon,{size:24,color:e.color}):e.isMethod?(0,_jsxRuntime.jsx)("span",{style:{...styles.methodBadgeCompact,backgroundColor:`${e.color}20`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.methodTextCompact,color:e.color},children:e.label})}):null,(0,_jsxRuntime.jsx)("span",{style:t?styles.filterCountZero:styles.filterCountActive,children:e.count}),n?(0,_jsxRuntime.jsx)("span",{style:styles.filterLabelCompact,children:e.label}):null]},e.id)};const W=["all","success","error","pending"].map(e=>({id:`status::${e}`,label:e.charAt(0).toUpperCase()+e.slice(1),count:E[e],icon:e==="success"?CheckCircle:e==="error"?XCircle:e==="pending"?Clock:Globe,color:e==="success"?macOSColors.semantic.success:e==="error"?macOSColors.semantic.error:e==="pending"?macOSColors.semantic.warning:macOSColors.semantic.info,isActive:r.status===e||!r.status&&e==="all",value:e}));const M=Object.entries(R);const A=Object.entries(z);const D=()=>{const e=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return(0,_jsxRuntime.jsxs)("div",{style:styles.modeToggleRow,children:[(0,_jsxRuntime.jsx)("span",{style:styles.modeToggleLabel,children:"Match:"}),(0,_jsxRuntime.jsx)("div",{style:styles.modeToggleGroup,children:e.map(t=>{const n=h===t.value;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>I(t.value),"aria-pressed":n,style:{...styles.modeToggleButton,...n?styles.modeToggleButtonActive:null},children:[(0,_jsxRuntime.jsx)("span",{style:{...styles.modeToggleButtonText,...n?styles.modeToggleButtonTextActive:null},children:t.label}),(0,_jsxRuntime.jsx)("span",{style:styles.modeToggleButtonHint,children:t.hint})]},t.value)})})]})};const L=e=>{const t=B.get(e)??"contains";const n=t==="exact";const s=n?macOSColors.semantic.warning:macOSColors.semantic.info;return(0,_jsxRuntime.jsx)("button",{type:"button","aria-label":`Match mode: ${t}. Tap to toggle.`,onClick:l=>{l.stopPropagation();u(e)},style:{...styles.modeBadge,borderColor:`${s}60`,backgroundColor:`${s}15`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.modeBadgeText,color:s},children:n?"EXACT":"CONTAINS"})})};return(0,_jsxRuntime.jsx)("div",{style:styles.container,children:(0,_jsxRuntime.jsxs)("div",{style:styles.content,children:[(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Status"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:W.map(C)})]}),M.length>0?(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Method"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:M.map(([e,t])=>C({id:`method::${e}`,label:e,count:t,color:getMethodColor(e),isActive:r.method?.includes(e)??false,value:e,isMethod:true}))})]}):null,A.length>0?(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Content Type"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:A.map(([e,t])=>{const n=o.find(l=>getContentType(l).type===e);const{color:s}=n?getContentType(n):{color:macOSColors.text.muted};return C({id:`contentType::${e}`,label:e,count:t,icon:getContentTypeIcon(e),color:s,isActive:r.contentType?.includes(e)??false,value:e})})})]}):null,(0,_jsxRuntime.jsxs)("div",{style:styles.excludeFiltersSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Filter,iconColor:buoyColors.primary,title:"ACTIVE FILTERS",badgeCount:x.length>0?x.length:void 0,badgeColor:buoyColors.primary}),(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersDescription,children:"Hide queries matching these patterns from the list."}),(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersInputWrapper,children:!k?(0,_jsxRuntime.jsx)(AddFilterButton,{onPress:()=>g(true),color:buoyColors.primary,label:"Add exclude pattern"}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[D(),(0,_jsxRuntime.jsx)(AddFilterInput,{value:f,onChange:y,onSubmit:F,onCancel:()=>{g(false);y("")},placeholder:"Enter domain or URL pattern...",color:buoyColors.primary})]})}),x.length>0?(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersContent,children:(0,_jsxRuntime.jsx)("div",{style:styles.filterListColumn,children:x.map(e=>(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>d(e),style:styles.filterItemRow,children:[(0,_jsxRuntime.jsx)("span",{style:{...styles.filterItemText,color:buoyColors.primary},children:e}),(0,_jsxRuntime.jsx)("span",{style:styles.filterItemMeta,children:L(e)}),(0,_jsxRuntime.jsx)(X,{size:12,color:`${buoyColors.primary}80`})]},e))})}):null]}),(0,_jsxRuntime.jsxs)("div",{style:styles.availableKeysSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Plus,iconColor:buoyColors.primary,title:"AVAILABLE DOMAINS & URLS",badgeCount:j.length,badgeColor:buoyColors.primary}),(0,_jsxRuntime.jsx)("div",{style:styles.availableKeysScroll,children:j.length>0?j.map(e=>(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>b(e),style:styles.availableKeyItem,children:[(0,_jsxRuntime.jsx)("span",{style:styles.availableKeyText,children:e}),(0,_jsxRuntime.jsx)(Plus,{size:12,color:buoyColors.primary})]},e)):(0,_jsxRuntime.jsx)("div",{style:styles.emptyStateText,children:"No network events captured yet. Domains and URLs will appear here."})})]}),(0,_jsxRuntime.jsxs)("div",{style:styles.howItWorksSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Filter,iconColor:buoyColors.textSecondary,title:"HOW NETWORK FILTERS WORK"}),(0,_jsxRuntime.jsx)("div",{style:styles.howItWorksText,children:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match."}),(0,_jsxRuntime.jsxs)("div",{style:styles.examplesContainer,children:[(0,_jsxRuntime.jsx)("div",{style:styles.examplesTitle,children:"EXAMPLES:"}),["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"].map(e=>(0,_jsxRuntime.jsx)("div",{style:styles.exampleItem,children:e},e))]})]})]})})}const styles={container:{display:"flex",flexDirection:"column",flex:1,minHeight:0,backgroundColor:buoyColors.base},content:{flex:1,minHeight:0,overflowY:"auto",padding:"16px 16px 24px 16px"},section:{marginBottom:8},sectionHeader:{display:"flex",flexDirection:"row",alignItems:"center",padding:"8px 16px",backgroundColor:buoyColors.base,minHeight:40,boxSizing:"border-box"},sectionHeaderIcon:{display:"inline-flex",marginRight:8},sectionHeaderTitle:{flex:1,fontSize:14,fontWeight:600,color:buoyColors.text,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},sectionHeaderBadge:{display:"inline-flex",alignItems:"center",padding:"3px 8px",borderRadius:12,marginLeft:8},sectionHeaderBadgeText:{fontSize:12,fontWeight:600},filterGrid:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:8},filterCard:{display:"flex",backgroundColor:buoyColors.card,borderRadius:12,padding:"10px 8px",flexDirection:"column",alignItems:"center",justifyContent:"center",border:`1px solid ${buoyColors.border}`,width:72,minHeight:68,boxSizing:"border-box",cursor:"pointer",margin:0},activeFilterCard:{backgroundColor:`${buoyColors.primary}33`,border:`2px solid ${buoyColors.primary}`,boxShadow:`0 0 8px ${buoyColors.primary}4D`},filterCountActive:{fontSize:14,fontWeight:700,color:buoyColors.text,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1,textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.2)"},filterCountZero:{fontSize:11,fontWeight:500,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1},filterLabelCompact:{fontSize:10,color:buoyColors.text,fontWeight:600,textAlign:"center",textTransform:"capitalize",textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.3)"},methodBadgeCompact:{display:"inline-flex",padding:"4px 8px",borderRadius:5,minWidth:48,maxWidth:60,boxSizing:"border-box",alignItems:"center",justifyContent:"center"},methodTextCompact:{fontSize:13,fontWeight:700,letterSpacing:.3,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},excludeFiltersSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},excludeFiltersDescription:{fontSize:10,color:buoyColors.textSecondary,padding:"8px 16px 0 16px",lineHeight:"14px"},excludeFiltersInputWrapper:{padding:"8px 16px"},excludeFiltersContent:{padding:"0 16px 16px 16px",maxHeight:150,overflowY:"auto"},filterListColumn:{display:"flex",flexDirection:"column",gap:8},filterItemRow:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:buoyColors.hover,borderRadius:8,border:`1px solid ${buoyColors.border}`,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box",textAlign:"left"},filterItemText:{flex:1,fontSize:12,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},filterItemMeta:{display:"inline-flex",marginRight:8},modeBadge:{display:"inline-flex",padding:"3px 8px",borderRadius:6,borderWidth:1,borderStyle:"solid",background:"none",cursor:"pointer",margin:0},modeBadgeText:{fontSize:9,fontFamily:"ui-monospace, Menlo, monospace",fontWeight:700,letterSpacing:.5},modeToggleRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:600,color:macOSColors.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleGroup:{display:"flex",flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,display:"flex",flexDirection:"column",padding:"6px 10px",borderRadius:8,border:`1px solid ${macOSColors.border.default}`,backgroundColor:macOSColors.background.hover,alignItems:"center",cursor:"pointer",margin:0},modeToggleButtonActive:{border:`1px solid ${macOSColors.semantic.info}`,backgroundColor:`${macOSColors.semantic.info}22`},modeToggleButtonText:{fontSize:11,fontWeight:700,color:macOSColors.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleButtonTextActive:{color:macOSColors.semantic.info},modeToggleButtonHint:{fontSize:9,color:macOSColors.text.muted,marginTop:1},addButton:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",padding:"10px 14px",borderRadius:10,borderWidth:1,borderStyle:"dashed",backgroundColor:buoyColors.input,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box"},addButtonText:{fontSize:13,fontWeight:500,marginLeft:6},inputContainer:{display:"flex",flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:10,borderWidth:1,borderStyle:"solid",padding:"10px 14px",marginBottom:8,boxSizing:"border-box"},input:{flex:1,fontSize:13,padding:0,border:"none",outline:"none",background:"transparent",fontFamily:"inherit",minWidth:0},inputButtons:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},cancelButton:{display:"inline-flex",padding:4,borderRadius:6,backgroundColor:buoyColors.hover,border:"none",cursor:"pointer",margin:0},inlineAddButton:{display:"inline-flex",padding:"6px 12px",borderRadius:6,borderWidth:1,borderStyle:"solid",cursor:"pointer",margin:0},inlineAddButtonText:{fontSize:12,fontWeight:600},availableKeysSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},availableKeysScroll:{maxHeight:150,overflowY:"auto",padding:"8px 16px 16px 16px"},availableKeyItem:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:buoyColors.hover,borderRadius:8,border:`1px solid ${buoyColors.border}`,marginBottom:8,cursor:"pointer",width:"100%",boxSizing:"border-box",textAlign:"left"},availableKeyText:{flex:1,fontSize:11,color:buoyColors.text,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},emptyStateText:{fontSize:11,color:buoyColors.textMuted,fontStyle:"italic",textAlign:"center",padding:"12px 0"},howItWorksSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},howItWorksText:{fontSize:11,color:buoyColors.textSecondary,lineHeight:"16px",margin:"8px 0 12px 0",padding:"0 16px",fontFamily:"ui-monospace, Menlo, monospace"},examplesContainer:{padding:"8px 16px 16px 16px",borderTop:`1px solid ${buoyColors.border}`},examplesTitle:{fontSize:10,fontWeight:600,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",lineHeight:"16px"}};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkFilterViewV3=NetworkFilterViewV3;var _react=require("react");var _jsxRuntime=require("react/jsx-runtime");const buoyColors={base:"#121212",card:"#1A1A1A",hover:"#242424",input:"#2A2A2A",border:"#333333",text:"#E0E0E0",textSecondary:"#A0A0A0",textMuted:"#888888",primary:"#20C997"};const macOSColors={background:{hover:"#1D1D1F"},border:{default:"#2D2D2F"},text:{secondary:"#A1A1A6",muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6",debug:"#BF5AF2"}};function Svg({size:o=14,color:r="currentColor",children:i}){return(0,_jsxRuntime.jsx)("svg",{width:o,height:o,viewBox:"0 0 24 24",fill:"none",stroke:r,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:i})}const CheckCircle=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,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=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,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=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("polyline",{points:"12 6 12 12 16 14"})]});const Globe=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"}),(0,_jsxRuntime.jsx)("path",{d:"M2 12h20"})]});const FileJson=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),(0,_jsxRuntime.jsx)("path",{d:"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4"}),(0,_jsxRuntime.jsx)("path",{d:"M4 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"}),(0,_jsxRuntime.jsx)("path",{d:"M8 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"})]});const FileText=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),(0,_jsxRuntime.jsx)("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),(0,_jsxRuntime.jsx)("path",{d:"M10 9H8"}),(0,_jsxRuntime.jsx)("path",{d:"M16 13H8"}),(0,_jsxRuntime.jsx)("path",{d:"M16 17H8"})]});const ImageIcon=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2"}),(0,_jsxRuntime.jsx)("circle",{cx:"9",cy:"9",r:"2"}),(0,_jsxRuntime.jsx)("path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"})]});const Film=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),(0,_jsxRuntime.jsx)("path",{d:"M7 3v18"}),(0,_jsxRuntime.jsx)("path",{d:"M3 7.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M3 12h18"}),(0,_jsxRuntime.jsx)("path",{d:"M3 16.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M17 3v18"}),(0,_jsxRuntime.jsx)("path",{d:"M17 7.5h4"}),(0,_jsxRuntime.jsx)("path",{d:"M17 16.5h4"})]});const Music=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M9 18V5l12-2v13"}),(0,_jsxRuntime.jsx)("circle",{cx:"6",cy:"18",r:"3"}),(0,_jsxRuntime.jsx)("circle",{cx:"18",cy:"16",r:"3"})]});const Filter=o=>(0,_jsxRuntime.jsx)(Svg,{...o,children:(0,_jsxRuntime.jsx)("polygon",{points:"22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"})});const Plus=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M5 12h14"}),(0,_jsxRuntime.jsx)("path",{d:"M12 5v14"})]});const X=o=>(0,_jsxRuntime.jsxs)(Svg,{...o,children:[(0,_jsxRuntime.jsx)("path",{d:"M18 6 6 18"}),(0,_jsxRuntime.jsx)("path",{d:"m6 6 12 12"})]});function getContentType(o){const r=o.responseHeaders||o.requestHeaders;const i=r?.["content-type"]||r?.["Content-Type"]||"";if(i.includes("json"))return{type:"JSON",color:macOSColors.semantic.info};if(i.includes("xml"))return{type:"XML",color:macOSColors.semantic.success};if(i.includes("html"))return{type:"HTML",color:macOSColors.semantic.warning};if(i.includes("text"))return{type:"TEXT",color:macOSColors.semantic.success};if(i.includes("image"))return{type:"IMAGE",color:macOSColors.semantic.error};if(i.includes("video"))return{type:"VIDEO",color:macOSColors.semantic.error};if(i.includes("audio"))return{type:"AUDIO",color:macOSColors.semantic.debug};if(i.includes("form"))return{type:"FORM",color:macOSColors.semantic.info};return{type:"OTHER",color:macOSColors.text.muted}}function getContentTypeIcon(o){switch(o){case"JSON":return FileJson;case"HTML":case"XML":case"TEXT":return FileText;case"IMAGE":return ImageIcon;case"VIDEO":return Film;case"AUDIO":return Music;default:return Globe}}function getMethodColor(o){switch(o){case"GET":return macOSColors.semantic.success;case"POST":return macOSColors.semantic.info;case"PUT":return macOSColors.semantic.warning;case"DELETE":return macOSColors.semantic.error;case"PATCH":return macOSColors.semantic.success;default:return macOSColors.text.muted}}function SectionHeader({icon:o,iconColor:r,title:i,badgeCount:a,badgeColor:d}){return(0,_jsxRuntime.jsxs)("div",{style:styles.sectionHeader,children:[o?(0,_jsxRuntime.jsx)("span",{style:styles.sectionHeaderIcon,children:(0,_jsxRuntime.jsx)(o,{size:12,color:r??buoyColors.primary})}):null,(0,_jsxRuntime.jsx)("span",{style:styles.sectionHeaderTitle,children:i}),a!==void 0?(0,_jsxRuntime.jsx)("span",{style:{...styles.sectionHeaderBadge,backgroundColor:`${d??buoyColors.primary}15`,border:`1px solid ${d??buoyColors.primary}33`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.sectionHeaderBadgeText,color:d??buoyColors.primary},children:a})}):null]})}function AddFilterButton({onPress:o,color:r,label:i}){return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:o,style:{...styles.addButton,borderColor:`${r}40`},children:[(0,_jsxRuntime.jsx)(Plus,{size:14,color:r}),(0,_jsxRuntime.jsx)("span",{style:{...styles.addButtonText,color:r},children:i})]})}function AddFilterInput({value:o,onChange:r,onSubmit:i,onCancel:a,placeholder:d,color:c}){return(0,_jsxRuntime.jsxs)("div",{style:{...styles.inputContainer,borderColor:`${c}40`},children:[(0,_jsxRuntime.jsx)("input",{value:o,onChange:u=>r(u.target.value),onKeyDown:u=>{if(u.key==="Enter")i()},placeholder:d,style:{...styles.input,color:c},autoFocus:true,autoCorrect:"off",autoCapitalize:"none",autoComplete:"off",spellCheck:false}),(0,_jsxRuntime.jsxs)("div",{style:styles.inputButtons,children:[o.trim()?(0,_jsxRuntime.jsx)("button",{type:"button",onClick:i,style:{...styles.inlineAddButton,backgroundColor:`${c}15`,borderColor:`${c}40`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.inlineAddButtonText,color:c},children:"Add"})}):null,(0,_jsxRuntime.jsx)("button",{type:"button",onClick:a,style:styles.cancelButton,children:(0,_jsxRuntime.jsx)(X,{size:16,color:`${c}60`})})]})]})}function NetworkFilterViewV3({events:o,filter:r,onFilterChange:i,ignoredPatterns:a=[],onRemovePattern:d=()=>{},isTeamPattern:c=()=>false,onAddPattern:u=()=>{},onTogglePatternMode:I=()=>{}}){const[h,k]=(0,_react.useState)("contains");const[B,g]=(0,_react.useState)(false);const[f,y]=(0,_react.useState)("");const F=(0,_react.useMemo)(()=>{const e=new Map;for(const t of a)e.set(t.value,t.mode);return e},[a]);const x=(0,_react.useMemo)(()=>a.map(e=>e.value),[a]);const b=(0,_react.useCallback)(e=>{u({value:e,mode:h})},[u,h]);const E=(0,_react.useCallback)(()=>{const e=f.trim();if(!e)return;b(e);y("");g(false)},[f,b]);const R=(0,_react.useMemo)(()=>{const e={all:o.length,success:0,error:0,pending:0};o.forEach(t=>{if(t.error||t.status&&t.status>=400){e.error+=1;return}if(t.status&&t.status>=200&&t.status<300){e.success+=1;return}if(!t.status&&!t.error){e.pending+=1}});return e},[o]);const z=(0,_react.useMemo)(()=>{return o.reduce((e,t)=>{if(!t.method)return e;e[t.method]=(e[t.method]||0)+1;return e},{})},[o]);const H=(0,_react.useMemo)(()=>{return o.reduce((e,t)=>{const{type:n}=getContentType(t);e[n]=(e[n]||0)+1;return e},{})},[o]);const S=(0,_react.useMemo)(()=>{const e=new Set;o.forEach(t=>{if(t.host){e.add(t.host);return}try{if(t.url){const n=new URL(t.url);const s=String(n.host||"");if(s)e.add(s)}}catch{}});return Array.from(e).filter(t=>t&&t!=="").sort((t,n)=>t.localeCompare(n))},[o]);const v=(0,_react.useMemo)(()=>{const e=new Set;o.forEach(t=>{if(!t.url)return;try{const n=new URL(t.url);const s=String(n.origin||"");const l=String(n.pathname||"");const p=`${s}${l}`;e.add(p)}catch{e.add(t.url)}});return Array.from(e).filter(t=>t&&t!=="").sort((t,n)=>t.localeCompare(n))},[o]);const w=(0,_react.useMemo)(()=>{const e=30;const t=S.slice(0,e);const n=v.slice(0,e);return[...t,...n]},[S,v]);const j=(0,_react.useMemo)(()=>w.filter(e=>!x.some(t=>e.includes(t))),[w,x]);const W=(0,_react.useCallback)((e,t)=>{const[n]=e.split("::");if(n==="status"){const s=t==="all"?void 0:t;i({...r,status:s});return}if(n==="method"){const s=String(t);const l=r.method||[];const p=l.includes(s);const m=p?l.filter(T=>T!==s):[s];i({...r,method:m.length>0?m:void 0});return}if(n==="contentType"){const s=String(t);const l=r.contentType||[];const p=l.includes(s);const m=p?l.filter(T=>T!==s):[s];i({...r,contentType:m.length>0?m:void 0})}},[r,i]);const C=e=>{const t=e.count===0;const n=!e.isMethod||e.icon;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>W(e.id,e.value),style:{...styles.filterCard,...e.isActive?styles.activeFilterCard:null},children:[e.icon?(0,_jsxRuntime.jsx)(e.icon,{size:24,color:e.color}):e.isMethod?(0,_jsxRuntime.jsx)("span",{style:{...styles.methodBadgeCompact,backgroundColor:`${e.color}20`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.methodTextCompact,color:e.color},children:e.label})}):null,(0,_jsxRuntime.jsx)("span",{style:t?styles.filterCountZero:styles.filterCountActive,children:e.count}),n?(0,_jsxRuntime.jsx)("span",{style:styles.filterLabelCompact,children:e.label}):null]},e.id)};const $=["all","success","error","pending"].map(e=>({id:`status::${e}`,label:e.charAt(0).toUpperCase()+e.slice(1),count:R[e],icon:e==="success"?CheckCircle:e==="error"?XCircle:e==="pending"?Clock:Globe,color:e==="success"?macOSColors.semantic.success:e==="error"?macOSColors.semantic.error:e==="pending"?macOSColors.semantic.warning:macOSColors.semantic.info,isActive:r.status===e||!r.status&&e==="all",value:e}));const M=Object.entries(z);const A=Object.entries(H);const D=()=>{const e=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return(0,_jsxRuntime.jsxs)("div",{style:styles.modeToggleRow,children:[(0,_jsxRuntime.jsx)("span",{style:styles.modeToggleLabel,children:"Match:"}),(0,_jsxRuntime.jsx)("div",{style:styles.modeToggleGroup,children:e.map(t=>{const n=h===t.value;return(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>k(t.value),"aria-pressed":n,style:{...styles.modeToggleButton,...n?styles.modeToggleButtonActive:null},children:[(0,_jsxRuntime.jsx)("span",{style:{...styles.modeToggleButtonText,...n?styles.modeToggleButtonTextActive:null},children:t.label}),(0,_jsxRuntime.jsx)("span",{style:styles.modeToggleButtonHint,children:t.hint})]},t.value)})})]})};const L=e=>{if(c(e)){const l=macOSColors.semantic.success;return(0,_jsxRuntime.jsx)("span",{"aria-label":"Set by your team on buoy.gg",style:{...styles.modeBadge,borderColor:`${l}60`,backgroundColor:`${l}15`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.modeBadgeText,color:l},children:"TEAM"})})}const t=F.get(e)??"contains";const n=t==="exact";const s=n?macOSColors.semantic.warning:macOSColors.semantic.info;return(0,_jsxRuntime.jsx)("button",{type:"button","aria-label":`Match mode: ${t}. Tap to toggle.`,onClick:l=>{l.stopPropagation();I(e)},style:{...styles.modeBadge,borderColor:`${s}60`,backgroundColor:`${s}15`},children:(0,_jsxRuntime.jsx)("span",{style:{...styles.modeBadgeText,color:s},children:n?"EXACT":"CONTAINS"})})};return(0,_jsxRuntime.jsx)("div",{style:styles.container,children:(0,_jsxRuntime.jsxs)("div",{style:styles.content,children:[(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Status"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:$.map(C)})]}),M.length>0?(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Method"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:M.map(([e,t])=>C({id:`method::${e}`,label:e,count:t,color:getMethodColor(e),isActive:r.method?.includes(e)??false,value:e,isMethod:true}))})]}):null,A.length>0?(0,_jsxRuntime.jsxs)("div",{style:styles.section,children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"Content Type"}),(0,_jsxRuntime.jsx)("div",{style:styles.filterGrid,children:A.map(([e,t])=>{const n=o.find(l=>getContentType(l).type===e);const{color:s}=n?getContentType(n):{color:macOSColors.text.muted};return C({id:`contentType::${e}`,label:e,count:t,icon:getContentTypeIcon(e),color:s,isActive:r.contentType?.includes(e)??false,value:e})})})]}):null,(0,_jsxRuntime.jsxs)("div",{style:styles.excludeFiltersSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Filter,iconColor:buoyColors.primary,title:"ACTIVE FILTERS",badgeCount:x.length>0?x.length:void 0,badgeColor:buoyColors.primary}),(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersDescription,children:"Hide queries matching these patterns from the list."}),(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersInputWrapper,children:!B?(0,_jsxRuntime.jsx)(AddFilterButton,{onPress:()=>g(true),color:buoyColors.primary,label:"Add exclude pattern"}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[D(),(0,_jsxRuntime.jsx)(AddFilterInput,{value:f,onChange:y,onSubmit:E,onCancel:()=>{g(false);y("")},placeholder:"Enter domain or URL pattern...",color:buoyColors.primary})]})}),x.length>0?(0,_jsxRuntime.jsx)("div",{style:styles.excludeFiltersContent,children:(0,_jsxRuntime.jsx)("div",{style:styles.filterListColumn,children:x.map(e=>(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>d(e),style:styles.filterItemRow,children:[(0,_jsxRuntime.jsx)("span",{style:{...styles.filterItemText,color:buoyColors.primary},children:e}),(0,_jsxRuntime.jsx)("span",{style:styles.filterItemMeta,children:L(e)}),(0,_jsxRuntime.jsx)(X,{size:12,color:`${buoyColors.primary}80`})]},e))})}):null]}),(0,_jsxRuntime.jsxs)("div",{style:styles.availableKeysSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Plus,iconColor:buoyColors.primary,title:"AVAILABLE DOMAINS & URLS",badgeCount:j.length,badgeColor:buoyColors.primary}),(0,_jsxRuntime.jsx)("div",{style:styles.availableKeysScroll,children:j.length>0?j.map(e=>(0,_jsxRuntime.jsxs)("button",{type:"button",onClick:()=>b(e),style:styles.availableKeyItem,children:[(0,_jsxRuntime.jsx)("span",{style:styles.availableKeyText,children:e}),(0,_jsxRuntime.jsx)(Plus,{size:12,color:buoyColors.primary})]},e)):(0,_jsxRuntime.jsx)("div",{style:styles.emptyStateText,children:"No network events captured yet. Domains and URLs will appear here."})})]}),(0,_jsxRuntime.jsxs)("div",{style:styles.howItWorksSection,children:[(0,_jsxRuntime.jsx)(SectionHeader,{icon:Filter,iconColor:buoyColors.textSecondary,title:"HOW NETWORK FILTERS WORK"}),(0,_jsxRuntime.jsx)("div",{style:styles.howItWorksText,children:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match."}),(0,_jsxRuntime.jsxs)("div",{style:styles.examplesContainer,children:[(0,_jsxRuntime.jsx)("div",{style:styles.examplesTitle,children:"EXAMPLES:"}),["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"].map(e=>(0,_jsxRuntime.jsx)("div",{style:styles.exampleItem,children:e},e))]})]})]})})}const styles={container:{display:"flex",flexDirection:"column",flex:1,minHeight:0,backgroundColor:buoyColors.base},content:{flex:1,minHeight:0,overflowY:"auto",padding:"16px 16px 24px 16px"},section:{marginBottom:8},sectionHeader:{display:"flex",flexDirection:"row",alignItems:"center",padding:"8px 16px",backgroundColor:buoyColors.base,minHeight:40,boxSizing:"border-box"},sectionHeaderIcon:{display:"inline-flex",marginRight:8},sectionHeaderTitle:{flex:1,fontSize:14,fontWeight:600,color:buoyColors.text,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},sectionHeaderBadge:{display:"inline-flex",alignItems:"center",padding:"3px 8px",borderRadius:12,marginLeft:8},sectionHeaderBadgeText:{fontSize:12,fontWeight:600},filterGrid:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:8},filterCard:{display:"flex",backgroundColor:buoyColors.card,borderRadius:12,padding:"10px 8px",flexDirection:"column",alignItems:"center",justifyContent:"center",border:`1px solid ${buoyColors.border}`,width:72,minHeight:68,boxSizing:"border-box",cursor:"pointer",margin:0},activeFilterCard:{backgroundColor:`${buoyColors.primary}33`,border:`2px solid ${buoyColors.primary}`,boxShadow:`0 0 8px ${buoyColors.primary}4D`},filterCountActive:{fontSize:14,fontWeight:700,color:buoyColors.text,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1,textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.2)"},filterCountZero:{fontSize:11,fontWeight:500,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1},filterLabelCompact:{fontSize:10,color:buoyColors.text,fontWeight:600,textAlign:"center",textTransform:"capitalize",textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.3)"},methodBadgeCompact:{display:"inline-flex",padding:"4px 8px",borderRadius:5,minWidth:48,maxWidth:60,boxSizing:"border-box",alignItems:"center",justifyContent:"center"},methodTextCompact:{fontSize:13,fontWeight:700,letterSpacing:.3,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},excludeFiltersSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},excludeFiltersDescription:{fontSize:10,color:buoyColors.textSecondary,padding:"8px 16px 0 16px",lineHeight:"14px"},excludeFiltersInputWrapper:{padding:"8px 16px"},excludeFiltersContent:{padding:"0 16px 16px 16px",maxHeight:150,overflowY:"auto"},filterListColumn:{display:"flex",flexDirection:"column",gap:8},filterItemRow:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:buoyColors.hover,borderRadius:8,border:`1px solid ${buoyColors.border}`,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box",textAlign:"left"},filterItemText:{flex:1,fontSize:12,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},filterItemMeta:{display:"inline-flex",marginRight:8},modeBadge:{display:"inline-flex",padding:"3px 8px",borderRadius:6,borderWidth:1,borderStyle:"solid",background:"none",cursor:"pointer",margin:0},modeBadgeText:{fontSize:9,fontFamily:"ui-monospace, Menlo, monospace",fontWeight:700,letterSpacing:.5},modeToggleRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:600,color:macOSColors.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleGroup:{display:"flex",flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,display:"flex",flexDirection:"column",padding:"6px 10px",borderRadius:8,border:`1px solid ${macOSColors.border.default}`,backgroundColor:macOSColors.background.hover,alignItems:"center",cursor:"pointer",margin:0},modeToggleButtonActive:{border:`1px solid ${macOSColors.semantic.info}`,backgroundColor:`${macOSColors.semantic.info}22`},modeToggleButtonText:{fontSize:11,fontWeight:700,color:macOSColors.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleButtonTextActive:{color:macOSColors.semantic.info},modeToggleButtonHint:{fontSize:9,color:macOSColors.text.muted,marginTop:1},addButton:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",padding:"10px 14px",borderRadius:10,borderWidth:1,borderStyle:"dashed",backgroundColor:buoyColors.input,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box"},addButtonText:{fontSize:13,fontWeight:500,marginLeft:6},inputContainer:{display:"flex",flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:10,borderWidth:1,borderStyle:"solid",padding:"10px 14px",marginBottom:8,boxSizing:"border-box"},input:{flex:1,fontSize:13,padding:0,border:"none",outline:"none",background:"transparent",fontFamily:"inherit",minWidth:0},inputButtons:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},cancelButton:{display:"inline-flex",padding:4,borderRadius:6,backgroundColor:buoyColors.hover,border:"none",cursor:"pointer",margin:0},inlineAddButton:{display:"inline-flex",padding:"6px 12px",borderRadius:6,borderWidth:1,borderStyle:"solid",cursor:"pointer",margin:0},inlineAddButtonText:{fontSize:12,fontWeight:600},availableKeysSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},availableKeysScroll:{maxHeight:150,overflowY:"auto",padding:"8px 16px 16px 16px"},availableKeyItem:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:buoyColors.hover,borderRadius:8,border:`1px solid ${buoyColors.border}`,marginBottom:8,cursor:"pointer",width:"100%",boxSizing:"border-box",textAlign:"left"},availableKeyText:{flex:1,fontSize:11,color:buoyColors.text,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},emptyStateText:{fontSize:11,color:buoyColors.textMuted,fontStyle:"italic",textAlign:"center",padding:"12px 0"},howItWorksSection:{backgroundColor:buoyColors.card,borderRadius:16,border:`1px solid ${buoyColors.border}`,marginTop:16,overflow:"hidden"},howItWorksText:{fontSize:11,color:buoyColors.textSecondary,lineHeight:"16px",margin:"8px 0 12px 0",padding:"0 16px",fontFamily:"ui-monospace, Menlo, monospace"},examplesContainer:{padding:"8px 16px 16px 16px",borderTop:`1px solid ${buoyColors.border}`},examplesTitle:{fontSize:10,fontWeight:600,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:buoyColors.textMuted,fontFamily:"ui-monospace, Menlo, monospace",lineHeight:"16px"}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkModal=NetworkModal;exports.NetworkToolView=NetworkToolView;var _NetworkFloatingTool=require("../conditions/NetworkFloatingTool");var _react=require("react");var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _NetworkFilterViewV=require("./NetworkFilterViewV3");var _useTickEveryMinute=require("../hooks/useTickEveryMinute");var _NetworkEventDetailView=require("./NetworkEventDetailView");var _NetworkCopySettingsView=require("./NetworkCopySettingsView");var _NetworkHeaderLive=require("./NetworkHeaderLive");var _NetworkListScreen=require("./NetworkListScreen");var _NetworkSavedScreen=require("./NetworkSavedScreen");var _NetworkOverridesScreen=require("./NetworkOverridesScreen");var _NetworkOverridesButton=require("./NetworkOverridesButton");var _NetworkOverrideHeaderButton=require("./NetworkOverrideHeaderButton");var _NetworkHeaderMenu=require("./NetworkHeaderMenu");var _NetworkDetailStepper=require("./NetworkDetailStepper");var _useNetworkEventList=require("../hooks/useNetworkEventList");var _useLiveNetworkEvent=require("../hooks/useLiveNetworkEvent");var _useNetworkSelection=require("../hooks/useNetworkSelection");var _networkSelectionStore=require("../utils/networkSelectionStore");var _networkSavedStore=require("../utils/networkSavedStore");var _types=require("../overrides/types");var _jsxRuntime=require("react/jsx-runtime");function NetworkDetailScreen({visible:t,paused:i,ignoredPatternValues:l,onTogglePattern:d,isPro:S,filter:n,ignoredPatterns:c,fromSaved:u,savedSearch:g,applySafeAreaInset:s}){const x=(0,_useNetworkSelection.useSelectedNetworkEventId)();const M=(0,_useNetworkSelection.useNetworkBodyEventId)();const h=x!=null&&x===M;const r=(0,_useLiveNetworkEvent.useLiveNetworkEvent)(x,{paused:i||!t});(0,_react.useEffect)(()=>{if(t&&r&&h){_networkSelectionStore.networkSelectionStore.reportRendered(r.id)}},[t,r,h]);if(!t)return null;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailRoot,children:[r?(0,_jsxRuntime.jsx)(_NetworkEventDetailView.NetworkEventDetailView,{event:r,ignoredPatterns:l,onTogglePattern:d,showBodies:h}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.detailBodyFallback}),(0,_jsxRuntime.jsx)(_NetworkDetailStepper.NetworkDetailStepper,{paused:i,filter:n,ignoredPatterns:c,isPro:S,fromSaved:u,savedSearch:g,applySafeAreaInset:s})]})}function NetworkFilterScreen({visible:t,paused:i,isPro:l,filter:d,onFilterChange:S,ignoredPatterns:n,onRemovePattern:c,onAddPattern:u,onTogglePatternMode:g}){const{events:s}=(0,_useNetworkEventList.useNetworkEventList)({filter:d,ignoredPatterns:n,paused:i,visible:t,isPro:l});if(!t)return null;return(0,_jsxRuntime.jsx)(_NetworkFilterViewV.NetworkFilterViewV3,{events:s,filter:d,onFilterChange:S,ignoredPatterns:n,onRemovePattern:c,onAddPattern:u,onTogglePatternMode:g})}function NetworkCopyScreen({visible:t,paused:i,isPro:l,filter:d,ignoredPatterns:S,settings:n,onSettingsChange:c}){const{events:u}=(0,_useNetworkEventList.useNetworkEventList)({filter:d,ignoredPatterns:S,paused:i,visible:t,isPro:l});if(!t)return null;return(0,_jsxRuntime.jsx)(_NetworkCopySettingsView.NetworkCopySettingsView,{settings:n,onSettingsChange:c,events:u})}function NetworkModalInner({visible:t,onClose:i,onBack:l,onMinimize:d,enableSharedModalDimensions:S=false,inline:n=false,paused:c,onPausedChange:u,remoteConditions:g}){const{isPro:s}=(0,_sharedUi.useFeatureGate)();const[x,M]=(0,_react.useState)(false);const h=c!=null&&u!=null;const r=h?c:x;const Y=e=>{const o=typeof e==="function"?e(r):e;if(h)u(o);else M(o)};const[a,C]=(0,_react.useState)({});const v=(0,_useNetworkSelection.useHasNetworkSelection)();const[w,V]=(0,_react.useState)(false);const[j,B]=(0,_react.useState)(false);const[m,H]=(0,_react.useState)(false);const[A,p]=(0,_react.useState)(false);const[Q,Z]=(0,_react.useState)(0);const[N]=(0,_react.useState)(_NetworkFloatingTool.createRemoteConditionsSource);(0,_react.useEffect)(()=>{N.update(g)},[N,g]);(0,_react.useEffect)(()=>()=>N.update(void 0),[N]);const k=true;const[ee,R]=(0,_react.useState)(null);const[E,L]=(0,_react.useState)("filters");const[D,te]=(0,_react.useState)("");const[q,T]=(0,_react.useState)(false);const fe=(0,_react.useRef)(false);const[U,re]=(0,_react.useState)("");const oe=(0,_react.useRef)(null);const{patterns:f,values:se,add:ne,remove:ae,toggle:ie,toggleMode:le}=(0,_sharedUi.useIgnoredPatterns)();const[P,z]=(0,_react.useState)(_NetworkCopySettingsView.DEFAULT_COPY_SETTINGS);const I=(0,_react.useRef)(false);const[_,O]=(0,_react.useState)(false);const[y,de]=(0,_react.useState)("export");const b=e=>{de(e);O(true)};(0,_react.useEffect)(()=>{if(_&&s){O(false)}},[_,s]);(0,_react.useEffect)(()=>{if(!t||I.current)return;const e=async()=>{try{const o=await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.network.copyOptions());if(o){const ke=JSON.parse(o);z(ke)}}catch(o){}finally{I.current=true}};e()},[t]);(0,_react.useEffect)(()=>{if(!I.current)return;const e=async()=>{try{await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.network.copyOptions(),JSON.stringify(P))}catch(o){}};e()},[P]);const ce=()=>{_networkSelectionStore.networkSelectionStore.clear()};const K=(0,_react.useCallback)(e=>{_networkSelectionStore.networkSelectionStore.select(e.id)},[]);const ue=(0,_react.useCallback)((e,o)=>{R(o?{...e,id:o}:e);H(true);_networkSelectionStore.networkSelectionStore.clear()},[]);const ve=(0,_react.useCallback)(()=>R(null),[]);const W=(0,_react.useRef)(null);const J=e=>{te(e);C(o=>({...o,searchText:e}))};const Se=e=>{C(o=>({...o,status:o.status===e?void 0:e}))};const[$,ge]=(0,_react.useState)("bottomSheet");const we=e=>{ge(e)};(0,_react.useEffect)(()=>{if(q){requestAnimationFrame(()=>{oe.current?.focus()})}},[q]);const G=()=>{if(w){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>V(false)}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",noMargin:true,children:(0,_jsxRuntime.jsx)(_sharedUi.NightSegmented,{size:"sm",tabs:[{key:"filters",label:"Filters"},{key:"copy",label:"Copy"}],activeKey:E,onChange:e=>L(e)})})]})}if(v){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:ce}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Request Details",centered:true}),(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions,{children:[k?(0,_jsxRuntime.jsx)(_NetworkOverrideHeaderButton.NetworkOverrideHeaderButton,{onOpen:ue}):null,(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkDetailPinActions,{isPro:s,onUpgradePress:()=>b("saved")})]})]})}if(m&&k){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>{if(W.current?.())return;H(false);R(null)}}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Response Overrides",centered:true})]})}if(j){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>B(false)}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Saved Requests",centered:true})]})}return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[l&&(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:l}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",children:q?(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Search,{value:D,onChangeText:J,onCancel:()=>{J("");T(false)},onDismiss:()=>T(false),dismissOnBlur:true,clearOnlyWhenText:true,placeholder:"Search URL, method, operation, error...",accessibilityLabel:"Search network requests",iconSize:14,testID:"buoy-network-search-input",clearTestID:"buoy-network-search-clear",inputProps:{"sentry-label":"ignore network search header"}}):(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkHeaderBadges,{activeStatus:a.status,onToggleStatus:Se,ignoredPatterns:f,paused:r})}),(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions,{children:[(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{"sentry-label":"ignore open search",testID:"buoy-network-search-open",accessibilityLabel:"Open search",accessibilityRole:"button",onPress:()=>T(true),style:styles.headerActionButton,children:(0,_jsxRuntime.jsx)(_sharedUi.Search,{size:14,color:_sharedUi.night.color.textSecondary})}),k?(0,_jsxRuntime.jsx)(_NetworkOverridesButton.NetworkOverridesButton,{onPress:()=>H(true)}):null,(0,_jsxRuntime.jsx)(_sharedUi.PowerToggleButton,{isEnabled:!r,onToggle:()=>Y(e=>!e),accessibilityLabel:r?"Resume network capture":"Pause network capture",testID:"buoy-network-power"}),(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkClearButton,{paused:r}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuButton,{onPress:()=>p(e=>!e),isOpen:A,hasIndicator:F})]})]})};const F=!!(a.status||a.method||a.contentType);const he=S?_sharedUi.devToolsStorageKeys.modal.root():_sharedUi.devToolsStorageKeys.network.modal();if(!t)return null;const pe=v||!w;const X=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.container,children:[(0,_jsxRuntime.jsx)(NetworkDetailScreen,{visible:v,paused:r,ignoredPatternValues:se,onTogglePattern:ie,isPro:s,filter:a,ignoredPatterns:f,fromSaved:j,savedSearch:U,applySafeAreaInset:!n&&$==="bottomSheet"}),(0,_jsxRuntime.jsx)(NetworkFilterScreen,{visible:w&&E==="filters"&&!v,paused:r,isPro:s,filter:a,onFilterChange:C,ignoredPatterns:f,onRemovePattern:ae,onAddPattern:ne,onTogglePatternMode:le}),(0,_jsxRuntime.jsx)(NetworkCopyScreen,{visible:w&&E==="copy"&&!v,paused:r,isPro:s,filter:a,ignoredPatterns:f,settings:P,onSettingsChange:z}),(0,_jsxRuntime.jsx)(_NetworkOverridesScreen.NetworkOverridesScreen,{visible:k&&m&&!v&&!w,isPro:s,onUpgradePress:()=>b("overrides"),pendingDraft:ee,onPendingConsumed:ve,backHandlerRef:W,applySafeAreaInset:!n&&$==="bottomSheet"}),(0,_jsxRuntime.jsx)(_NetworkSavedScreen.NetworkSavedScreen,{visible:j&&!v&&!w&&!(m&&k),isPro:s,copySettings:P,search:U,onSearchChange:re,onEventPress:K,onUpgradePress:()=>b("saved")}),(0,_jsxRuntime.jsx)(_NetworkListScreen.NetworkListScreen,{visible:!v&&!w&&!j&&!(m&&k),paused:r,filter:a,ignoredPatterns:f,isPro:s,searchText:D,onEventPress:K,onUpgradePress:()=>b("export")})]}),A?(0,_jsxRuntime.jsxs)(_NetworkHeaderMenu.NetworkHeaderMenu,{onClose:()=>p(false),children:[(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Wifi,{size:14,color:_sharedUi.night.color.textSecondary}),label:"Network throttling",testID:"buoy-network-menu-throttling",onPress:()=>{p(false);(0,_NetworkFloatingTool.openNetworkFloatingTool)(g?N:void 0);if(!n)Z(e=>e+1)}}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Filter,{size:14,color:F?_sharedUi.night.color.accent:_sharedUi.night.color.textSecondary}),label:"Filters",detail:F?"Active":void 0,onPress:()=>{p(false);L("filters");V(true)}}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Bookmark,{size:14,color:_sharedUi.night.color.textSecondary}),label:"Saved requests",onPress:()=>{p(false);B(true)}}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.menuCopyRow,children:(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkHeaderCopyButton,{isPro:s,filter:a,ignoredPatterns:f,copySettings:P,paused:r,onUpgradePress:()=>{p(false);b("export")},label:"Copy requests"})})]}):null,(0,_jsxRuntime.jsx)(_sharedUi.UpgradeModal,{visible:_,onClose:()=>O(false),featureName:y==="saved"?"Saved Requests":y==="overrides"?"Response Overrides":"Network Export",description:y==="saved"?"Keep the requests that matter. Saved requests survive Clear, app restarts, and the 500-request history cap.":y==="overrides"?"Force any endpoint to fail, stall or return something else \u2014 no backend changes, no code changes. Free keeps one active rule.":"Export network requests to share with your team, debug APIs, or feed into AI tools.",benefits:y==="overrides"?[`Run ${_types.MAX_RULES} rules at once (free keeps ${_types.FREE_TIER_RULE_LIMIT})`,"Force a 500, a 401 or an empty list in one tap","Simulate offline, timeouts and slow connections","Rules survive an app reload, so you can test the boot path"]:y==="saved"?[`Save up to ${_networkSavedStore.MAX_SAVED} requests (free keeps ${_networkSavedStore.FREE_TIER_SAVED_LIMIT})`,"Failed requests stay put through a Clear","Snapshots survive an app restart","Export saved requests to teammates or AI assistants"]:["Export to JSON, Markdown, or plain text","Customizable copy presets (URLs only, LLM-ready, full data)","Share request details with teammates","Feed network data directly to AI assistants"]})]});if(n){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.inlineRoot,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.inlineHeader,..._sharedUi.windowDragProps,children:G()}),X]})}return(0,_jsxRuntime.jsx)(_sharedUi.JsModal,{visible:t,onClose:i,onMinimize:d,minimizeRequest:Q,persistenceKey:he,variant:"night",header:{showToggleButton:true,customContent:G()},onModeChange:we,enablePersistence:true,initialMode:"bottomSheet",enableGlitchEffects:true,disableScrollWrapper:pe,styles:{},children:X})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:"transparent"},detailRoot:{flex:1,minHeight:0},detailBodyFallback:{flex:1},inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:_sharedUi.macOSColors.border.default,backgroundColor:"transparent"},menuCopyRow:{paddingHorizontal:6},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:_sharedUi.night.color.buttonSurface,borderWidth:1,borderColor:_sharedUi.night.color.border,alignItems:"center",justifyContent:"center"},activeFilterButton:{backgroundColor:_sharedUi.night.color.accentSoft,borderColor:_sharedUi.night.color.accentBorderStrong}});function NetworkModal(t){return(0,_jsxRuntime.jsx)(_useTickEveryMinute.TickProvider,{children:(0,_jsxRuntime.jsx)(NetworkModalInner,{...t})})}function NetworkToolView(t={}){return(0,_jsxRuntime.jsx)(_useTickEveryMinute.TickProvider,{children:(0,_jsxRuntime.jsx)(NetworkModalInner,{...t,inline:true,visible:true,onClose:noop})})}const noop=()=>{};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkModal=NetworkModal;exports.NetworkToolView=NetworkToolView;var _NetworkFloatingTool=require("../conditions/NetworkFloatingTool");var _react=require("react");var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _NetworkFilterViewV=require("./NetworkFilterViewV3");var _useTickEveryMinute=require("../hooks/useTickEveryMinute");var _NetworkEventDetailView=require("./NetworkEventDetailView");var _NetworkCopySettingsView=require("./NetworkCopySettingsView");var _NetworkHeaderLive=require("./NetworkHeaderLive");var _NetworkListScreen=require("./NetworkListScreen");var _NetworkSavedScreen=require("./NetworkSavedScreen");var _NetworkOverridesScreen=require("./NetworkOverridesScreen");var _NetworkOverridesButton=require("./NetworkOverridesButton");var _NetworkOverrideHeaderButton=require("./NetworkOverrideHeaderButton");var _NetworkHeaderMenu=require("./NetworkHeaderMenu");var _NetworkDetailStepper=require("./NetworkDetailStepper");var _useNetworkEventList=require("../hooks/useNetworkEventList");var _useLiveNetworkEvent=require("../hooks/useLiveNetworkEvent");var _useNetworkSelection=require("../hooks/useNetworkSelection");var _networkSelectionStore=require("../utils/networkSelectionStore");var _networkSavedStore=require("../utils/networkSavedStore");var _types=require("../overrides/types");var _jsxRuntime=require("react/jsx-runtime");function NetworkDetailScreen({visible:t,paused:i,ignoredPatternValues:l,onTogglePattern:d,isPro:S,filter:n,ignoredPatterns:c,fromSaved:u,savedSearch:g,applySafeAreaInset:s}){const w=(0,_useNetworkSelection.useSelectedNetworkEventId)();const M=(0,_useNetworkSelection.useNetworkBodyEventId)();const p=w!=null&&w===M;const r=(0,_useLiveNetworkEvent.useLiveNetworkEvent)(w,{paused:i||!t});(0,_react.useEffect)(()=>{if(t&&r&&p){_networkSelectionStore.networkSelectionStore.reportRendered(r.id)}},[t,r,p]);if(!t)return null;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailRoot,children:[r?(0,_jsxRuntime.jsx)(_NetworkEventDetailView.NetworkEventDetailView,{event:r,ignoredPatterns:l,onTogglePattern:d,showBodies:p}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.detailBodyFallback}),(0,_jsxRuntime.jsx)(_NetworkDetailStepper.NetworkDetailStepper,{paused:i,filter:n,ignoredPatterns:c,isPro:S,fromSaved:u,savedSearch:g,applySafeAreaInset:s})]})}function NetworkFilterScreen({visible:t,paused:i,isPro:l,filter:d,onFilterChange:S,ignoredPatterns:n,onRemovePattern:c,onAddPattern:u,onTogglePatternMode:g,isTeamPattern:s}){const{events:w}=(0,_useNetworkEventList.useNetworkEventList)({filter:d,ignoredPatterns:n,paused:i,visible:t,isPro:l});if(!t)return null;return(0,_jsxRuntime.jsx)(_NetworkFilterViewV.NetworkFilterViewV3,{events:w,filter:d,onFilterChange:S,ignoredPatterns:n,onRemovePattern:c,onAddPattern:u,onTogglePatternMode:g,isTeamPattern:s})}function NetworkCopyScreen({visible:t,paused:i,isPro:l,filter:d,ignoredPatterns:S,settings:n,onSettingsChange:c}){const{events:u}=(0,_useNetworkEventList.useNetworkEventList)({filter:d,ignoredPatterns:S,paused:i,visible:t,isPro:l});if(!t)return null;return(0,_jsxRuntime.jsx)(_NetworkCopySettingsView.NetworkCopySettingsView,{settings:n,onSettingsChange:c,events:u})}function NetworkModalInner({visible:t,onClose:i,onBack:l,onMinimize:d,enableSharedModalDimensions:S=false,inline:n=false,paused:c,onPausedChange:u,remoteConditions:g}){const{isPro:s}=(0,_sharedUi.useFeatureGate)();const[w,M]=(0,_react.useState)(false);const p=c!=null&&u!=null;const r=p?c:w;const Y=e=>{const o=typeof e==="function"?e(r):e;if(p)u(o);else M(o)};const[a,C]=(0,_react.useState)({});const v=(0,_useNetworkSelection.useHasNetworkSelection)();const[h,V]=(0,_react.useState)(false);const[b,B]=(0,_react.useState)(false);const[j,H]=(0,_react.useState)(false);const[A,k]=(0,_react.useState)(false);const[Q,Z]=(0,_react.useState)(0);const[N]=(0,_react.useState)(_NetworkFloatingTool.createRemoteConditionsSource);(0,_react.useEffect)(()=>{N.update(g)},[N,g]);(0,_react.useEffect)(()=>()=>N.update(void 0),[N]);const f=true;const[ee,R]=(0,_react.useState)(null);const[T,L]=(0,_react.useState)("filters");const[D,te]=(0,_react.useState)("");const[E,q]=(0,_react.useState)(false);const ye=(0,_react.useRef)(false);const[U,re]=(0,_react.useState)("");const oe=(0,_react.useRef)(null);const{patterns:y,values:se,add:ne,remove:ae,toggle:ie,toggleMode:le,isTeamOnly:de}=(0,_sharedUi.useIgnoredPatterns)();const[P,z]=(0,_react.useState)(_NetworkCopySettingsView.DEFAULT_COPY_SETTINGS);const I=(0,_react.useRef)(false);const[_,O]=(0,_react.useState)(false);const[x,ce]=(0,_react.useState)("export");const m=e=>{ce(e);O(true)};(0,_react.useEffect)(()=>{if(_&&s){O(false)}},[_,s]);(0,_react.useEffect)(()=>{if(!t||I.current)return;const e=async()=>{try{const o=await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.network.copyOptions());if(o){const fe=JSON.parse(o);z(fe)}}catch(o){}finally{I.current=true}};e()},[t]);(0,_react.useEffect)(()=>{if(!I.current)return;const e=async()=>{try{await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.network.copyOptions(),JSON.stringify(P))}catch(o){}};e()},[P]);const ue=()=>{_networkSelectionStore.networkSelectionStore.clear()};const K=(0,_react.useCallback)(e=>{_networkSelectionStore.networkSelectionStore.select(e.id)},[]);const ve=(0,_react.useCallback)((e,o)=>{R(o?{...e,id:o}:e);H(true);_networkSelectionStore.networkSelectionStore.clear()},[]);const Se=(0,_react.useCallback)(()=>R(null),[]);const W=(0,_react.useRef)(null);const J=e=>{te(e);C(o=>({...o,searchText:e}))};const ge=e=>{C(o=>({...o,status:o.status===e?void 0:e}))};const[$,we]=(0,_react.useState)("bottomSheet");const he=e=>{we(e)};(0,_react.useEffect)(()=>{if(E){requestAnimationFrame(()=>{oe.current?.focus()})}},[E]);const G=()=>{if(h){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>V(false)}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",noMargin:true,children:(0,_jsxRuntime.jsx)(_sharedUi.NightSegmented,{size:"sm",tabs:[{key:"filters",label:"Filters"},{key:"copy",label:"Copy"}],activeKey:T,onChange:e=>L(e)})})]})}if(v){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:ue}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Request Details",centered:true}),(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions,{children:[f?(0,_jsxRuntime.jsx)(_NetworkOverrideHeaderButton.NetworkOverrideHeaderButton,{onOpen:ve}):null,(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkDetailPinActions,{isPro:s,onUpgradePress:()=>m("saved")})]})]})}if(j&&f){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>{if(W.current?.())return;H(false);R(null)}}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Response Overrides",centered:true})]})}if(b){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:()=>B(false)}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Saved Requests",centered:true})]})}return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[l&&(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:l}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",children:E?(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Search,{value:D,onChangeText:J,onCancel:()=>{J("");q(false)},onDismiss:()=>q(false),dismissOnBlur:true,clearOnlyWhenText:true,placeholder:"Search URL, method, operation, error...",accessibilityLabel:"Search network requests",iconSize:14,testID:"buoy-network-search-input",clearTestID:"buoy-network-search-clear",inputProps:{"sentry-label":"ignore network search header"}}):(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkHeaderBadges,{activeStatus:a.status,onToggleStatus:ge,ignoredPatterns:y,paused:r})}),(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions,{children:[(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{"sentry-label":"ignore open search",testID:"buoy-network-search-open",accessibilityLabel:"Open search",accessibilityRole:"button",onPress:()=>q(true),style:styles.headerActionButton,children:(0,_jsxRuntime.jsx)(_sharedUi.Search,{size:14,color:_sharedUi.night.color.textSecondary})}),f?(0,_jsxRuntime.jsx)(_NetworkOverridesButton.NetworkOverridesButton,{onPress:()=>H(true)}):null,(0,_jsxRuntime.jsx)(_sharedUi.PowerToggleButton,{isEnabled:!r,onToggle:()=>Y(e=>!e),accessibilityLabel:r?"Resume network capture":"Pause network capture",testID:"buoy-network-power"}),(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkClearButton,{paused:r}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuButton,{onPress:()=>k(e=>!e),isOpen:A,hasIndicator:F})]})]})};const F=!!(a.status||a.method||a.contentType);const pe=S?_sharedUi.devToolsStorageKeys.modal.root():_sharedUi.devToolsStorageKeys.network.modal();if(!t)return null;const ke=v||!h;const X=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.container,children:[(0,_jsxRuntime.jsx)(NetworkDetailScreen,{visible:v,paused:r,ignoredPatternValues:se,onTogglePattern:ie,isPro:s,filter:a,ignoredPatterns:y,fromSaved:b,savedSearch:U,applySafeAreaInset:!n&&$==="bottomSheet"}),(0,_jsxRuntime.jsx)(NetworkFilterScreen,{visible:h&&T==="filters"&&!v,paused:r,isPro:s,filter:a,onFilterChange:C,ignoredPatterns:y,onRemovePattern:ae,onAddPattern:ne,onTogglePatternMode:le,isTeamPattern:de}),(0,_jsxRuntime.jsx)(NetworkCopyScreen,{visible:h&&T==="copy"&&!v,paused:r,isPro:s,filter:a,ignoredPatterns:y,settings:P,onSettingsChange:z}),(0,_jsxRuntime.jsx)(_NetworkOverridesScreen.NetworkOverridesScreen,{visible:f&&j&&!v&&!h,isPro:s,onUpgradePress:()=>m("overrides"),pendingDraft:ee,onPendingConsumed:Se,backHandlerRef:W,applySafeAreaInset:!n&&$==="bottomSheet"}),(0,_jsxRuntime.jsx)(_NetworkSavedScreen.NetworkSavedScreen,{visible:b&&!v&&!h&&!(j&&f),isPro:s,copySettings:P,search:U,onSearchChange:re,onEventPress:K,onUpgradePress:()=>m("saved")}),(0,_jsxRuntime.jsx)(_NetworkListScreen.NetworkListScreen,{visible:!v&&!h&&!b&&!(j&&f),paused:r,filter:a,ignoredPatterns:y,isPro:s,searchText:D,onEventPress:K,onUpgradePress:()=>m("export")})]}),A?(0,_jsxRuntime.jsxs)(_NetworkHeaderMenu.NetworkHeaderMenu,{onClose:()=>k(false),children:[(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Wifi,{size:14,color:_sharedUi.night.color.textSecondary}),label:"Network throttling",testID:"buoy-network-menu-throttling",onPress:()=>{k(false);(0,_NetworkFloatingTool.openNetworkFloatingTool)(g?N:void 0);if(!n)Z(e=>e+1)}}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Filter,{size:14,color:F?_sharedUi.night.color.accent:_sharedUi.night.color.textSecondary}),label:"Filters",detail:F?"Active":void 0,onPress:()=>{k(false);L("filters");V(true)}}),(0,_jsxRuntime.jsx)(_NetworkHeaderMenu.NetworkHeaderMenuItem,{icon:(0,_jsxRuntime.jsx)(_sharedUi.Bookmark,{size:14,color:_sharedUi.night.color.textSecondary}),label:"Saved requests",onPress:()=>{k(false);B(true)}}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.menuCopyRow,children:(0,_jsxRuntime.jsx)(_NetworkHeaderLive.NetworkHeaderCopyButton,{isPro:s,filter:a,ignoredPatterns:y,copySettings:P,paused:r,onUpgradePress:()=>{k(false);m("export")},label:"Copy requests"})})]}):null,(0,_jsxRuntime.jsx)(_sharedUi.UpgradeModal,{visible:_,onClose:()=>O(false),featureName:x==="saved"?"Saved Requests":x==="overrides"?"Response Overrides":"Network Export",description:x==="saved"?"Keep the requests that matter. Saved requests survive Clear, app restarts, and the 500-request history cap.":x==="overrides"?"Force any endpoint to fail, stall or return something else \u2014 no backend changes, no code changes. Free keeps one active rule.":"Export network requests to share with your team, debug APIs, or feed into AI tools.",benefits:x==="overrides"?[`Run ${_types.MAX_RULES} rules at once (free keeps ${_types.FREE_TIER_RULE_LIMIT})`,"Force a 500, a 401 or an empty list in one tap","Simulate offline, timeouts and slow connections","Rules survive an app reload, so you can test the boot path"]:x==="saved"?[`Save up to ${_networkSavedStore.MAX_SAVED} requests (free keeps ${_networkSavedStore.FREE_TIER_SAVED_LIMIT})`,"Failed requests stay put through a Clear","Snapshots survive an app restart","Export saved requests to teammates or AI assistants"]:["Export to JSON, Markdown, or plain text","Customizable copy presets (URLs only, LLM-ready, full data)","Share request details with teammates","Feed network data directly to AI assistants"]})]});if(n){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.inlineRoot,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.inlineHeader,..._sharedUi.windowDragProps,children:G()}),X]})}return(0,_jsxRuntime.jsx)(_sharedUi.JsModal,{visible:t,onClose:i,onMinimize:d,minimizeRequest:Q,persistenceKey:pe,variant:"night",header:{showToggleButton:true,customContent:G()},onModeChange:he,enablePersistence:true,initialMode:"bottomSheet",enableGlitchEffects:true,disableScrollWrapper:ke,styles:{},children:X})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:"transparent"},detailRoot:{flex:1,minHeight:0},detailBodyFallback:{flex:1},inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:_sharedUi.macOSColors.border.default,backgroundColor:"transparent"},menuCopyRow:{paddingHorizontal:6},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:_sharedUi.night.color.buttonSurface,borderWidth:1,borderColor:_sharedUi.night.color.border,alignItems:"center",justifyContent:"center"},activeFilterButton:{backgroundColor:_sharedUi.night.color.accentSoft,borderColor:_sharedUi.night.color.accentBorderStrong}});function NetworkModal(t){return(0,_jsxRuntime.jsx)(_useTickEveryMinute.TickProvider,{children:(0,_jsxRuntime.jsx)(NetworkModalInner,{...t})})}function NetworkToolView(t={}){return(0,_jsxRuntime.jsx)(_useTickEveryMinute.TickProvider,{children:(0,_jsxRuntime.jsx)(NetworkModalInner,{...t,inline:true,visible:true,onClose:noop})})}const noop=()=>{};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{CheckCircle as
|
|
1
|
+
"use strict";import{CheckCircle as q,Clock as v,DynamicFilterView as J,Film as K,FileJson as _,FileText as Q,Filter as P,Globe as W,Image as Y,macOSColors as c,night as a,Music as Z,XCircle as ee,monoFont as S}from"@buoy-gg/shared-ui";import{useCallback as b,useMemo as u,useState as te}from"react";import{StyleSheet as oe,Text as y,TouchableOpacity as X,View as x}from"react-native";import{jsx as m,jsxs as j}from"react/jsx-runtime";const ne=()=>false;function C(r){const s=r.responseHeaders||r.requestHeaders;const l=s?.["content-type"]||s?.["Content-Type"]||"";if(l.includes("json"))return{type:"JSON",color:c.semantic.info};if(l.includes("xml"))return{type:"XML",color:c.semantic.success};if(l.includes("html"))return{type:"HTML",color:c.semantic.warning};if(l.includes("text"))return{type:"TEXT",color:c.semantic.success};if(l.includes("image"))return{type:"IMAGE",color:c.semantic.error};if(l.includes("video"))return{type:"VIDEO",color:c.semantic.error};if(l.includes("audio"))return{type:"AUDIO",color:c.semantic.debug};if(l.includes("form"))return{type:"FORM",color:c.semantic.info};return{type:"OTHER",color:a.color.textTertiary}}function re(r){switch(r){case"JSON":return _;case"HTML":case"XML":case"TEXT":return Q;case"IMAGE":return Y;case"VIDEO":return K;case"AUDIO":return Z;default:return W}}function ce(r){switch(r){case"GET":return c.semantic.success;case"POST":return c.semantic.info;case"PUT":return c.semantic.warning;case"DELETE":return c.semantic.error;case"PATCH":return c.semantic.success;default:return a.color.textTertiary}}export function NetworkFilterViewV3({events:r,filter:s,onFilterChange:l,ignoredPatterns:T=[],onRemovePattern:E=()=>{},isTeamPattern:A=ne,onAddPattern:w=()=>{},onTogglePatternMode:I=()=>{}}){const[f,z]=te("contains");const M=u(()=>{const o=new Map;for(const e of T)o.set(e.value,e.mode);return o},[T]);const L=u(()=>new Set(T.map(o=>o.value)),[T]);const O=b(o=>{w({value:o,mode:f})},[w,f]);const B=b(o=>{if(A(o)){const i=a.color.accent;return m(x,{accessibilityLabel:"Set by your team on buoy.gg",style:[d.modeBadge,{borderColor:`${i}60`,backgroundColor:`${i}15`}],children:m(y,{style:[d.modeBadgeText,{color:i}],children:"TEAM"})})}const e=M.get(o)??"contains";const n=e==="exact";const t=n?a.color.warning:a.color.info;return m(X,{accessibilityRole:"button",accessibilityLabel:`Match mode: ${e}. Tap to toggle.`,onPress:()=>I(o),style:[d.modeBadge,{borderColor:`${t}60`,backgroundColor:`${t}15`}],hitSlop:{top:6,bottom:6,left:6,right:6},children:m(y,{style:[d.modeBadgeText,{color:t}],children:n?"EXACT":"CONTAINS"})})},[M,I,A]);const R=b(()=>{const o=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return j(x,{style:d.modeToggleRow,children:[m(y,{style:d.modeToggleLabel,children:"Match:"}),m(x,{style:d.modeToggleGroup,children:o.map(e=>{const n=f===e.value;return j(X,{onPress:()=>z(e.value),style:[d.modeToggleButton,n&&d.modeToggleButtonActive],accessibilityRole:"button",accessibilityState:{selected:n},children:[m(y,{style:[d.modeToggleButtonText,n&&d.modeToggleButtonTextActive],children:e.label}),m(y,{style:d.modeToggleButtonHint,children:e.hint})]},e.value)})})]})},[f]);const F=u(()=>{const o={all:r.length,success:0,error:0,pending:0};r.forEach(e=>{if(e.error||e.status&&e.status>=400){o.error+=1;return}if(e.status&&e.status>=200&&e.status<300){o.success+=1;return}if(!e.status&&!e.error){o.pending+=1}});return o},[r]);const N=u(()=>{return r.reduce((o,e)=>{if(!e.method)return o;o[e.method]=(o[e.method]||0)+1;return o},{})},[r]);const U=u(()=>{return r.reduce((o,e)=>{const{type:n}=C(e);o[n]=(o[n]||0)+1;return o},{})},[r]);const D=u(()=>{const o=new Set;r.forEach(e=>{if(e.host){o.add(e.host);return}try{if(e.url){const n=new URL(e.url);const t=String(n.host||"");if(t)o.add(t)}}catch{}});return Array.from(o).filter(e=>e&&e!=="").sort((e,n)=>e.localeCompare(n))},[r]);const V=u(()=>{const o=new Set;r.forEach(e=>{if(!e.url)return;try{const n=new URL(e.url);const t=String(n.origin||"");const i=String(n.pathname||"");const g=`${t}${i}`;o.add(g)}catch{o.add(e.url)}});return Array.from(o).filter(e=>e&&e!=="").sort((e,n)=>e.localeCompare(n))},[r]);const k=u(()=>{const o=30;const e=D.slice(0,o);const n=V.slice(0,o);return[...e,...n]},[D,V]);const H=b((o,e)=>{const[n]=o.split("::");if(n==="status"){const t=e==="all"?void 0:e;l({...s,status:t});return}if(n==="method"){const t=String(e);const i=s.method||[];const g=i.includes(t);const p=g?i.filter(h=>h!==t):[t];l({...s,method:p.length>0?p:void 0});return}if(n==="contentType"){const t=String(e);const i=s.contentType||[];const g=i.includes(t);const p=g?i.filter(h=>h!==t):[t];l({...s,contentType:p.length>0?p:void 0})}},[s,l]);const $=u(()=>{const o=[];o.push({id:"status",title:"Status",type:"status",data:["all","success","error","pending"].map(t=>({id:`status::${t}`,label:t.charAt(0).toUpperCase()+t.slice(1),count:F[t],icon:t==="success"?q:t==="error"?ee:t==="pending"?v:W,color:t==="success"?c.semantic.success:t==="error"?c.semantic.error:t==="pending"?c.semantic.warning:c.semantic.info,isActive:s.status===t||!s.status&&t==="all",value:t}))});const e=Object.entries(N);if(e.length>0){o.push({id:"method",title:"Method",type:"method",data:e.map(([t,i])=>({id:`method::${t}`,label:t,count:i,color:ce(t),isActive:s.method?.includes(t)??false,value:t}))})}const n=Object.entries(U);if(n.length>0){o.push({id:"contentType",title:"Content Type",type:"contentType",data:n.map(([t,i])=>{const g=r.find(h=>C(h).type===t);const{color:p}=g?C(g):{color:a.color.textTertiary};return{id:`contentType::${t}`,label:t,count:i,icon:re(t),color:p,isActive:s.contentType?.includes(t)??false,value:t}})})}return o},[U,r,s.contentType,s.method,s.status,N,F]);const G=u(()=>({sections:$,addFilterSection:{enabled:true,placeholder:"Enter domain or URL pattern...",title:"ACTIVE FILTERS",icon:P,renderExtra:R},availableItemsSection:{enabled:true,title:"AVAILABLE DOMAINS & URLS",emptyMessage:"No network events captured yet. Domains and URLs will appear here.",items:k},howItWorksSection:{enabled:true,title:"HOW NETWORK FILTERS WORK",description:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match.",examples:["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"],icon:P},onFilterChange:H,onPatternAdd:O,onPatternToggle:E,activePatterns:L,renderPatternMeta:B}),[L,$,H,O,E,R,B,k]);return m(J,{...G})}const d=oe.create({modeBadge:{paddingHorizontal:8,paddingVertical:3,borderRadius:6,borderWidth:1},modeBadgeText:{fontSize:9,fontFamily:S,fontWeight:"700",letterSpacing:.5},modeToggleRow:{flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:"600",color:a.color.textSecondary,fontFamily:S,letterSpacing:.3},modeToggleGroup:{flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,paddingVertical:6,paddingHorizontal:10,borderRadius:8,borderWidth:1,borderColor:a.color.border,backgroundColor:a.color.buttonSurface,alignItems:"center"},modeToggleButtonActive:{borderColor:a.color.accentBorderStrong,backgroundColor:a.color.accentSoft},modeToggleButtonText:{fontSize:11,fontWeight:"700",color:a.color.textSecondary,fontFamily:S,letterSpacing:.3},modeToggleButtonTextActive:{color:a.color.accent},modeToggleButtonHint:{fontSize:9,color:a.color.textTertiary,marginTop:1}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback as E,useMemo as x,useState as R}from"react";import{jsx as t,jsxs as d,Fragment as ee}from"react/jsx-runtime";const i={base:"#121212",card:"#1A1A1A",hover:"#242424",input:"#2A2A2A",border:"#333333",text:"#E0E0E0",textSecondary:"#A0A0A0",textMuted:"#888888",primary:"#20C997"};const l={background:{hover:"#1D1D1F"},border:{default:"#2D2D2F"},text:{secondary:"#A1A1A6",muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6",debug:"#BF5AF2"}};function u({size:r=14,color:c="currentColor",children:s}){return t("svg",{width:r,height:r,viewBox:"0 0 24 24",fill:"none",stroke:c,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:s})}const te=r=>d(u,{...r,children:[t("path",{d:"M21.801 10A10 10 0 1 1 17 3.335"}),t("path",{d:"m9 11 3 3L22 4"})]});const oe=r=>d(u,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("path",{d:"m15 9-6 6"}),t("path",{d:"m9 9 6 6"})]});const ne=r=>d(u,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("polyline",{points:"12 6 12 12 16 14"})]});const N=r=>d(u,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"}),t("path",{d:"M2 12h20"})]});const re=r=>d(u,{...r,children:[t("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),t("path",{d:"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4"}),t("path",{d:"M4 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"}),t("path",{d:"M8 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"})]});const ie=r=>d(u,{...r,children:[t("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),t("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),t("path",{d:"M10 9H8"}),t("path",{d:"M16 13H8"}),t("path",{d:"M16 17H8"})]});const le=r=>d(u,{...r,children:[t("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2"}),t("circle",{cx:"9",cy:"9",r:"2"}),t("path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"})]});const ae=r=>d(u,{...r,children:[t("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),t("path",{d:"M7 3v18"}),t("path",{d:"M3 7.5h4"}),t("path",{d:"M3 12h18"}),t("path",{d:"M3 16.5h4"}),t("path",{d:"M17 3v18"}),t("path",{d:"M17 7.5h4"}),t("path",{d:"M17 16.5h4"})]});const de=r=>d(u,{...r,children:[t("path",{d:"M9 18V5l12-2v13"}),t("circle",{cx:"6",cy:"18",r:"3"}),t("circle",{cx:"18",cy:"16",r:"3"})]});const j=r=>t(u,{...r,children:t("polygon",{points:"22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"})});const z=r=>d(u,{...r,children:[t("path",{d:"M5 12h14"}),t("path",{d:"M12 5v14"})]});const U=r=>d(u,{...r,children:[t("path",{d:"M18 6 6 18"}),t("path",{d:"m6 6 12 12"})]});function H(r){const c=r.responseHeaders||r.requestHeaders;const s=c?.["content-type"]||c?.["Content-Type"]||"";if(s.includes("json"))return{type:"JSON",color:l.semantic.info};if(s.includes("xml"))return{type:"XML",color:l.semantic.success};if(s.includes("html"))return{type:"HTML",color:l.semantic.warning};if(s.includes("text"))return{type:"TEXT",color:l.semantic.success};if(s.includes("image"))return{type:"IMAGE",color:l.semantic.error};if(s.includes("video"))return{type:"VIDEO",color:l.semantic.error};if(s.includes("audio"))return{type:"AUDIO",color:l.semantic.debug};if(s.includes("form"))return{type:"FORM",color:l.semantic.info};return{type:"OTHER",color:l.text.muted}}function ce(r){switch(r){case"JSON":return re;case"HTML":case"XML":case"TEXT":return ie;case"IMAGE":return le;case"VIDEO":return ae;case"AUDIO":return de;default:return N}}function se(r){switch(r){case"GET":return l.semantic.success;case"POST":return l.semantic.info;case"PUT":return l.semantic.warning;case"DELETE":return l.semantic.error;case"PATCH":return l.semantic.success;default:return l.text.muted}}function b({icon:r,iconColor:c,title:s,badgeCount:h,badgeColor:f}){return d("div",{style:n.sectionHeader,children:[r?t("span",{style:n.sectionHeaderIcon,children:t(r,{size:12,color:c??i.primary})}):null,t("span",{style:n.sectionHeaderTitle,children:s}),h!==void 0?t("span",{style:{...n.sectionHeaderBadge,backgroundColor:`${f??i.primary}15`,border:`1px solid ${f??i.primary}33`},children:t("span",{style:{...n.sectionHeaderBadgeText,color:f??i.primary},children:h})}):null]})}function pe({onPress:r,color:c,label:s}){return d("button",{type:"button",onClick:r,style:{...n.addButton,borderColor:`${c}40`},children:[t(z,{size:14,color:c}),t("span",{style:{...n.addButtonText,color:c},children:s})]})}function ue({value:r,onChange:c,onSubmit:s,onCancel:h,placeholder:f,color:g}){return d("div",{style:{...n.inputContainer,borderColor:`${g}40`},children:[t("input",{value:r,onChange:C=>c(C.target.value),onKeyDown:C=>{if(C.key==="Enter")s()},placeholder:f,style:{...n.input,color:g},autoFocus:true,autoCorrect:"off",autoCapitalize:"none",autoComplete:"off",spellCheck:false}),d("div",{style:n.inputButtons,children:[r.trim()?t("button",{type:"button",onClick:s,style:{...n.inlineAddButton,backgroundColor:`${g}15`,borderColor:`${g}40`},children:t("span",{style:{...n.inlineAddButtonText,color:g},children:"Add"})}):null,t("button",{type:"button",onClick:h,style:n.cancelButton,children:t(U,{size:16,color:`${g}60`})})]})]})}export function NetworkFilterViewV3({events:r,filter:c,onFilterChange:s,ignoredPatterns:h=[],onRemovePattern:f=()=>{},onAddPattern:g=()=>{},onTogglePatternMode:C=()=>{}}){const[v,G]=R("contains");const[K,w]=R(false);const[M,A]=R("");const P=x(()=>{const e=new Map;for(const o of h)e.set(o.value,o.mode);return e},[h]);const y=x(()=>h.map(e=>e.value),[h]);const I=E(e=>{g({value:e,mode:v})},[g,v]);const V=E(()=>{const e=M.trim();if(!e)return;I(e);A("");w(false)},[M,I]);const X=x(()=>{const e={all:r.length,success:0,error:0,pending:0};r.forEach(o=>{if(o.error||o.status&&o.status>=400){e.error+=1;return}if(o.status&&o.status>=200&&o.status<300){e.success+=1;return}if(!o.status&&!o.error){e.pending+=1}});return e},[r]);const q=x(()=>{return r.reduce((e,o)=>{if(!o.method)return e;e[o.method]=(e[o.method]||0)+1;return e},{})},[r]);const Z=x(()=>{return r.reduce((e,o)=>{const{type:a}=H(o);e[a]=(e[a]||0)+1;return e},{})},[r]);const W=x(()=>{const e=new Set;r.forEach(o=>{if(o.host){e.add(o.host);return}try{if(o.url){const a=new URL(o.url);const p=String(a.host||"");if(p)e.add(p)}}catch{}});return Array.from(e).filter(o=>o&&o!=="").sort((o,a)=>o.localeCompare(a))},[r]);const D=x(()=>{const e=new Set;r.forEach(o=>{if(!o.url)return;try{const a=new URL(o.url);const p=String(a.origin||"");const m=String(a.pathname||"");const T=`${p}${m}`;e.add(T)}catch{e.add(o.url)}});return Array.from(e).filter(o=>o&&o!=="").sort((o,a)=>o.localeCompare(a))},[r]);const L=x(()=>{const e=30;const o=W.slice(0,e);const a=D.slice(0,e);return[...o,...a]},[W,D]);const k=x(()=>L.filter(e=>!y.some(o=>e.includes(o))),[L,y]);const J=E((e,o)=>{const[a]=e.split("::");if(a==="status"){const p=o==="all"?void 0:o;s({...c,status:p});return}if(a==="method"){const p=String(o);const m=c.method||[];const T=m.includes(p);const S=T?m.filter(F=>F!==p):[p];s({...c,method:S.length>0?S:void 0});return}if(a==="contentType"){const p=String(o);const m=c.contentType||[];const T=m.includes(p);const S=T?m.filter(F=>F!==p):[p];s({...c,contentType:S.length>0?S:void 0})}},[c,s]);const B=e=>{const o=e.count===0;const a=!e.isMethod||e.icon;return d("button",{type:"button",onClick:()=>J(e.id,e.value),style:{...n.filterCard,...e.isActive?n.activeFilterCard:null},children:[e.icon?t(e.icon,{size:24,color:e.color}):e.isMethod?t("span",{style:{...n.methodBadgeCompact,backgroundColor:`${e.color}20`},children:t("span",{style:{...n.methodTextCompact,color:e.color},children:e.label})}):null,t("span",{style:o?n.filterCountZero:n.filterCountActive,children:e.count}),a?t("span",{style:n.filterLabelCompact,children:e.label}):null]},e.id)};const Y=["all","success","error","pending"].map(e=>({id:`status::${e}`,label:e.charAt(0).toUpperCase()+e.slice(1),count:X[e],icon:e==="success"?te:e==="error"?oe:e==="pending"?ne:N,color:e==="success"?l.semantic.success:e==="error"?l.semantic.error:e==="pending"?l.semantic.warning:l.semantic.info,isActive:c.status===e||!c.status&&e==="all",value:e}));const $=Object.entries(q);const O=Object.entries(Z);const _=()=>{const e=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return d("div",{style:n.modeToggleRow,children:[t("span",{style:n.modeToggleLabel,children:"Match:"}),t("div",{style:n.modeToggleGroup,children:e.map(o=>{const a=v===o.value;return d("button",{type:"button",onClick:()=>G(o.value),"aria-pressed":a,style:{...n.modeToggleButton,...a?n.modeToggleButtonActive:null},children:[t("span",{style:{...n.modeToggleButtonText,...a?n.modeToggleButtonTextActive:null},children:o.label}),t("span",{style:n.modeToggleButtonHint,children:o.hint})]},o.value)})})]})};const Q=e=>{const o=P.get(e)??"contains";const a=o==="exact";const p=a?l.semantic.warning:l.semantic.info;return t("button",{type:"button","aria-label":`Match mode: ${o}. Tap to toggle.`,onClick:m=>{m.stopPropagation();C(e)},style:{...n.modeBadge,borderColor:`${p}60`,backgroundColor:`${p}15`},children:t("span",{style:{...n.modeBadgeText,color:p},children:a?"EXACT":"CONTAINS"})})};return t("div",{style:n.container,children:d("div",{style:n.content,children:[d("div",{style:n.section,children:[t(b,{title:"Status"}),t("div",{style:n.filterGrid,children:Y.map(B)})]}),$.length>0?d("div",{style:n.section,children:[t(b,{title:"Method"}),t("div",{style:n.filterGrid,children:$.map(([e,o])=>B({id:`method::${e}`,label:e,count:o,color:se(e),isActive:c.method?.includes(e)??false,value:e,isMethod:true}))})]}):null,O.length>0?d("div",{style:n.section,children:[t(b,{title:"Content Type"}),t("div",{style:n.filterGrid,children:O.map(([e,o])=>{const a=r.find(m=>H(m).type===e);const{color:p}=a?H(a):{color:l.text.muted};return B({id:`contentType::${e}`,label:e,count:o,icon:ce(e),color:p,isActive:c.contentType?.includes(e)??false,value:e})})})]}):null,d("div",{style:n.excludeFiltersSection,children:[t(b,{icon:j,iconColor:i.primary,title:"ACTIVE FILTERS",badgeCount:y.length>0?y.length:void 0,badgeColor:i.primary}),t("div",{style:n.excludeFiltersDescription,children:"Hide queries matching these patterns from the list."}),t("div",{style:n.excludeFiltersInputWrapper,children:!K?t(pe,{onPress:()=>w(true),color:i.primary,label:"Add exclude pattern"}):d(ee,{children:[_(),t(ue,{value:M,onChange:A,onSubmit:V,onCancel:()=>{w(false);A("")},placeholder:"Enter domain or URL pattern...",color:i.primary})]})}),y.length>0?t("div",{style:n.excludeFiltersContent,children:t("div",{style:n.filterListColumn,children:y.map(e=>d("button",{type:"button",onClick:()=>f(e),style:n.filterItemRow,children:[t("span",{style:{...n.filterItemText,color:i.primary},children:e}),t("span",{style:n.filterItemMeta,children:Q(e)}),t(U,{size:12,color:`${i.primary}80`})]},e))})}):null]}),d("div",{style:n.availableKeysSection,children:[t(b,{icon:z,iconColor:i.primary,title:"AVAILABLE DOMAINS & URLS",badgeCount:k.length,badgeColor:i.primary}),t("div",{style:n.availableKeysScroll,children:k.length>0?k.map(e=>d("button",{type:"button",onClick:()=>I(e),style:n.availableKeyItem,children:[t("span",{style:n.availableKeyText,children:e}),t(z,{size:12,color:i.primary})]},e)):t("div",{style:n.emptyStateText,children:"No network events captured yet. Domains and URLs will appear here."})})]}),d("div",{style:n.howItWorksSection,children:[t(b,{icon:j,iconColor:i.textSecondary,title:"HOW NETWORK FILTERS WORK"}),t("div",{style:n.howItWorksText,children:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match."}),d("div",{style:n.examplesContainer,children:[t("div",{style:n.examplesTitle,children:"EXAMPLES:"}),["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"].map(e=>t("div",{style:n.exampleItem,children:e},e))]})]})]})})}const n={container:{display:"flex",flexDirection:"column",flex:1,minHeight:0,backgroundColor:i.base},content:{flex:1,minHeight:0,overflowY:"auto",padding:"16px 16px 24px 16px"},section:{marginBottom:8},sectionHeader:{display:"flex",flexDirection:"row",alignItems:"center",padding:"8px 16px",backgroundColor:i.base,minHeight:40,boxSizing:"border-box"},sectionHeaderIcon:{display:"inline-flex",marginRight:8},sectionHeaderTitle:{flex:1,fontSize:14,fontWeight:600,color:i.text,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},sectionHeaderBadge:{display:"inline-flex",alignItems:"center",padding:"3px 8px",borderRadius:12,marginLeft:8},sectionHeaderBadgeText:{fontSize:12,fontWeight:600},filterGrid:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:8},filterCard:{display:"flex",backgroundColor:i.card,borderRadius:12,padding:"10px 8px",flexDirection:"column",alignItems:"center",justifyContent:"center",border:`1px solid ${i.border}`,width:72,minHeight:68,boxSizing:"border-box",cursor:"pointer",margin:0},activeFilterCard:{backgroundColor:`${i.primary}33`,border:`2px solid ${i.primary}`,boxShadow:`0 0 8px ${i.primary}4D`},filterCountActive:{fontSize:14,fontWeight:700,color:i.text,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1,textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.2)"},filterCountZero:{fontSize:11,fontWeight:500,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1},filterLabelCompact:{fontSize:10,color:i.text,fontWeight:600,textAlign:"center",textTransform:"capitalize",textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.3)"},methodBadgeCompact:{display:"inline-flex",padding:"4px 8px",borderRadius:5,minWidth:48,maxWidth:60,boxSizing:"border-box",alignItems:"center",justifyContent:"center"},methodTextCompact:{fontSize:13,fontWeight:700,letterSpacing:.3,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},excludeFiltersSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},excludeFiltersDescription:{fontSize:10,color:i.textSecondary,padding:"8px 16px 0 16px",lineHeight:"14px"},excludeFiltersInputWrapper:{padding:"8px 16px"},excludeFiltersContent:{padding:"0 16px 16px 16px",maxHeight:150,overflowY:"auto"},filterListColumn:{display:"flex",flexDirection:"column",gap:8},filterItemRow:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:i.hover,borderRadius:8,border:`1px solid ${i.border}`,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box",textAlign:"left"},filterItemText:{flex:1,fontSize:12,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},filterItemMeta:{display:"inline-flex",marginRight:8},modeBadge:{display:"inline-flex",padding:"3px 8px",borderRadius:6,borderWidth:1,borderStyle:"solid",background:"none",cursor:"pointer",margin:0},modeBadgeText:{fontSize:9,fontFamily:"ui-monospace, Menlo, monospace",fontWeight:700,letterSpacing:.5},modeToggleRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:600,color:l.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleGroup:{display:"flex",flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,display:"flex",flexDirection:"column",padding:"6px 10px",borderRadius:8,border:`1px solid ${l.border.default}`,backgroundColor:l.background.hover,alignItems:"center",cursor:"pointer",margin:0},modeToggleButtonActive:{border:`1px solid ${l.semantic.info}`,backgroundColor:`${l.semantic.info}22`},modeToggleButtonText:{fontSize:11,fontWeight:700,color:l.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleButtonTextActive:{color:l.semantic.info},modeToggleButtonHint:{fontSize:9,color:l.text.muted,marginTop:1},addButton:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",padding:"10px 14px",borderRadius:10,borderWidth:1,borderStyle:"dashed",backgroundColor:i.input,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box"},addButtonText:{fontSize:13,fontWeight:500,marginLeft:6},inputContainer:{display:"flex",flexDirection:"row",alignItems:"center",backgroundColor:i.input,borderRadius:10,borderWidth:1,borderStyle:"solid",padding:"10px 14px",marginBottom:8,boxSizing:"border-box"},input:{flex:1,fontSize:13,padding:0,border:"none",outline:"none",background:"transparent",fontFamily:"inherit",minWidth:0},inputButtons:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},cancelButton:{display:"inline-flex",padding:4,borderRadius:6,backgroundColor:i.hover,border:"none",cursor:"pointer",margin:0},inlineAddButton:{display:"inline-flex",padding:"6px 12px",borderRadius:6,borderWidth:1,borderStyle:"solid",cursor:"pointer",margin:0},inlineAddButtonText:{fontSize:12,fontWeight:600},availableKeysSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},availableKeysScroll:{maxHeight:150,overflowY:"auto",padding:"8px 16px 16px 16px"},availableKeyItem:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:i.hover,borderRadius:8,border:`1px solid ${i.border}`,marginBottom:8,cursor:"pointer",width:"100%",boxSizing:"border-box",textAlign:"left"},availableKeyText:{flex:1,fontSize:11,color:i.text,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},emptyStateText:{fontSize:11,color:i.textMuted,fontStyle:"italic",textAlign:"center",padding:"12px 0"},howItWorksSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},howItWorksText:{fontSize:11,color:i.textSecondary,lineHeight:"16px",margin:"8px 0 12px 0",padding:"0 16px",fontFamily:"ui-monospace, Menlo, monospace"},examplesContainer:{padding:"8px 16px 16px 16px",borderTop:`1px solid ${i.border}`},examplesTitle:{fontSize:10,fontWeight:600,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",lineHeight:"16px"}};
|
|
1
|
+
"use strict";import{useCallback as E,useMemo as g,useState as R}from"react";import{jsx as t,jsxs as d,Fragment as te}from"react/jsx-runtime";const i={base:"#121212",card:"#1A1A1A",hover:"#242424",input:"#2A2A2A",border:"#333333",text:"#E0E0E0",textSecondary:"#A0A0A0",textMuted:"#888888",primary:"#20C997"};const l={background:{hover:"#1D1D1F"},border:{default:"#2D2D2F"},text:{secondary:"#A1A1A6",muted:"#8E8E93"},semantic:{success:"#34C759",error:"#FF453A",warning:"#FFEB3B",info:"#00B8E6",debug:"#BF5AF2"}};function m({size:r=14,color:c="currentColor",children:s}){return t("svg",{width:r,height:r,viewBox:"0 0 24 24",fill:"none",stroke:c,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:s})}const oe=r=>d(m,{...r,children:[t("path",{d:"M21.801 10A10 10 0 1 1 17 3.335"}),t("path",{d:"m9 11 3 3L22 4"})]});const ne=r=>d(m,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("path",{d:"m15 9-6 6"}),t("path",{d:"m9 9 6 6"})]});const re=r=>d(m,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("polyline",{points:"12 6 12 12 16 14"})]});const N=r=>d(m,{...r,children:[t("circle",{cx:"12",cy:"12",r:"10"}),t("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"}),t("path",{d:"M2 12h20"})]});const ie=r=>d(m,{...r,children:[t("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),t("path",{d:"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4"}),t("path",{d:"M4 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"}),t("path",{d:"M8 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"})]});const le=r=>d(m,{...r,children:[t("path",{d:"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"}),t("path",{d:"M14 2v4a2 2 0 0 0 2 2h4"}),t("path",{d:"M10 9H8"}),t("path",{d:"M16 13H8"}),t("path",{d:"M16 17H8"})]});const ae=r=>d(m,{...r,children:[t("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2"}),t("circle",{cx:"9",cy:"9",r:"2"}),t("path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"})]});const de=r=>d(m,{...r,children:[t("rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}),t("path",{d:"M7 3v18"}),t("path",{d:"M3 7.5h4"}),t("path",{d:"M3 12h18"}),t("path",{d:"M3 16.5h4"}),t("path",{d:"M17 3v18"}),t("path",{d:"M17 7.5h4"}),t("path",{d:"M17 16.5h4"})]});const ce=r=>d(m,{...r,children:[t("path",{d:"M9 18V5l12-2v13"}),t("circle",{cx:"6",cy:"18",r:"3"}),t("circle",{cx:"18",cy:"16",r:"3"})]});const j=r=>t(m,{...r,children:t("polygon",{points:"22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"})});const z=r=>d(m,{...r,children:[t("path",{d:"M5 12h14"}),t("path",{d:"M12 5v14"})]});const U=r=>d(m,{...r,children:[t("path",{d:"M18 6 6 18"}),t("path",{d:"m6 6 12 12"})]});function H(r){const c=r.responseHeaders||r.requestHeaders;const s=c?.["content-type"]||c?.["Content-Type"]||"";if(s.includes("json"))return{type:"JSON",color:l.semantic.info};if(s.includes("xml"))return{type:"XML",color:l.semantic.success};if(s.includes("html"))return{type:"HTML",color:l.semantic.warning};if(s.includes("text"))return{type:"TEXT",color:l.semantic.success};if(s.includes("image"))return{type:"IMAGE",color:l.semantic.error};if(s.includes("video"))return{type:"VIDEO",color:l.semantic.error};if(s.includes("audio"))return{type:"AUDIO",color:l.semantic.debug};if(s.includes("form"))return{type:"FORM",color:l.semantic.info};return{type:"OTHER",color:l.text.muted}}function se(r){switch(r){case"JSON":return ie;case"HTML":case"XML":case"TEXT":return le;case"IMAGE":return ae;case"VIDEO":return de;case"AUDIO":return ce;default:return N}}function pe(r){switch(r){case"GET":return l.semantic.success;case"POST":return l.semantic.info;case"PUT":return l.semantic.warning;case"DELETE":return l.semantic.error;case"PATCH":return l.semantic.success;default:return l.text.muted}}function C({icon:r,iconColor:c,title:s,badgeCount:h,badgeColor:f}){return d("div",{style:n.sectionHeader,children:[r?t("span",{style:n.sectionHeaderIcon,children:t(r,{size:12,color:c??i.primary})}):null,t("span",{style:n.sectionHeaderTitle,children:s}),h!==void 0?t("span",{style:{...n.sectionHeaderBadge,backgroundColor:`${f??i.primary}15`,border:`1px solid ${f??i.primary}33`},children:t("span",{style:{...n.sectionHeaderBadgeText,color:f??i.primary},children:h})}):null]})}function ue({onPress:r,color:c,label:s}){return d("button",{type:"button",onClick:r,style:{...n.addButton,borderColor:`${c}40`},children:[t(z,{size:14,color:c}),t("span",{style:{...n.addButtonText,color:c},children:s})]})}function me({value:r,onChange:c,onSubmit:s,onCancel:h,placeholder:f,color:x}){return d("div",{style:{...n.inputContainer,borderColor:`${x}40`},children:[t("input",{value:r,onChange:y=>c(y.target.value),onKeyDown:y=>{if(y.key==="Enter")s()},placeholder:f,style:{...n.input,color:x},autoFocus:true,autoCorrect:"off",autoCapitalize:"none",autoComplete:"off",spellCheck:false}),d("div",{style:n.inputButtons,children:[r.trim()?t("button",{type:"button",onClick:s,style:{...n.inlineAddButton,backgroundColor:`${x}15`,borderColor:`${x}40`},children:t("span",{style:{...n.inlineAddButtonText,color:x},children:"Add"})}):null,t("button",{type:"button",onClick:h,style:n.cancelButton,children:t(U,{size:16,color:`${x}60`})})]})]})}export function NetworkFilterViewV3({events:r,filter:c,onFilterChange:s,ignoredPatterns:h=[],onRemovePattern:f=()=>{},isTeamPattern:x=()=>false,onAddPattern:y=()=>{},onTogglePatternMode:G=()=>{}}){const[v,K]=R("contains");const[P,w]=R(false);const[M,A]=R("");const V=g(()=>{const e=new Map;for(const o of h)e.set(o.value,o.mode);return e},[h]);const b=g(()=>h.map(e=>e.value),[h]);const I=E(e=>{y({value:e,mode:v})},[y,v]);const X=E(()=>{const e=M.trim();if(!e)return;I(e);A("");w(false)},[M,I]);const q=g(()=>{const e={all:r.length,success:0,error:0,pending:0};r.forEach(o=>{if(o.error||o.status&&o.status>=400){e.error+=1;return}if(o.status&&o.status>=200&&o.status<300){e.success+=1;return}if(!o.status&&!o.error){e.pending+=1}});return e},[r]);const Z=g(()=>{return r.reduce((e,o)=>{if(!o.method)return e;e[o.method]=(e[o.method]||0)+1;return e},{})},[r]);const J=g(()=>{return r.reduce((e,o)=>{const{type:a}=H(o);e[a]=(e[a]||0)+1;return e},{})},[r]);const W=g(()=>{const e=new Set;r.forEach(o=>{if(o.host){e.add(o.host);return}try{if(o.url){const a=new URL(o.url);const p=String(a.host||"");if(p)e.add(p)}}catch{}});return Array.from(e).filter(o=>o&&o!=="").sort((o,a)=>o.localeCompare(a))},[r]);const $=g(()=>{const e=new Set;r.forEach(o=>{if(!o.url)return;try{const a=new URL(o.url);const p=String(a.origin||"");const u=String(a.pathname||"");const T=`${p}${u}`;e.add(T)}catch{e.add(o.url)}});return Array.from(e).filter(o=>o&&o!=="").sort((o,a)=>o.localeCompare(a))},[r]);const D=g(()=>{const e=30;const o=W.slice(0,e);const a=$.slice(0,e);return[...o,...a]},[W,$]);const k=g(()=>D.filter(e=>!b.some(o=>e.includes(o))),[D,b]);const Y=E((e,o)=>{const[a]=e.split("::");if(a==="status"){const p=o==="all"?void 0:o;s({...c,status:p});return}if(a==="method"){const p=String(o);const u=c.method||[];const T=u.includes(p);const S=T?u.filter(F=>F!==p):[p];s({...c,method:S.length>0?S:void 0});return}if(a==="contentType"){const p=String(o);const u=c.contentType||[];const T=u.includes(p);const S=T?u.filter(F=>F!==p):[p];s({...c,contentType:S.length>0?S:void 0})}},[c,s]);const B=e=>{const o=e.count===0;const a=!e.isMethod||e.icon;return d("button",{type:"button",onClick:()=>Y(e.id,e.value),style:{...n.filterCard,...e.isActive?n.activeFilterCard:null},children:[e.icon?t(e.icon,{size:24,color:e.color}):e.isMethod?t("span",{style:{...n.methodBadgeCompact,backgroundColor:`${e.color}20`},children:t("span",{style:{...n.methodTextCompact,color:e.color},children:e.label})}):null,t("span",{style:o?n.filterCountZero:n.filterCountActive,children:e.count}),a?t("span",{style:n.filterLabelCompact,children:e.label}):null]},e.id)};const _=["all","success","error","pending"].map(e=>({id:`status::${e}`,label:e.charAt(0).toUpperCase()+e.slice(1),count:q[e],icon:e==="success"?oe:e==="error"?ne:e==="pending"?re:N,color:e==="success"?l.semantic.success:e==="error"?l.semantic.error:e==="pending"?l.semantic.warning:l.semantic.info,isActive:c.status===e||!c.status&&e==="all",value:e}));const L=Object.entries(Z);const O=Object.entries(J);const Q=()=>{const e=[{label:"Contains",value:"contains",hint:"substring"},{label:"Exact",value:"exact",hint:"whole path/host/url"}];return d("div",{style:n.modeToggleRow,children:[t("span",{style:n.modeToggleLabel,children:"Match:"}),t("div",{style:n.modeToggleGroup,children:e.map(o=>{const a=v===o.value;return d("button",{type:"button",onClick:()=>K(o.value),"aria-pressed":a,style:{...n.modeToggleButton,...a?n.modeToggleButtonActive:null},children:[t("span",{style:{...n.modeToggleButtonText,...a?n.modeToggleButtonTextActive:null},children:o.label}),t("span",{style:n.modeToggleButtonHint,children:o.hint})]},o.value)})})]})};const ee=e=>{if(x(e)){const u=l.semantic.success;return t("span",{"aria-label":"Set by your team on buoy.gg",style:{...n.modeBadge,borderColor:`${u}60`,backgroundColor:`${u}15`},children:t("span",{style:{...n.modeBadgeText,color:u},children:"TEAM"})})}const o=V.get(e)??"contains";const a=o==="exact";const p=a?l.semantic.warning:l.semantic.info;return t("button",{type:"button","aria-label":`Match mode: ${o}. Tap to toggle.`,onClick:u=>{u.stopPropagation();G(e)},style:{...n.modeBadge,borderColor:`${p}60`,backgroundColor:`${p}15`},children:t("span",{style:{...n.modeBadgeText,color:p},children:a?"EXACT":"CONTAINS"})})};return t("div",{style:n.container,children:d("div",{style:n.content,children:[d("div",{style:n.section,children:[t(C,{title:"Status"}),t("div",{style:n.filterGrid,children:_.map(B)})]}),L.length>0?d("div",{style:n.section,children:[t(C,{title:"Method"}),t("div",{style:n.filterGrid,children:L.map(([e,o])=>B({id:`method::${e}`,label:e,count:o,color:pe(e),isActive:c.method?.includes(e)??false,value:e,isMethod:true}))})]}):null,O.length>0?d("div",{style:n.section,children:[t(C,{title:"Content Type"}),t("div",{style:n.filterGrid,children:O.map(([e,o])=>{const a=r.find(u=>H(u).type===e);const{color:p}=a?H(a):{color:l.text.muted};return B({id:`contentType::${e}`,label:e,count:o,icon:se(e),color:p,isActive:c.contentType?.includes(e)??false,value:e})})})]}):null,d("div",{style:n.excludeFiltersSection,children:[t(C,{icon:j,iconColor:i.primary,title:"ACTIVE FILTERS",badgeCount:b.length>0?b.length:void 0,badgeColor:i.primary}),t("div",{style:n.excludeFiltersDescription,children:"Hide queries matching these patterns from the list."}),t("div",{style:n.excludeFiltersInputWrapper,children:!P?t(ue,{onPress:()=>w(true),color:i.primary,label:"Add exclude pattern"}):d(te,{children:[Q(),t(me,{value:M,onChange:A,onSubmit:X,onCancel:()=>{w(false);A("")},placeholder:"Enter domain or URL pattern...",color:i.primary})]})}),b.length>0?t("div",{style:n.excludeFiltersContent,children:t("div",{style:n.filterListColumn,children:b.map(e=>d("button",{type:"button",onClick:()=>f(e),style:n.filterItemRow,children:[t("span",{style:{...n.filterItemText,color:i.primary},children:e}),t("span",{style:n.filterItemMeta,children:ee(e)}),t(U,{size:12,color:`${i.primary}80`})]},e))})}):null]}),d("div",{style:n.availableKeysSection,children:[t(C,{icon:z,iconColor:i.primary,title:"AVAILABLE DOMAINS & URLS",badgeCount:k.length,badgeColor:i.primary}),t("div",{style:n.availableKeysScroll,children:k.length>0?k.map(e=>d("button",{type:"button",onClick:()=>I(e),style:n.availableKeyItem,children:[t("span",{style:n.availableKeyText,children:e}),t(z,{size:12,color:i.primary})]},e)):t("div",{style:n.emptyStateText,children:"No network events captured yet. Domains and URLs will appear here."})})]}),d("div",{style:n.howItWorksSection,children:[t(C,{icon:j,iconColor:i.textSecondary,title:"HOW NETWORK FILTERS WORK"}),t("div",{style:n.howItWorksText,children:"Patterns hide matching requests from the network event list. Each pattern has a match mode you can toggle on its badge: CONTAINS hides any URL containing the text; EXACT hides only an exact path/host/url match."}),d("div",{style:n.examplesContainer,children:[t("div",{style:n.examplesTitle,children:"EXAMPLES:"}),["\u2022 example.com (CONTAINS) \u2192 any request whose URL contains example.com","\u2022 example.com (EXACT) \u2192 only requests served by that exact host","\u2022 /v1 (CONTAINS) \u2192 any URL containing /v1 (e.g. /v1, /v1/users)","\u2022 /v1 (EXACT) \u2192 only requests whose pathname is exactly /v1"].map(e=>t("div",{style:n.exampleItem,children:e},e))]})]})]})})}const n={container:{display:"flex",flexDirection:"column",flex:1,minHeight:0,backgroundColor:i.base},content:{flex:1,minHeight:0,overflowY:"auto",padding:"16px 16px 24px 16px"},section:{marginBottom:8},sectionHeader:{display:"flex",flexDirection:"row",alignItems:"center",padding:"8px 16px",backgroundColor:i.base,minHeight:40,boxSizing:"border-box"},sectionHeaderIcon:{display:"inline-flex",marginRight:8},sectionHeaderTitle:{flex:1,fontSize:14,fontWeight:600,color:i.text,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},sectionHeaderBadge:{display:"inline-flex",alignItems:"center",padding:"3px 8px",borderRadius:12,marginLeft:8},sectionHeaderBadgeText:{fontSize:12,fontWeight:600},filterGrid:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:8},filterCard:{display:"flex",backgroundColor:i.card,borderRadius:12,padding:"10px 8px",flexDirection:"column",alignItems:"center",justifyContent:"center",border:`1px solid ${i.border}`,width:72,minHeight:68,boxSizing:"border-box",cursor:"pointer",margin:0},activeFilterCard:{backgroundColor:`${i.primary}33`,border:`2px solid ${i.primary}`,boxShadow:`0 0 8px ${i.primary}4D`},filterCountActive:{fontSize:14,fontWeight:700,color:i.text,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1,textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.2)"},filterCountZero:{fontSize:11,fontWeight:500,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",marginTop:3,marginBottom:1},filterLabelCompact:{fontSize:10,color:i.text,fontWeight:600,textAlign:"center",textTransform:"capitalize",textShadow:"0 0.5px 1px rgba(0, 0, 0, 0.3)"},methodBadgeCompact:{display:"inline-flex",padding:"4px 8px",borderRadius:5,minWidth:48,maxWidth:60,boxSizing:"border-box",alignItems:"center",justifyContent:"center"},methodTextCompact:{fontSize:13,fontWeight:700,letterSpacing:.3,fontFamily:"ui-monospace, Menlo, monospace",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},excludeFiltersSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},excludeFiltersDescription:{fontSize:10,color:i.textSecondary,padding:"8px 16px 0 16px",lineHeight:"14px"},excludeFiltersInputWrapper:{padding:"8px 16px"},excludeFiltersContent:{padding:"0 16px 16px 16px",maxHeight:150,overflowY:"auto"},filterListColumn:{display:"flex",flexDirection:"column",gap:8},filterItemRow:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:i.hover,borderRadius:8,border:`1px solid ${i.border}`,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box",textAlign:"left"},filterItemText:{flex:1,fontSize:12,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},filterItemMeta:{display:"inline-flex",marginRight:8},modeBadge:{display:"inline-flex",padding:"3px 8px",borderRadius:6,borderWidth:1,borderStyle:"solid",background:"none",cursor:"pointer",margin:0},modeBadgeText:{fontSize:9,fontFamily:"ui-monospace, Menlo, monospace",fontWeight:700,letterSpacing:.5},modeToggleRow:{display:"flex",flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},modeToggleLabel:{fontSize:11,fontWeight:600,color:l.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleGroup:{display:"flex",flexDirection:"row",gap:6,flex:1},modeToggleButton:{flex:1,display:"flex",flexDirection:"column",padding:"6px 10px",borderRadius:8,border:`1px solid ${l.border.default}`,backgroundColor:l.background.hover,alignItems:"center",cursor:"pointer",margin:0},modeToggleButtonActive:{border:`1px solid ${l.semantic.info}`,backgroundColor:`${l.semantic.info}22`},modeToggleButtonText:{fontSize:11,fontWeight:700,color:l.text.secondary,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.3},modeToggleButtonTextActive:{color:l.semantic.info},modeToggleButtonHint:{fontSize:9,color:l.text.muted,marginTop:1},addButton:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",padding:"10px 14px",borderRadius:10,borderWidth:1,borderStyle:"dashed",backgroundColor:i.input,cursor:"pointer",margin:0,width:"100%",boxSizing:"border-box"},addButtonText:{fontSize:13,fontWeight:500,marginLeft:6},inputContainer:{display:"flex",flexDirection:"row",alignItems:"center",backgroundColor:i.input,borderRadius:10,borderWidth:1,borderStyle:"solid",padding:"10px 14px",marginBottom:8,boxSizing:"border-box"},input:{flex:1,fontSize:13,padding:0,border:"none",outline:"none",background:"transparent",fontFamily:"inherit",minWidth:0},inputButtons:{display:"flex",flexDirection:"row",alignItems:"center",gap:8},cancelButton:{display:"inline-flex",padding:4,borderRadius:6,backgroundColor:i.hover,border:"none",cursor:"pointer",margin:0},inlineAddButton:{display:"inline-flex",padding:"6px 12px",borderRadius:6,borderWidth:1,borderStyle:"solid",cursor:"pointer",margin:0},inlineAddButtonText:{fontSize:12,fontWeight:600},availableKeysSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},availableKeysScroll:{maxHeight:150,overflowY:"auto",padding:"8px 16px 16px 16px"},availableKeyItem:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:"10px 12px",backgroundColor:i.hover,borderRadius:8,border:`1px solid ${i.border}`,marginBottom:8,cursor:"pointer",width:"100%",boxSizing:"border-box",textAlign:"left"},availableKeyText:{flex:1,fontSize:11,color:i.text,fontFamily:"ui-monospace, Menlo, monospace",marginRight:8,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",minWidth:0},emptyStateText:{fontSize:11,color:i.textMuted,fontStyle:"italic",textAlign:"center",padding:"12px 0"},howItWorksSection:{backgroundColor:i.card,borderRadius:16,border:`1px solid ${i.border}`,marginTop:16,overflow:"hidden"},howItWorksText:{fontSize:11,color:i.textSecondary,lineHeight:"16px",margin:"8px 0 12px 0",padding:"0 16px",fontFamily:"ui-monospace, Menlo, monospace"},examplesContainer:{padding:"8px 16px 16px 16px",borderTop:`1px solid ${i.border}`},examplesTitle:{fontSize:10,fontWeight:600,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:i.textMuted,fontFamily:"ui-monospace, Menlo, monospace",lineHeight:"16px"}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{createRemoteConditionsSource as De,openNetworkFloatingTool as _e}from"../conditions/NetworkFloatingTool";import{useState as n,useRef as x,useEffect as k,useCallback as G}from"react";import{View as E,StyleSheet as Ve,TouchableOpacity as qe}from"react-native";import{Search as He,Wifi as Le,Filter as Ue,Bookmark as ze,JsModal as je,ModalHeader as o,devToolsStorageKeys as D,macOSColors as Ke,night as u,persistentStorage as de,NightSegmented as We,useFeatureGate as Je,UpgradeModal as $e,PowerToggleButton as Ge,useIgnoredPatterns as Xe,windowDragProps as Ye}from"@buoy-gg/shared-ui";import{NetworkFilterViewV3 as Qe}from"./NetworkFilterViewV3";import{TickProvider as ue}from"../hooks/useTickEveryMinute";import{NetworkEventDetailView as Ze}from"./NetworkEventDetailView";import{NetworkCopySettingsView as et,DEFAULT_COPY_SETTINGS as tt}from"./NetworkCopySettingsView";import{NetworkHeaderBadges as rt,NetworkClearButton as ot,NetworkDetailPinActions as nt,NetworkHeaderCopyButton as st}from"./NetworkHeaderLive";import{NetworkListScreen as at}from"./NetworkListScreen";import{NetworkSavedScreen as it}from"./NetworkSavedScreen";import{NetworkOverridesScreen as lt}from"./NetworkOverridesScreen";import{NetworkOverridesButton as ct}from"./NetworkOverridesButton";import{NetworkOverrideHeaderButton as dt}from"./NetworkOverrideHeaderButton";import{NetworkHeaderMenu as ut,NetworkHeaderMenuButton as pt,NetworkHeaderMenuItem as X}from"./NetworkHeaderMenu";import{NetworkDetailStepper as ft}from"./NetworkDetailStepper";import{useNetworkEventList as pe}from"../hooks/useNetworkEventList";import{useLiveNetworkEvent as ht}from"../hooks/useLiveNetworkEvent";import{useHasNetworkSelection as gt,useNetworkBodyEventId as mt,useSelectedNetworkEventId as St}from"../hooks/useNetworkSelection";import{networkSelectionStore as _}from"../utils/networkSelectionStore";import{FREE_TIER_SAVED_LIMIT as vt,MAX_SAVED as wt}from"../utils/networkSavedStore";import{FREE_TIER_RULE_LIMIT as yt,MAX_RULES as kt}from"../overrides/types";import{jsx as e,jsxs as l,Fragment as Pt}from"react/jsx-runtime";function bt({visible:r,paused:p,ignoredPatternValues:f,onTogglePattern:h,isPro:v,filter:c,ignoredPatterns:g,fromSaved:m,savedSearch:w,applySafeAreaInset:i}){const M=St();const V=mt();const b=M!=null&&M===V;const s=ht(M,{paused:p||!r});k(()=>{if(r&&s&&b){_.reportRendered(s.id)}},[r,s,b]);if(!r)return null;return l(E,{style:P.detailRoot,children:[s?e(Ze,{event:s,ignoredPatterns:f,onTogglePattern:h,showBodies:b}):e(E,{style:P.detailBodyFallback}),e(ft,{paused:p,filter:c,ignoredPatterns:g,isPro:v,fromSaved:m,savedSearch:w,applySafeAreaInset:i})]})}function Ct({visible:r,paused:p,isPro:f,filter:h,onFilterChange:v,ignoredPatterns:c,onRemovePattern:g,onAddPattern:m,onTogglePatternMode:w}){const{events:i}=pe({filter:h,ignoredPatterns:c,paused:p,visible:r,isPro:f});if(!r)return null;return e(Qe,{events:i,filter:h,onFilterChange:v,ignoredPatterns:c,onRemovePattern:g,onAddPattern:m,onTogglePatternMode:w})}function Rt({visible:r,paused:p,isPro:f,filter:h,ignoredPatterns:v,settings:c,onSettingsChange:g}){const{events:m}=pe({filter:h,ignoredPatterns:v,paused:p,visible:r,isPro:f});if(!r)return null;return e(et,{settings:c,onSettingsChange:g,events:m})}function fe({visible:r,onClose:p,onBack:f,onMinimize:h,enableSharedModalDimensions:v=false,inline:c=false,paused:g,onPausedChange:m,remoteConditions:w}){const{isPro:i}=Je();const[M,V]=n(false);const b=g!=null&&m!=null;const s=b?g:M;const he=t=>{const a=typeof t==="function"?t(s):t;if(b)m(a);else V(a)};const[d,q]=n({});const S=gt();const[y,Y]=n(false);const[O,Q]=n(false);const[B,H]=n(false);const[Z,C]=n(false);const[ge,me]=n(0);const[T]=n(De);k(()=>{T.update(w)},[T,w]);k(()=>()=>T.update(void 0),[T]);const R=true;const[Se,L]=n(null);const[U,ee]=n("filters");const[te,ve]=n("");const[z,j]=n(false);const It=x(false);const[re,we]=n("");const ye=x(null);const{patterns:N,values:ke,add:Pe,remove:be,toggle:Ce,toggleMode:Re}=Xe();const[F,oe]=n(tt);const K=x(false);const[W,J]=n(false);const[I,Ne]=n("export");const A=t=>{Ne(t);J(true)};k(()=>{if(W&&i){J(false)}},[W,i]);k(()=>{if(!r||K.current)return;const t=async()=>{try{const a=await de.getItem(D.network.copyOptions());if(a){const xe=JSON.parse(a);oe(xe)}}catch(a){}finally{K.current=true}};t()},[r]);k(()=>{if(!K.current)return;const t=async()=>{try{await de.setItem(D.network.copyOptions(),JSON.stringify(F))}catch(a){}};t()},[F]);const Ie=()=>{_.clear()};const ne=G(t=>{_.select(t.id)},[]);const Ee=G((t,a)=>{L(a?{...t,id:a}:t);H(true);_.clear()},[]);const Me=G(()=>L(null),[]);const se=x(null);const ae=t=>{ve(t);q(a=>({...a,searchText:t}))};const Te=t=>{q(a=>({...a,status:a.status===t?void 0:t}))};const[ie,Fe]=n("bottomSheet");const Ae=t=>{Fe(t)};k(()=>{if(z){requestAnimationFrame(()=>{ye.current?.focus()})}},[z]);const le=()=>{if(y){return l(o,{children:[e(o.Navigation,{onBack:()=>Y(false)}),e(o.Content,{title:"",noMargin:true,children:e(We,{size:"sm",tabs:[{key:"filters",label:"Filters"},{key:"copy",label:"Copy"}],activeKey:U,onChange:t=>ee(t)})})]})}if(S){return l(o,{children:[e(o.Navigation,{onBack:Ie}),e(o.Content,{title:"Request Details",centered:true}),l(o.Actions,{children:[R?e(dt,{onOpen:Ee}):null,e(nt,{isPro:i,onUpgradePress:()=>A("saved")})]})]})}if(B&&R){return l(o,{children:[e(o.Navigation,{onBack:()=>{if(se.current?.())return;H(false);L(null)}}),e(o.Content,{title:"Response Overrides",centered:true})]})}if(O){return l(o,{children:[e(o.Navigation,{onBack:()=>Q(false)}),e(o.Content,{title:"Saved Requests",centered:true})]})}return l(o,{children:[f&&e(o.Navigation,{onBack:f}),e(o.Content,{title:"",children:z?e(o.Search,{value:te,onChangeText:ae,onCancel:()=>{ae("");j(false)},onDismiss:()=>j(false),dismissOnBlur:true,clearOnlyWhenText:true,placeholder:"Search URL, method, operation, error...",accessibilityLabel:"Search network requests",iconSize:14,testID:"buoy-network-search-input",clearTestID:"buoy-network-search-clear",inputProps:{"sentry-label":"ignore network search header"}}):e(rt,{activeStatus:d.status,onToggleStatus:Te,ignoredPatterns:N,paused:s})}),l(o.Actions,{children:[e(qe,{"sentry-label":"ignore open search",testID:"buoy-network-search-open",accessibilityLabel:"Open search",accessibilityRole:"button",onPress:()=>j(true),style:P.headerActionButton,children:e(He,{size:14,color:u.color.textSecondary})}),R?e(ct,{onPress:()=>H(true)}):null,e(Ge,{isEnabled:!s,onToggle:()=>he(t=>!t),accessibilityLabel:s?"Resume network capture":"Pause network capture",testID:"buoy-network-power"}),e(ot,{paused:s}),e(pt,{onPress:()=>C(t=>!t),isOpen:Z,hasIndicator:$})]})]})};const $=!!(d.status||d.method||d.contentType);const Oe=v?D.modal.root():D.network.modal();if(!r)return null;const Be=S||!y;const ce=l(Pt,{children:[l(E,{style:P.container,children:[e(bt,{visible:S,paused:s,ignoredPatternValues:ke,onTogglePattern:Ce,isPro:i,filter:d,ignoredPatterns:N,fromSaved:O,savedSearch:re,applySafeAreaInset:!c&&ie==="bottomSheet"}),e(Ct,{visible:y&&U==="filters"&&!S,paused:s,isPro:i,filter:d,onFilterChange:q,ignoredPatterns:N,onRemovePattern:be,onAddPattern:Pe,onTogglePatternMode:Re}),e(Rt,{visible:y&&U==="copy"&&!S,paused:s,isPro:i,filter:d,ignoredPatterns:N,settings:F,onSettingsChange:oe}),e(lt,{visible:R&&B&&!S&&!y,isPro:i,onUpgradePress:()=>A("overrides"),pendingDraft:Se,onPendingConsumed:Me,backHandlerRef:se,applySafeAreaInset:!c&&ie==="bottomSheet"}),e(it,{visible:O&&!S&&!y&&!(B&&R),isPro:i,copySettings:F,search:re,onSearchChange:we,onEventPress:ne,onUpgradePress:()=>A("saved")}),e(at,{visible:!S&&!y&&!O&&!(B&&R),paused:s,filter:d,ignoredPatterns:N,isPro:i,searchText:te,onEventPress:ne,onUpgradePress:()=>A("export")})]}),Z?l(ut,{onClose:()=>C(false),children:[e(X,{icon:e(Le,{size:14,color:u.color.textSecondary}),label:"Network throttling",testID:"buoy-network-menu-throttling",onPress:()=>{C(false);_e(w?T:void 0);if(!c)me(t=>t+1)}}),e(X,{icon:e(Ue,{size:14,color:$?u.color.accent:u.color.textSecondary}),label:"Filters",detail:$?"Active":void 0,onPress:()=>{C(false);ee("filters");Y(true)}}),e(X,{icon:e(ze,{size:14,color:u.color.textSecondary}),label:"Saved requests",onPress:()=>{C(false);Q(true)}}),e(E,{style:P.menuCopyRow,children:e(st,{isPro:i,filter:d,ignoredPatterns:N,copySettings:F,paused:s,onUpgradePress:()=>{C(false);A("export")},label:"Copy requests"})})]}):null,e($e,{visible:W,onClose:()=>J(false),featureName:I==="saved"?"Saved Requests":I==="overrides"?"Response Overrides":"Network Export",description:I==="saved"?"Keep the requests that matter. Saved requests survive Clear, app restarts, and the 500-request history cap.":I==="overrides"?"Force any endpoint to fail, stall or return something else \u2014 no backend changes, no code changes. Free keeps one active rule.":"Export network requests to share with your team, debug APIs, or feed into AI tools.",benefits:I==="overrides"?[`Run ${kt} rules at once (free keeps ${yt})`,"Force a 500, a 401 or an empty list in one tap","Simulate offline, timeouts and slow connections","Rules survive an app reload, so you can test the boot path"]:I==="saved"?[`Save up to ${wt} requests (free keeps ${vt})`,"Failed requests stay put through a Clear","Snapshots survive an app restart","Export saved requests to teammates or AI assistants"]:["Export to JSON, Markdown, or plain text","Customizable copy presets (URLs only, LLM-ready, full data)","Share request details with teammates","Feed network data directly to AI assistants"]})]});if(c){return l(E,{style:P.inlineRoot,children:[e(E,{style:P.inlineHeader,...Ye,children:le()}),ce]})}return e(je,{visible:r,onClose:p,onMinimize:h,minimizeRequest:ge,persistenceKey:Oe,variant:"night",header:{showToggleButton:true,customContent:le()},onModeChange:Ae,enablePersistence:true,initialMode:"bottomSheet",enableGlitchEffects:true,disableScrollWrapper:Be,styles:{},children:ce})}const P=Ve.create({container:{flex:1,backgroundColor:"transparent"},detailRoot:{flex:1,minHeight:0},detailBodyFallback:{flex:1},inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:Ke.border.default,backgroundColor:"transparent"},menuCopyRow:{paddingHorizontal:6},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:u.color.buttonSurface,borderWidth:1,borderColor:u.color.border,alignItems:"center",justifyContent:"center"},activeFilterButton:{backgroundColor:u.color.accentSoft,borderColor:u.color.accentBorderStrong}});export function NetworkModal(r){return e(ue,{children:e(fe,{...r})})}export function NetworkToolView(r={}){return e(ue,{children:e(fe,{...r,inline:true,visible:true,onClose:Nt})})}const Nt=()=>{};
|
|
1
|
+
"use strict";import{createRemoteConditionsSource as _e,openNetworkFloatingTool as Ve}from"../conditions/NetworkFloatingTool";import{useState as n,useRef as x,useEffect as P,useCallback as G}from"react";import{View as E,StyleSheet as qe,TouchableOpacity as He}from"react-native";import{Search as Le,Wifi as Ue,Filter as ze,Bookmark as je,JsModal as Ke,ModalHeader as o,devToolsStorageKeys as D,macOSColors as We,night as u,persistentStorage as de,NightSegmented as Je,useFeatureGate as $e,UpgradeModal as Ge,PowerToggleButton as Xe,useIgnoredPatterns as Ye,windowDragProps as Qe}from"@buoy-gg/shared-ui";import{NetworkFilterViewV3 as Ze}from"./NetworkFilterViewV3";import{TickProvider as ue}from"../hooks/useTickEveryMinute";import{NetworkEventDetailView as et}from"./NetworkEventDetailView";import{NetworkCopySettingsView as tt,DEFAULT_COPY_SETTINGS as rt}from"./NetworkCopySettingsView";import{NetworkHeaderBadges as ot,NetworkClearButton as nt,NetworkDetailPinActions as st,NetworkHeaderCopyButton as at}from"./NetworkHeaderLive";import{NetworkListScreen as it}from"./NetworkListScreen";import{NetworkSavedScreen as lt}from"./NetworkSavedScreen";import{NetworkOverridesScreen as ct}from"./NetworkOverridesScreen";import{NetworkOverridesButton as dt}from"./NetworkOverridesButton";import{NetworkOverrideHeaderButton as ut}from"./NetworkOverrideHeaderButton";import{NetworkHeaderMenu as pt,NetworkHeaderMenuButton as ft,NetworkHeaderMenuItem as X}from"./NetworkHeaderMenu";import{NetworkDetailStepper as gt}from"./NetworkDetailStepper";import{useNetworkEventList as pe}from"../hooks/useNetworkEventList";import{useLiveNetworkEvent as ht}from"../hooks/useLiveNetworkEvent";import{useHasNetworkSelection as mt,useNetworkBodyEventId as St,useSelectedNetworkEventId as vt}from"../hooks/useNetworkSelection";import{networkSelectionStore as _}from"../utils/networkSelectionStore";import{FREE_TIER_SAVED_LIMIT as wt,MAX_SAVED as yt}from"../utils/networkSavedStore";import{FREE_TIER_RULE_LIMIT as kt,MAX_RULES as Pt}from"../overrides/types";import{jsx as e,jsxs as l,Fragment as bt}from"react/jsx-runtime";function Ct({visible:r,paused:p,ignoredPatternValues:f,onTogglePattern:g,isPro:v,filter:c,ignoredPatterns:h,fromSaved:m,savedSearch:w,applySafeAreaInset:i}){const y=vt();const V=St();const C=y!=null&&y===V;const s=ht(y,{paused:p||!r});P(()=>{if(r&&s&&C){_.reportRendered(s.id)}},[r,s,C]);if(!r)return null;return l(E,{style:b.detailRoot,children:[s?e(et,{event:s,ignoredPatterns:f,onTogglePattern:g,showBodies:C}):e(E,{style:b.detailBodyFallback}),e(gt,{paused:p,filter:c,ignoredPatterns:h,isPro:v,fromSaved:m,savedSearch:w,applySafeAreaInset:i})]})}function Rt({visible:r,paused:p,isPro:f,filter:g,onFilterChange:v,ignoredPatterns:c,onRemovePattern:h,onAddPattern:m,onTogglePatternMode:w,isTeamPattern:i}){const{events:y}=pe({filter:g,ignoredPatterns:c,paused:p,visible:r,isPro:f});if(!r)return null;return e(Ze,{events:y,filter:g,onFilterChange:v,ignoredPatterns:c,onRemovePattern:h,onAddPattern:m,onTogglePatternMode:w,isTeamPattern:i})}function It({visible:r,paused:p,isPro:f,filter:g,ignoredPatterns:v,settings:c,onSettingsChange:h}){const{events:m}=pe({filter:g,ignoredPatterns:v,paused:p,visible:r,isPro:f});if(!r)return null;return e(tt,{settings:c,onSettingsChange:h,events:m})}function fe({visible:r,onClose:p,onBack:f,onMinimize:g,enableSharedModalDimensions:v=false,inline:c=false,paused:h,onPausedChange:m,remoteConditions:w}){const{isPro:i}=$e();const[y,V]=n(false);const C=h!=null&&m!=null;const s=C?h:y;const ge=t=>{const a=typeof t==="function"?t(s):t;if(C)m(a);else V(a)};const[d,q]=n({});const S=mt();const[k,Y]=n(false);const[A,Q]=n(false);const[B,H]=n(false);const[Z,R]=n(false);const[he,me]=n(0);const[M]=n(_e);P(()=>{M.update(w)},[M,w]);P(()=>()=>M.update(void 0),[M]);const I=true;const[Se,L]=n(null);const[U,ee]=n("filters");const[te,ve]=n("");const[z,j]=n(false);const Tt=x(false);const[re,we]=n("");const ye=x(null);const{patterns:N,values:ke,add:Pe,remove:be,toggle:Ce,toggleMode:Re,isTeamOnly:Ie}=Ye();const[F,oe]=n(rt);const K=x(false);const[W,J]=n(false);const[T,Ne]=n("export");const O=t=>{Ne(t);J(true)};P(()=>{if(W&&i){J(false)}},[W,i]);P(()=>{if(!r||K.current)return;const t=async()=>{try{const a=await de.getItem(D.network.copyOptions());if(a){const De=JSON.parse(a);oe(De)}}catch(a){}finally{K.current=true}};t()},[r]);P(()=>{if(!K.current)return;const t=async()=>{try{await de.setItem(D.network.copyOptions(),JSON.stringify(F))}catch(a){}};t()},[F]);const Te=()=>{_.clear()};const ne=G(t=>{_.select(t.id)},[]);const Ee=G((t,a)=>{L(a?{...t,id:a}:t);H(true);_.clear()},[]);const Me=G(()=>L(null),[]);const se=x(null);const ae=t=>{ve(t);q(a=>({...a,searchText:t}))};const Fe=t=>{q(a=>({...a,status:a.status===t?void 0:t}))};const[ie,Oe]=n("bottomSheet");const Ae=t=>{Oe(t)};P(()=>{if(z){requestAnimationFrame(()=>{ye.current?.focus()})}},[z]);const le=()=>{if(k){return l(o,{children:[e(o.Navigation,{onBack:()=>Y(false)}),e(o.Content,{title:"",noMargin:true,children:e(Je,{size:"sm",tabs:[{key:"filters",label:"Filters"},{key:"copy",label:"Copy"}],activeKey:U,onChange:t=>ee(t)})})]})}if(S){return l(o,{children:[e(o.Navigation,{onBack:Te}),e(o.Content,{title:"Request Details",centered:true}),l(o.Actions,{children:[I?e(ut,{onOpen:Ee}):null,e(st,{isPro:i,onUpgradePress:()=>O("saved")})]})]})}if(B&&I){return l(o,{children:[e(o.Navigation,{onBack:()=>{if(se.current?.())return;H(false);L(null)}}),e(o.Content,{title:"Response Overrides",centered:true})]})}if(A){return l(o,{children:[e(o.Navigation,{onBack:()=>Q(false)}),e(o.Content,{title:"Saved Requests",centered:true})]})}return l(o,{children:[f&&e(o.Navigation,{onBack:f}),e(o.Content,{title:"",children:z?e(o.Search,{value:te,onChangeText:ae,onCancel:()=>{ae("");j(false)},onDismiss:()=>j(false),dismissOnBlur:true,clearOnlyWhenText:true,placeholder:"Search URL, method, operation, error...",accessibilityLabel:"Search network requests",iconSize:14,testID:"buoy-network-search-input",clearTestID:"buoy-network-search-clear",inputProps:{"sentry-label":"ignore network search header"}}):e(ot,{activeStatus:d.status,onToggleStatus:Fe,ignoredPatterns:N,paused:s})}),l(o.Actions,{children:[e(He,{"sentry-label":"ignore open search",testID:"buoy-network-search-open",accessibilityLabel:"Open search",accessibilityRole:"button",onPress:()=>j(true),style:b.headerActionButton,children:e(Le,{size:14,color:u.color.textSecondary})}),I?e(dt,{onPress:()=>H(true)}):null,e(Xe,{isEnabled:!s,onToggle:()=>ge(t=>!t),accessibilityLabel:s?"Resume network capture":"Pause network capture",testID:"buoy-network-power"}),e(nt,{paused:s}),e(ft,{onPress:()=>R(t=>!t),isOpen:Z,hasIndicator:$})]})]})};const $=!!(d.status||d.method||d.contentType);const Be=v?D.modal.root():D.network.modal();if(!r)return null;const xe=S||!k;const ce=l(bt,{children:[l(E,{style:b.container,children:[e(Ct,{visible:S,paused:s,ignoredPatternValues:ke,onTogglePattern:Ce,isPro:i,filter:d,ignoredPatterns:N,fromSaved:A,savedSearch:re,applySafeAreaInset:!c&&ie==="bottomSheet"}),e(Rt,{visible:k&&U==="filters"&&!S,paused:s,isPro:i,filter:d,onFilterChange:q,ignoredPatterns:N,onRemovePattern:be,onAddPattern:Pe,onTogglePatternMode:Re,isTeamPattern:Ie}),e(It,{visible:k&&U==="copy"&&!S,paused:s,isPro:i,filter:d,ignoredPatterns:N,settings:F,onSettingsChange:oe}),e(ct,{visible:I&&B&&!S&&!k,isPro:i,onUpgradePress:()=>O("overrides"),pendingDraft:Se,onPendingConsumed:Me,backHandlerRef:se,applySafeAreaInset:!c&&ie==="bottomSheet"}),e(lt,{visible:A&&!S&&!k&&!(B&&I),isPro:i,copySettings:F,search:re,onSearchChange:we,onEventPress:ne,onUpgradePress:()=>O("saved")}),e(it,{visible:!S&&!k&&!A&&!(B&&I),paused:s,filter:d,ignoredPatterns:N,isPro:i,searchText:te,onEventPress:ne,onUpgradePress:()=>O("export")})]}),Z?l(pt,{onClose:()=>R(false),children:[e(X,{icon:e(Ue,{size:14,color:u.color.textSecondary}),label:"Network throttling",testID:"buoy-network-menu-throttling",onPress:()=>{R(false);Ve(w?M:void 0);if(!c)me(t=>t+1)}}),e(X,{icon:e(ze,{size:14,color:$?u.color.accent:u.color.textSecondary}),label:"Filters",detail:$?"Active":void 0,onPress:()=>{R(false);ee("filters");Y(true)}}),e(X,{icon:e(je,{size:14,color:u.color.textSecondary}),label:"Saved requests",onPress:()=>{R(false);Q(true)}}),e(E,{style:b.menuCopyRow,children:e(at,{isPro:i,filter:d,ignoredPatterns:N,copySettings:F,paused:s,onUpgradePress:()=>{R(false);O("export")},label:"Copy requests"})})]}):null,e(Ge,{visible:W,onClose:()=>J(false),featureName:T==="saved"?"Saved Requests":T==="overrides"?"Response Overrides":"Network Export",description:T==="saved"?"Keep the requests that matter. Saved requests survive Clear, app restarts, and the 500-request history cap.":T==="overrides"?"Force any endpoint to fail, stall or return something else \u2014 no backend changes, no code changes. Free keeps one active rule.":"Export network requests to share with your team, debug APIs, or feed into AI tools.",benefits:T==="overrides"?[`Run ${Pt} rules at once (free keeps ${kt})`,"Force a 500, a 401 or an empty list in one tap","Simulate offline, timeouts and slow connections","Rules survive an app reload, so you can test the boot path"]:T==="saved"?[`Save up to ${yt} requests (free keeps ${wt})`,"Failed requests stay put through a Clear","Snapshots survive an app restart","Export saved requests to teammates or AI assistants"]:["Export to JSON, Markdown, or plain text","Customizable copy presets (URLs only, LLM-ready, full data)","Share request details with teammates","Feed network data directly to AI assistants"]})]});if(c){return l(E,{style:b.inlineRoot,children:[e(E,{style:b.inlineHeader,...Qe,children:le()}),ce]})}return e(Ke,{visible:r,onClose:p,onMinimize:g,minimizeRequest:he,persistenceKey:Be,variant:"night",header:{showToggleButton:true,customContent:le()},onModeChange:Ae,enablePersistence:true,initialMode:"bottomSheet",enableGlitchEffects:true,disableScrollWrapper:xe,styles:{},children:ce})}const b=qe.create({container:{flex:1,backgroundColor:"transparent"},detailRoot:{flex:1,minHeight:0},detailBodyFallback:{flex:1},inlineRoot:{flex:1,minHeight:0,backgroundColor:"transparent"},inlineHeader:{paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:We.border.default,backgroundColor:"transparent"},menuCopyRow:{paddingHorizontal:6},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:u.color.buttonSurface,borderWidth:1,borderColor:u.color.border,alignItems:"center",justifyContent:"center"},activeFilterButton:{backgroundColor:u.color.accentSoft,borderColor:u.color.accentBorderStrong}});export function NetworkModal(r){return e(ue,{children:e(fe,{...r})})}export function NetworkToolView(r={}){return e(ue,{children:e(fe,{...r,inline:true,visible:true,onClose:Nt})})}const Nt=()=>{};
|
|
@@ -12,6 +12,8 @@ interface NetworkFilterViewV3Props {
|
|
|
12
12
|
ignoredPatterns?: IgnoredPattern[];
|
|
13
13
|
/** Remove a pattern by its value. */
|
|
14
14
|
onRemovePattern?: (pattern: string) => void;
|
|
15
|
+
/** Patterns from the team list on buoy.gg: shown with a TEAM badge, not a mode toggle. */
|
|
16
|
+
isTeamPattern?: (pattern: string) => boolean;
|
|
15
17
|
/** Add a new pattern with the user-selected mode. */
|
|
16
18
|
onAddPattern?: (pattern: IgnoredPattern) => void;
|
|
17
19
|
/** Flip a pattern's mode between `contains` and `exact`. */
|
|
@@ -21,6 +23,6 @@ interface NetworkFilterViewV3Props {
|
|
|
21
23
|
* Control panel for filtering captured network events by status, method, host, and content type.
|
|
22
24
|
* Provides quick toggles, stats, and ignored-pattern management reminiscent of desktop tooling.
|
|
23
25
|
*/
|
|
24
|
-
export declare function NetworkFilterViewV3({ events, filter, onFilterChange, ignoredPatterns, onRemovePattern, onAddPattern, onTogglePatternMode, }: NetworkFilterViewV3Props): import("react").JSX.Element;
|
|
26
|
+
export declare function NetworkFilterViewV3({ events, filter, onFilterChange, ignoredPatterns, onRemovePattern, isTeamPattern, onAddPattern, onTogglePatternMode, }: NetworkFilterViewV3Props): import("react").JSX.Element;
|
|
25
27
|
export {};
|
|
26
28
|
//# sourceMappingURL=NetworkFilterViewV3.d.ts.map
|
|
@@ -60,6 +60,8 @@ export interface NetworkFilterViewV3Props {
|
|
|
60
60
|
ignoredPatterns?: IgnoredPattern[];
|
|
61
61
|
/** Remove a pattern by its value. */
|
|
62
62
|
onRemovePattern?: (pattern: string) => void;
|
|
63
|
+
/** Patterns from the team list on buoy.gg: shown with a TEAM badge, not a mode toggle. */
|
|
64
|
+
isTeamPattern?: (pattern: string) => boolean;
|
|
63
65
|
/** Add a new pattern with the user-selected mode. */
|
|
64
66
|
onAddPattern?: (pattern: IgnoredPattern) => void;
|
|
65
67
|
/** Flip a pattern's mode between `contains` and `exact`. */
|
|
@@ -69,6 +71,6 @@ export interface NetworkFilterViewV3Props {
|
|
|
69
71
|
* Control panel for filtering captured network events by status, method, and
|
|
70
72
|
* content type, plus ignored-pattern management — same surface as native.
|
|
71
73
|
*/
|
|
72
|
-
export declare function NetworkFilterViewV3({ events, filter, onFilterChange, ignoredPatterns, onRemovePattern, onAddPattern, onTogglePatternMode, }: NetworkFilterViewV3Props): import("react").JSX.Element;
|
|
74
|
+
export declare function NetworkFilterViewV3({ events, filter, onFilterChange, ignoredPatterns, onRemovePattern, isTeamPattern, onAddPattern, onTogglePatternMode, }: NetworkFilterViewV3Props): import("react").JSX.Element;
|
|
73
75
|
export {};
|
|
74
76
|
//# sourceMappingURL=NetworkFilterViewV3.web.d.ts.map
|