react-native-inapp-inspector 2.5.10 → 2.5.12

package/dist/commonjs/components/Inspector/MediaGalleryTab.js

@@ -1,59 +1,68 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(t,r,l,s){s===void 0&&(s=l);var n=Object.getOwnPropertyDescriptor(r,l);(!n||("get"in n?!r.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return r[l]}}),Object.defineProperty(t,s,n)}):(function(t,r,l,s){s===void 0&&(s=l),t[s]=r[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(t,r){Object.defineProperty(t,"default",{enumerable:!0,value:r})}):function(t,r){t.default=r}),__importStar=this&&this.__importStar||(function(){var t=function(r){return t=Object.getOwnPropertyNames||function(l){var s=[];for(var n in l)Object.prototype.hasOwnProperty.call(l,n)&&(s[s.length]=n);return s},t(r)};return function(r){if(r&&r.__esModule)return r;var l={};if(r!=null)for(var s=t(r),n=0;n<s.length;n++)s[n]!=="default"&&__createBinding(l,r,s[n]);return __setModuleDefault(l,r),l}})(),__importDefault=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.MediaGalleryTab=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),EmptyState_1=__importDefault(require("../EmptyState")),NetworkIcons_1=require("../NetworkIcons"),MediaPreviewModal_1=require("./MediaPreviewModal"),capture_1=require("../../capture"),helpers_1=require("../../helpers"),toast_1=require("../../helpers/toast"),i18n_1=require("../../i18n"),InspectorContext_1=require("./InspectorContext"),ConfirmationModal_1=require("./ConfirmationModal"),MediaGalleryTab=()=>{const{t}=(0,i18n_1.useTranslation)(),{refreshMediaCount:r,switchActiveTab:l,previewMediaItem:s,setPreviewMediaItem:n}=(0,InspectorContext_1.useInspector)(),[c,A]=(0,react_1.useState)([]),[z,v]=(0,react_1.useState)(!1),[p,V]=(0,react_1.useState)("all"),[d,f]=(0,react_1.useState)(new Set),[u,S]=(0,react_1.useState)("grid"),[C,m]=(0,react_1.useState)({visible:!1,title:"",message:"",onConfirm:()=>{}}),x=async()=>{try{const e=p==="image"?"image":p==="video"?"video":"any",o=await capture_1.ScreenCapture.pickMedia({mediaType:e});o&&(await h(),r?.().catch(()=>{}),(0,toast_1.showToast)(o.type==="video"?t("mediaGallery.importedVideo","Video imported from Camera Roll"):t("mediaGallery.importedPhoto","Photo imported from Camera Roll")),n(o))}catch{(0,toast_1.showToast)(t("mediaGallery.importFailed","Failed to import media"))}},h=(0,react_1.useCallback)(async()=>{try{const e=await capture_1.ScreenCapture.getMediaList();A(e),r?.().catch(()=>{})}catch{A([])}},[r]);(0,react_1.useEffect)(()=>{h()},[h]);const M=async()=>{v(!0),await h(),v(!1)},g=(0,react_1.useMemo)(()=>p==="all"?c:c.filter(e=>e.type===p),[c,p]),w=(0,react_1.useMemo)(()=>c.reduce((e,o)=>e+(o.sizeBytes||0),0),[c]),I=(0,react_1.useCallback)(e=>{f(o=>{const i=new Set(o);return i.has(e)?i.delete(e):i.add(e),i})},[]),B=async e=>{await capture_1.ScreenCapture.deleteMedia(e.uri),f(i=>{const a=new Set(i);return a.delete(e.id),a}),await h(),await r?.()===0&&l("apis"),(0,toast_1.showToast)(t("mediaGallery.deleted"))},k=e=>{e?.uri&&(0,helpers_1.copyImageOrMediaToClipboard)(e.uri,e.type==="image"?"Image":"Media")},R=()=>{const e=c.filter(i=>d.has(i.id));if(e.length===0)return;const o=e.map(i=>i.uri).join(`
-`);(0,helpers_1.copyToClipboard)(o,`${e.length} Media URIs`),(0,toast_1.showToast)(`${e.length} file URIs copied to clipboard`)},O=async e=>{try{const o=e.uri.startsWith("file://")||e.uri.startsWith("content://")||e.uri.startsWith("http")?e.uri:`file://${e.uri}`;await react_native_1.Share.share({url:o,title:e.filename,message:e.filename})}catch{(0,toast_1.showToast)(t("mediaGallery.shareUnavailable","Sharing not available on this device"))}},G=async()=>{const e=c.filter(o=>d.has(o.id));if(e.length!==0)try{const o=e[0],i=o.uri.startsWith("file://")||o.uri.startsWith("content://")||o.uri.startsWith("http")?o.uri:`file://${o.uri}`;await react_native_1.Share.share({url:i,title:o.filename,message:e.length===1?o.filename:`${e.length} items: ${e.map(a=>a.filename).join(", ")}`})}catch{(0,toast_1.showToast)(t("mediaGallery.shareUnavailable","Sharing not available on this device"))}},D=()=>{const e=d.size;e!==0&&m({visible:!0,title:t("mediaGallery.deleteSelectedTitle","Delete Selected Media"),message:t("mediaGallery.deleteSelectedMessage",{count:e,defaultValue:`Are you sure you want to permanently delete ${e} media items?`}),confirmText:t("mediaGallery.delete","Delete"),cancelText:t("common.cancel","Cancel"),onConfirm:async()=>{m(a=>({...a,visible:!1}));const o=c.filter(a=>d.has(a.id));for(const a of o)await capture_1.ScreenCapture.deleteMedia(a.uri);f(new Set),await h(),await r?.()===0&&l("apis"),(0,toast_1.showToast)(t("mediaGallery.deletedCount",{count:o.length}))}})},F=()=>{m({visible:!0,title:t("mediaGallery.purgeTitle","Purge Gallery"),message:t("mediaGallery.purgeMessage",{count:c.length,size:(0,helpers_1.formatBytes)(w),defaultValue:`Are you sure you want to delete all ${c.length} media files (${(0,helpers_1.formatBytes)(w)})? This cannot be undone.`}),confirmText:t("common.clearAll","Clear All"),cancelText:t("common.cancel","Cancel"),onConfirm:async()=>{m(e=>({...e,visible:!1})),await capture_1.ScreenCapture.clearAllMedia(),f(new Set),await h(),await r?.(),l("apis"),(0,toast_1.showToast)(t("mediaGallery.allPurged"))}})},P=async e=>{await capture_1.ScreenCapture.convertToGif(e.uri,{fps:12,width:480})&&(await h(),r?.().catch(()=>{}))},W=(e,o)=>{const i=o?AppColors_1.AppColors.sky400:AppColors_1.AppColors.slate400,a=12;switch(e){case"all":return<NetworkIcons_1.ScreencastIcon size={a}color={i}/>;case"image":return<NetworkIcons_1.ImageIcon size={a}color={i}/>;case"video":return<NetworkIcons_1.FilmIcon size={a}color={i}/>;case"gif":return<NetworkIcons_1.GifIcon size={a}color={i}/>}},$=({item:e})=>{if(!e)return null;const o=e.type==="video",i=e.type==="gif",a=o&&e.thumbnailUri||e.uri,y=!!(e.id&&d.has(e.id)),T=(e.format||(o?"mp4":i?"gif":"png")).toUpperCase(),_=e.filename||(e.uri?e.uri.split("/").pop():"")||"Capture",b=e.timestamp?new Date(e.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}):"";return<TouchableScale_1.default onPress={()=>n(e)}style={[galleryStyles.card,y&&galleryStyles.cardSelected]}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(o,i,n,l){l===void 0&&(l=n);var a=Object.getOwnPropertyDescriptor(i,n);(!a||("get"in a?!i.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return i[n]}}),Object.defineProperty(o,l,a)}):(function(o,i,n,l){l===void 0&&(l=n),o[l]=i[n]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(o,i){Object.defineProperty(o,"default",{enumerable:!0,value:i})}):function(o,i){o.default=i}),__importStar=this&&this.__importStar||(function(){var o=function(i){return o=Object.getOwnPropertyNames||function(n){var l=[];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(l[l.length]=a);return l},o(i)};return function(i){if(i&&i.__esModule)return i;var n={};if(i!=null)for(var l=o(i),a=0;a<l.length;a++)l[a]!=="default"&&__createBinding(n,i,l[a]);return __setModuleDefault(n,i),n}})(),__importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.MediaGalleryTab=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),NetworkIcons_1=require("../NetworkIcons"),MediaPreviewModal_1=require("./MediaPreviewModal"),capture_1=require("../../capture"),helpers_1=require("../../helpers"),NativeInspector_1=require("../../native/NativeInspector"),toast_1=require("../../helpers/toast"),i18n_1=require("../../i18n"),InspectorContext_1=require("./InspectorContext"),ConfirmationModal_1=require("./ConfirmationModal"),MediaGalleryTab=()=>{const{t:o}=(0,i18n_1.useTranslation)(),{refreshMediaCount:i,switchActiveTab:n,previewMediaItem:l,setPreviewMediaItem:a}=(0,InspectorContext_1.useInspector)(),[s,I]=(0,react_1.useState)([]),[W,z]=(0,react_1.useState)(!1),[d,$]=(0,react_1.useState)("all"),[p,w]=(0,react_1.useState)(new Set),[h,R]=(0,react_1.useState)("grid"),[g,_]=(0,react_1.useState)(!1),[F,v]=(0,react_1.useState)(0),C=react_1.default.useRef(null),[f,b]=(0,react_1.useState)({visible:!1,title:"",message:"",onConfirm:()=>{}}),c=(0,react_1.useCallback)(async()=>{try{const e=await capture_1.ScreenCapture.getMediaList();I(e),i?.().catch(()=>{})}catch{I([])}},[i]);(0,react_1.useEffect)(()=>{c()},[c]),(0,react_1.useEffect)(()=>{capture_1.ScreenCapture.isRecording().then(e=>_(e)).catch(()=>{})},[]),(0,react_1.useEffect)(()=>(g?(v(0),C.current=setInterval(()=>{v(e=>e+1)},1e3)):(C.current&&(clearInterval(C.current),C.current=null),v(0)),()=>{C.current&&clearInterval(C.current)}),[g]);const G=async()=>{z(!0),await c(),z(!1)},m=(0,react_1.useMemo)(()=>{let e=0,t=0,r=0;return s.forEach(u=>{u.type==="image"?e++:u.type==="video"?t++:u.type==="gif"&&r++}),{all:s.length,image:e,video:t,gif:r}},[s]),x=(0,react_1.useMemo)(()=>d==="all"?s:s.filter(e=>e.type===d),[s,d]),A=(0,react_1.useMemo)(()=>s.reduce((e,t)=>e+(t.sizeBytes||0),0),[s]),M=(0,react_1.useCallback)(async()=>{try{(0,NativeInspector_1.triggerNativeHaptic)("light");const e=await capture_1.ScreenCapture.takeScreenshot({format:"png",quality:.9,hideInspector:!0});if(e){(0,NativeInspector_1.triggerNativeHaptic)("success");const t=(0,capture_1.generateCaptureId)("screenshot",e.format||"png"),r={id:t,type:"image",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||t,sizeBytes:e.sizeBytes,timestamp:e.timestamp,width:e.width,height:e.height};a(r),await c(),i?.().catch(()=>{}),(0,toast_1.showToast)(o("header.screenshotCaptured","Screenshot captured & saved"))}else(0,toast_1.showToast)(o("header.screenshotFailed","Failed to capture screenshot"))}catch{(0,toast_1.showToast)(o("header.screenshotError","Error capturing screenshot"))}},[c,i,a,o]),S=(0,react_1.useCallback)(async()=>{try{if(g){(0,NativeInspector_1.triggerNativeHaptic)("medium");const e=await capture_1.ScreenCapture.stopRecording();if(_(!1),e){(0,NativeInspector_1.triggerNativeHaptic)("success");const t=(0,capture_1.generateCaptureId)("video",e.format),r={id:t,type:e.format==="gif"?"gif":"video",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||t,sizeBytes:e.sizeBytes,timestamp:e.timestamp,durationMs:e.durationMs,width:e.width,height:e.height,hasAudio:e.hasAudio};a(r),await c(),i?.().catch(()=>{}),(0,toast_1.showToast)(o("header.recordingSaved",{duration:(e.durationMs/1e3).toFixed(1),defaultValue:`Recording saved (${(e.durationMs/1e3).toFixed(1)}s)`}))}}else(0,NativeInspector_1.triggerNativeHaptic)("medium"),await capture_1.ScreenCapture.startRecording({fps:24,audioSource:"none"})?(_(!0),(0,toast_1.showToast)(o("header.recordingStarted","Screen recording started"))):(0,toast_1.showToast)(o("header.recordingStartFailed","Failed to start screen recording"))}catch{(0,toast_1.showToast)(o("header.recordingError","Screen recording error")),_(!1)}},[g,c,i,a,o]),P=async()=>{try{(0,NativeInspector_1.triggerNativeHaptic)("light");const e=d==="image"?"image":d==="video"?"video":"any",t=await capture_1.ScreenCapture.pickMedia({mediaType:e});t&&((0,NativeInspector_1.triggerNativeHaptic)("success"),await c(),i?.().catch(()=>{}),(0,toast_1.showToast)(t.type==="video"?o("mediaGallery.importedVideo","Video imported from Camera Roll"):o("mediaGallery.importedPhoto","Photo imported from Camera Roll")),a(t))}catch{(0,toast_1.showToast)(o("mediaGallery.importFailed","Failed to import media"))}},D=(0,react_1.useCallback)(e=>{(0,NativeInspector_1.triggerNativeHaptic)("light"),w(t=>{const r=new Set(t);return r.has(e)?r.delete(e):r.add(e),r})},[]),O=async e=>{(0,NativeInspector_1.triggerNativeHaptic)("medium"),await capture_1.ScreenCapture.deleteMedia(e.uri),w(t=>{const r=new Set(t);return r.delete(e.id),r}),await c(),await i?.(),(0,toast_1.showToast)(o("mediaGallery.deleted","Media deleted"))},H=e=>{e?.uri&&((0,NativeInspector_1.triggerNativeHaptic)("light"),(0,helpers_1.copyImageOrMediaToClipboard)(e.uri,e.type==="image"?"Image":"Media"))},q=()=>{const e=s.filter(r=>p.has(r.id));if(e.length===0)return;(0,NativeInspector_1.triggerNativeHaptic)("light");const t=e.map(r=>r.uri).join(`
+`);(0,helpers_1.copyToClipboard)(t,`${e.length} Media URIs`),(0,toast_1.showToast)(`${e.length} file URIs copied to clipboard`)},N=async e=>{try{(0,NativeInspector_1.triggerNativeHaptic)("light");const t=e.uri.startsWith("file://")||e.uri.startsWith("content://")||e.uri.startsWith("http")?e.uri:`file://${e.uri}`;await react_native_1.Share.share({url:t,title:e.filename,message:e.filename})}catch{(0,toast_1.showToast)(o("mediaGallery.shareUnavailable","Sharing not available on this device"))}},j=async()=>{const e=s.filter(t=>p.has(t.id));if(e.length!==0)try{(0,NativeInspector_1.triggerNativeHaptic)("light");const t=e[0],r=t.uri.startsWith("file://")||t.uri.startsWith("content://")||t.uri.startsWith("http")?t.uri:`file://${t.uri}`;await react_native_1.Share.share({url:r,title:t.filename,message:e.length===1?t.filename:`${e.length} items: ${e.map(u=>u.filename).join(", ")}`})}catch{(0,toast_1.showToast)(o("mediaGallery.shareUnavailable","Sharing not available on this device"))}},L=()=>{const e=p.size;e!==0&&b({visible:!0,title:o("mediaGallery.deleteSelectedTitle","Delete Selected Media"),message:o("mediaGallery.deleteSelectedMessage",{count:e,defaultValue:`Are you sure you want to permanently delete ${e} media items?`}),confirmText:o("mediaGallery.delete","Delete"),cancelText:o("common.cancel","Cancel"),onConfirm:async()=>{b(r=>({...r,visible:!1}));const t=s.filter(r=>p.has(r.id));for(const r of t)await capture_1.ScreenCapture.deleteMedia(r.uri);w(new Set),await c(),await i?.(),(0,toast_1.showToast)(o("mediaGallery.deletedCount",{count:t.length,defaultValue:`Deleted ${t.length} items`}))}})},U=()=>{b({visible:!0,title:o("mediaGallery.purgeTitle","Purge Gallery"),message:o("mediaGallery.purgeMessage",{count:s.length,size:(0,helpers_1.formatBytes)(A),defaultValue:`Are you sure you want to delete all ${s.length} media files (${(0,helpers_1.formatBytes)(A)})? This cannot be undone.`}),confirmText:o("common.clearAll","Clear All"),cancelText:o("common.cancel","Cancel"),onConfirm:async()=>{b(e=>({...e,visible:!1})),await capture_1.ScreenCapture.clearAllMedia(),w(new Set),await c(),await i?.(),(0,toast_1.showToast)(o("mediaGallery.allPurged","All screencast files deleted"))}})},E=async e=>{await capture_1.ScreenCapture.convertToGif(e.uri,{fps:12,width:480})&&(await c(),i?.().catch(()=>{}))},B=e=>{const t=Math.floor(e/60),r=e%60;return`${t.toString().padStart(2,"0")}:${r.toString().padStart(2,"0")}`},Y=({item:e})=>{if(!e)return null;const t=e.type==="video",r=e.type==="gif",u=t&&e.thumbnailUri||e.uri,y=!!(e.id&&p.has(e.id)),k=(e.format||(t?"mp4":r?"gif":"png")).toUpperCase(),V=e.filename||(e.uri?e.uri.split("/").pop():"")||"Capture",T=e.timestamp?new Date(e.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}):"";return<TouchableScale_1.default onPress={()=>a(e)}style={[galleryStyles.card,y&&galleryStyles.cardSelected]}>
         <react_native_1.View style={galleryStyles.thumbnailContainer}>
-          {a?<react_native_1.Image source={{uri:a}}style={galleryStyles.thumbnail}resizeMode="cover"/>:<react_native_1.View style={galleryStyles.thumbnailFallback}>
-              {o?<NetworkIcons_1.FilmIcon size={26}color={AppColors_1.AppColors.sky400}/>:<NetworkIcons_1.ImageIcon size={26}color={AppColors_1.AppColors.slate400}/>}
+          {u?<react_native_1.Image source={{uri:u}}style={galleryStyles.thumbnail}resizeMode="cover"/>:<react_native_1.View style={galleryStyles.thumbnailFallback}>
+              {t?<NetworkIcons_1.FilmIcon size={28}color={AppColors_1.AppColors.sky500}/>:<NetworkIcons_1.ImageIcon size={28}color={AppColors_1.AppColors.grayTextWeak}/>}
             </react_native_1.View>}
 
           
-          <react_native_1.TouchableOpacity onPress={()=>e.id&&I(e.id)}style={[galleryStyles.checkbox,y&&galleryStyles.checkboxSelected]}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-            {y&&<NetworkIcons_1.CheckIcon size={12}color={AppColors_1.AppColors.white}/>}
+          <react_native_1.TouchableOpacity onPress={()=>e.id&&D(e.id)}style={[galleryStyles.checkbox,y&&galleryStyles.checkboxSelected]}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+            {y&&<NetworkIcons_1.CheckIcon size={11}color={AppColors_1.AppColors.white}/>}
           </react_native_1.TouchableOpacity>
 
-          {o&&<react_native_1.View style={galleryStyles.miniPlayCircle}>
+          
+          {t&&<react_native_1.View style={galleryStyles.miniPlayCircle}>
               <NetworkIcons_1.PlayIcon size={14}color={AppColors_1.AppColors.white}/>
             </react_native_1.View>}
-          <react_native_1.View style={galleryStyles.typeBadge}>
-            {o?<NetworkIcons_1.FilmIcon size={11}color={AppColors_1.AppColors.sky400}/>:i?<NetworkIcons_1.GifIcon size={11}color={AppColors_1.AppColors.warningAmber}/>:<NetworkIcons_1.ImageIcon size={11}color={AppColors_1.AppColors.emerald500}/>}
+
+          
+          <react_native_1.View style={[galleryStyles.typeBadge,{backgroundColor:t?"rgba(14, 165, 233, 0.88)":r?"rgba(245, 158, 11, 0.88)":"rgba(16, 185, 129, 0.88)"}]}>
             <react_native_1.Text style={galleryStyles.typeBadgeText}>
-              {T}
+              {k}
             </react_native_1.Text>
           </react_native_1.View>
+
+          
+          {t&&e.durationMs?<react_native_1.View style={galleryStyles.durationBadge}>
+              <react_native_1.Text style={galleryStyles.durationBadgeText}>
+                {B(Math.round(e.durationMs/1e3))}
+              </react_native_1.Text>
+            </react_native_1.View>:null}
         </react_native_1.View>
 
         <react_native_1.View style={galleryStyles.cardInfo}>
           <react_native_1.Text style={galleryStyles.cardTitle}numberOfLines={1}>
-            {_}
+            {V}
           </react_native_1.Text>
           <react_native_1.View style={galleryStyles.cardMetaRow}>
             <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4,flex:1,minWidth:0}}>
               <react_native_1.Text style={galleryStyles.cardMeta}numberOfLines={1}>
                 {(0,helpers_1.formatBytes)(e.sizeBytes||0)}
               </react_native_1.Text>
-              {b?<>
+              {T?<>
                   <react_native_1.Text style={galleryStyles.cardMetaDot}>•</react_native_1.Text>
                   <react_native_1.Text style={galleryStyles.cardMeta}numberOfLines={1}>
-                    {b}
+                    {T}
                   </react_native_1.Text>
                 </>:null}
             </react_native_1.View>
-            <react_native_1.TouchableOpacity onPress={()=>k(e)}style={galleryStyles.gridCopyBtn}hitSlop={{top:6,bottom:6,left:6,right:6}}>
-              <NetworkIcons_1.CopyIcon size={11}color={AppColors_1.AppColors.slate400}/>
+            <react_native_1.TouchableOpacity onPress={()=>H(e)}style={galleryStyles.gridCopyBtn}hitSlop={{top:6,bottom:6,left:6,right:6}}>
+              <NetworkIcons_1.CopyIcon size={11}color={AppColors_1.AppColors.grayText}/>
             </react_native_1.TouchableOpacity>
           </react_native_1.View>
         </react_native_1.View>
-      </TouchableScale_1.default>},L=({item:e})=>{if(!e)return null;const o=e.type==="video",i=e.type==="gif",a=o&&e.thumbnailUri||e.uri,y=!!(e.id&&d.has(e.id)),T=(e.format||(o?"mp4":i?"gif":"png")).toUpperCase(),_=e.filename||(e.uri?e.uri.split("/").pop():"")||"Capture",b=e.timestamp?`${new Date(e.timestamp).toLocaleDateString([],{month:"short",day:"numeric"})} ${new Date(e.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}`:"";return<TouchableScale_1.default onPress={()=>n(e)}style={[galleryStyles.listRow,y&&galleryStyles.listRowSelected]}>
+      </TouchableScale_1.default>},K=({item:e})=>{if(!e)return null;const t=e.type==="video",r=e.type==="gif",u=t&&e.thumbnailUri||e.uri,y=!!(e.id&&p.has(e.id)),k=(e.format||(t?"mp4":r?"gif":"png")).toUpperCase(),V=e.filename||(e.uri?e.uri.split("/").pop():"")||"Capture",T=e.timestamp?`${new Date(e.timestamp).toLocaleDateString([],{month:"short",day:"numeric"})} ${new Date(e.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}`:"";return<TouchableScale_1.default onPress={()=>a(e)}style={[galleryStyles.listRow,y&&galleryStyles.listRowSelected]}>
         
-        <react_native_1.TouchableOpacity onPress={()=>e.id&&I(e.id)}style={[galleryStyles.listCheckbox,y&&galleryStyles.checkboxSelected]}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-          {y&&<NetworkIcons_1.CheckIcon size={12}color={AppColors_1.AppColors.white}/>}
+        <react_native_1.TouchableOpacity onPress={()=>e.id&&D(e.id)}style={[galleryStyles.listCheckbox,y&&galleryStyles.checkboxSelected]}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+          {y&&<NetworkIcons_1.CheckIcon size={11}color={AppColors_1.AppColors.white}/>}
         </react_native_1.TouchableOpacity>
 
         
         <react_native_1.View style={galleryStyles.listThumbContainer}>
-          {a?<react_native_1.Image source={{uri:a}}style={galleryStyles.listThumb}resizeMode="cover"/>:<react_native_1.View style={galleryStyles.listThumbFallback}>
-              {o?<NetworkIcons_1.FilmIcon size={18}color={AppColors_1.AppColors.sky400}/>:<NetworkIcons_1.ImageIcon size={18}color={AppColors_1.AppColors.slate400}/>}
+          {u?<react_native_1.Image source={{uri:u}}style={galleryStyles.listThumb}resizeMode="cover"/>:<react_native_1.View style={galleryStyles.listThumbFallback}>
+              {t?<NetworkIcons_1.FilmIcon size={18}color={AppColors_1.AppColors.sky500}/>:<NetworkIcons_1.ImageIcon size={18}color={AppColors_1.AppColors.grayTextWeak}/>}
             </react_native_1.View>}
-          {o&&<react_native_1.View style={galleryStyles.listMiniPlay}>
+          {t&&<react_native_1.View style={galleryStyles.listMiniPlay}>
               <NetworkIcons_1.PlayIcon size={10}color={AppColors_1.AppColors.white}/>
             </react_native_1.View>}
         </react_native_1.View>
@@ -61,22 +70,21 @@
         
         <react_native_1.View style={galleryStyles.listInfo}>
           <react_native_1.Text style={galleryStyles.listTitle}numberOfLines={1}>
-            {_}
+            {V}
           </react_native_1.Text>
           <react_native_1.View style={galleryStyles.listMetaRow}>
-            <react_native_1.View style={galleryStyles.listBadge}>
-              {o?<NetworkIcons_1.FilmIcon size={10}color={AppColors_1.AppColors.sky400}/>:i?<NetworkIcons_1.GifIcon size={10}color={AppColors_1.AppColors.warningAmber}/>:<NetworkIcons_1.ImageIcon size={10}color={AppColors_1.AppColors.emerald500}/>}
-              <react_native_1.Text style={galleryStyles.listBadgeText}>
-                {T}
+            <react_native_1.View style={[galleryStyles.listBadge,{backgroundColor:t?`${AppColors_1.AppColors.sky500}18`:r?`${AppColors_1.AppColors.amber500}18`:`${AppColors_1.AppColors.green600}18`}]}>
+              <react_native_1.Text style={[galleryStyles.listBadgeText,{color:t?AppColors_1.AppColors.sky600:r?AppColors_1.AppColors.amber500:AppColors_1.AppColors.green600}]}>
+                {k}
               </react_native_1.Text>
             </react_native_1.View>
             <react_native_1.Text style={galleryStyles.cardMeta}>
               {(0,helpers_1.formatBytes)(e.sizeBytes||0)}
             </react_native_1.Text>
-            {b?<>
+            {T?<>
                 <react_native_1.Text style={galleryStyles.cardMetaDot}>•</react_native_1.Text>
                 <react_native_1.Text style={galleryStyles.cardMeta}>
-                  {b}
+                  {T}
                 </react_native_1.Text>
               </>:null}
           </react_native_1.View>
@@ -84,119 +92,208 @@
 
         
         <react_native_1.View style={galleryStyles.listActionsRow}>
-          <react_native_1.TouchableOpacity onPress={()=>k(e)}style={galleryStyles.listCopyBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-            <NetworkIcons_1.CopyIcon size={13}color={AppColors_1.AppColors.slate200}/>
+          <react_native_1.TouchableOpacity onPress={()=>H(e)}style={galleryStyles.listActionBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+            <NetworkIcons_1.CopyIcon size={13}color={AppColors_1.AppColors.grayText}/>
           </react_native_1.TouchableOpacity>
 
-          <react_native_1.TouchableOpacity onPress={()=>O(e)}style={galleryStyles.listShareBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-            <NetworkIcons_1.ShareIcon size={13}color={AppColors_1.AppColors.sky400}/>
+          <react_native_1.TouchableOpacity onPress={()=>N(e)}style={galleryStyles.listActionBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+            <NetworkIcons_1.ShareIcon size={13}color={AppColors_1.AppColors.sky600}/>
           </react_native_1.TouchableOpacity>
 
-          <react_native_1.TouchableOpacity onPress={()=>B(e)}style={galleryStyles.listDeleteBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+          <react_native_1.TouchableOpacity onPress={()=>O(e)}style={galleryStyles.listActionBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
             <NetworkIcons_1.TrashIcon size={13}color={AppColors_1.AppColors.red500}/>
           </react_native_1.TouchableOpacity>
         </react_native_1.View>
       </TouchableScale_1.default>};return<react_native_1.View style={galleryStyles.container}>
       
       <react_native_1.View style={galleryStyles.topHeaderBar}>
-        <react_native_1.TouchableOpacity onPress={()=>l("apis")}style={galleryStyles.backToTabBtn}accessibilityLabel="Back to Inspector"hitSlop={{top:8,bottom:8,left:8,right:8}}>
-          <NetworkIcons_1.WhiteBackNavigation size={15}color={AppColors_1.AppColors.purple}/>
+        <react_native_1.TouchableOpacity onPress={()=>n("apis")}style={galleryStyles.backToTabBtn}accessibilityLabel="Back to Inspector"hitSlop={{top:8,bottom:8,left:8,right:8}}>
+          <NetworkIcons_1.WhiteBackNavigation size={14}color={AppColors_1.AppColors.purple}/>
           <react_native_1.Text style={galleryStyles.backToTabText}>
-            {t("common.back","Back to Inspector")}
+            {o("common.back","Back")}
           </react_native_1.Text>
         </react_native_1.TouchableOpacity>
 
-        <react_native_1.TouchableOpacity onPress={()=>l("apis")}style={galleryStyles.closeCircleBtn}accessibilityLabel="Close Screencast"hitSlop={{top:8,bottom:8,left:8,right:8}}>
-          <NetworkIcons_1.CloseWhite size={14}color={AppColors_1.AppColors.grayTextStrong}/>
+        <react_native_1.View style={galleryStyles.headerCenterTitle}>
+          <NetworkIcons_1.ScreencastIcon size={15}color={AppColors_1.AppColors.purple}/>
+          <react_native_1.Text style={galleryStyles.headerStudioTitle}>
+            {o("tabs.media","Screencast")}
+          </react_native_1.Text>
+          {m.all>0&&<react_native_1.View style={galleryStyles.headerBadge}>
+              <react_native_1.Text style={galleryStyles.headerBadgeText}>{m.all}</react_native_1.Text>
+            </react_native_1.View>}
+        </react_native_1.View>
+
+        <react_native_1.TouchableOpacity onPress={()=>n("apis")}style={galleryStyles.closeCircleBtn}accessibilityLabel="Close Screencast"hitSlop={{top:8,bottom:8,left:8,right:8}}>
+          <NetworkIcons_1.CloseWhite size={12}color={AppColors_1.AppColors.grayTextStrong}/>
         </react_native_1.TouchableOpacity>
       </react_native_1.View>
 
       
+      {g&&<react_native_1.View style={galleryStyles.recordingBanner}>
+          <react_native_1.View style={galleryStyles.recordingDot}/>
+          <react_native_1.Text style={galleryStyles.recordingBannerText}>
+            {o("header.recordingScreen","Screen Recording Active")} • {B(F)}
+          </react_native_1.Text>
+          <react_native_1.TouchableOpacity onPress={S}style={galleryStyles.stopRecordBtn}activeOpacity={.8}>
+            <react_native_1.View style={galleryStyles.stopSquare}/>
+            <react_native_1.Text style={galleryStyles.stopRecordBtnText}>Stop & Save</react_native_1.Text>
+          </react_native_1.TouchableOpacity>
+        </react_native_1.View>}
+
+      
+      <react_native_1.View style={galleryStyles.quickActionsBar}>
+        <TouchableScale_1.default onPress={M}style={[galleryStyles.quickBtn,{backgroundColor:`${AppColors_1.AppColors.purple}10`,borderColor:`${AppColors_1.AppColors.purple}30`}]}>
+          <NetworkIcons_1.CameraIcon size={14}color={AppColors_1.AppColors.purple}/>
+          <react_native_1.Text style={[galleryStyles.quickBtnText,{color:AppColors_1.AppColors.purple}]}>
+            {o("header.screenshot","Screenshot")}
+          </react_native_1.Text>
+        </TouchableScale_1.default>
+
+        <TouchableScale_1.default onPress={S}style={[galleryStyles.quickBtn,g?{backgroundColor:`${AppColors_1.AppColors.red500}18`,borderColor:AppColors_1.AppColors.red500}:{backgroundColor:`${AppColors_1.AppColors.sky600}10`,borderColor:`${AppColors_1.AppColors.sky600}30`}]}>
+          <NetworkIcons_1.VideoCameraIcon size={14}color={g?AppColors_1.AppColors.red500:AppColors_1.AppColors.sky600}/>
+          <react_native_1.Text style={[galleryStyles.quickBtnText,{color:g?AppColors_1.AppColors.red500:AppColors_1.AppColors.sky600}]}>
+            {g?`Stop (${B(F)})`:o("header.videoRecord","Record Video")}
+          </react_native_1.Text>
+        </TouchableScale_1.default>
+
+        <TouchableScale_1.default onPress={P}style={[galleryStyles.quickBtn,{backgroundColor:`${AppColors_1.AppColors.emerald500}10`,borderColor:`${AppColors_1.AppColors.emerald500}30`}]}>
+          <NetworkIcons_1.CameraRollIcon size={14}color={AppColors_1.AppColors.green600}/>
+          <react_native_1.Text style={[galleryStyles.quickBtnText,{color:AppColors_1.AppColors.green600}]}>
+            {o("common.import","Import")}
+          </react_native_1.Text>
+        </TouchableScale_1.default>
+      </react_native_1.View>
+
+      
       <react_native_1.View style={galleryStyles.filterBar}>
         <react_native_1.View style={galleryStyles.chipGroup}>
-          {["all","image","video","gif"].map(e=>{const o=p===e,i=e==="all"?t("mediaGallery.all",{count:c.length}):t(e==="image"?"mediaGallery.photos":e==="video"?"mediaGallery.videos":"mediaGallery.gifs");return<react_native_1.TouchableOpacity key={e}onPress={()=>V(e)}style={[galleryStyles.chip,o&&galleryStyles.chipActive]}>
-                {W(e,o)}
-                <react_native_1.Text style={[galleryStyles.chipText,o&&galleryStyles.chipTextActive]}>
-                  {i}
+          {[{key:"all",label:o("common.all","All"),count:m.all},{key:"image",label:o("mediaGallery.photos","Photos"),count:m.image},{key:"video",label:o("mediaGallery.videos","Videos"),count:m.video},{key:"gif",label:o("mediaGallery.gifs","GIFs"),count:m.gif}].map(e=>{const t=d===e.key;return<react_native_1.TouchableOpacity key={e.key}onPress={()=>{(0,NativeInspector_1.triggerNativeHaptic)("light"),$(e.key)}}style={[galleryStyles.chip,t&&galleryStyles.chipActive]}>
+                <react_native_1.Text style={[galleryStyles.chipText,t&&galleryStyles.chipTextActive]}>
+                  {e.label}
                 </react_native_1.Text>
+                <react_native_1.View style={[galleryStyles.chipBadge,t&&galleryStyles.chipBadgeActive]}>
+                  <react_native_1.Text style={[galleryStyles.chipBadgeText,t&&galleryStyles.chipBadgeTextActive]}>
+                    {e.count}
+                  </react_native_1.Text>
+                </react_native_1.View>
               </react_native_1.TouchableOpacity>})}
         </react_native_1.View>
 
         
-        <react_native_1.View style={galleryStyles.rightControls}>
-          <react_native_1.TouchableOpacity onPress={x}style={galleryStyles.importBtn}accessibilityLabel="Open Camera Roll"hitSlop={{top:6,bottom:6,left:6,right:6}}>
-            <NetworkIcons_1.CameraRollIcon size={12}color={AppColors_1.AppColors.sky400}/>
-            <react_native_1.Text style={galleryStyles.importBtnText}>
-              {p==="image"?"Photos":p==="video"?"Videos":"Import"}
-            </react_native_1.Text>
+        <react_native_1.View style={galleryStyles.viewToggleContainer}>
+          <react_native_1.TouchableOpacity onPress={()=>{(0,NativeInspector_1.triggerNativeHaptic)("light"),R("grid")}}style={[galleryStyles.viewToggleBtn,h==="grid"&&galleryStyles.viewToggleBtnActive]}>
+            <NetworkIcons_1.GridIcon size={13}color={h==="grid"?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>
+          </react_native_1.TouchableOpacity>
+          <react_native_1.TouchableOpacity onPress={()=>{(0,NativeInspector_1.triggerNativeHaptic)("light"),R("list")}}style={[galleryStyles.viewToggleBtn,h==="list"&&galleryStyles.viewToggleBtnActive]}>
+            <NetworkIcons_1.ListIcon size={13}color={h==="list"?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>
           </react_native_1.TouchableOpacity>
-
-          
-          <react_native_1.View style={galleryStyles.viewToggleContainer}>
-            <react_native_1.TouchableOpacity onPress={()=>S("grid")}style={[galleryStyles.viewToggleBtn,u==="grid"&&galleryStyles.viewToggleBtnActive]}>
-              <NetworkIcons_1.GridIcon size={13}color={u==="grid"?AppColors_1.AppColors.white:AppColors_1.AppColors.slate400}/>
-            </react_native_1.TouchableOpacity>
-            <react_native_1.TouchableOpacity onPress={()=>S("list")}style={[galleryStyles.viewToggleBtn,u==="list"&&galleryStyles.viewToggleBtnActive]}>
-              <NetworkIcons_1.ListIcon size={13}color={u==="list"?AppColors_1.AppColors.white:AppColors_1.AppColors.slate400}/>
-            </react_native_1.TouchableOpacity>
-          </react_native_1.View>
         </react_native_1.View>
       </react_native_1.View>
 
       
-      {c.length>0&&<react_native_1.View style={galleryStyles.subBar}>
+      {s.length>0&&<react_native_1.View style={galleryStyles.subBar}>
           <react_native_1.View style={galleryStyles.resultCountWrapper}>
-            <react_native_1.Text style={[galleryStyles.resultCountText,d.size>0&&galleryStyles.resultCountTextSelected]}>
-              {d.size>0?t("mediaGallery.selectedOfResults",{selected:d.size,total:g.length,defaultValue:`Selected ${d.size} of ${g.length} results`}):g.length!==c.length?t("mediaGallery.showingFilteredResults",{count:g.length,total:c.length,defaultValue:`Showing ${g.length} of ${c.length} results`}):t("mediaGallery.showingResults",{count:g.length,defaultValue:`Showing ${g.length} results`})}
+            <react_native_1.Text style={[galleryStyles.resultCountText,p.size>0&&galleryStyles.resultCountTextSelected]}>
+              {p.size>0?`${p.size} of ${x.length} selected`:`${x.length} ${x.length===1?"item":"items"} \u2022 ${(0,helpers_1.formatBytes)(A)}`}
             </react_native_1.Text>
           </react_native_1.View>
 
           <react_native_1.View style={galleryStyles.actionsGroup}>
-            {d.size>0&&<>
-                <react_native_1.TouchableOpacity onPress={R}style={galleryStyles.copySelectedBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-                  <NetworkIcons_1.CopyIcon size={12}color={AppColors_1.AppColors.slate200}/>
+            {p.size>0?<>
+                <react_native_1.TouchableOpacity onPress={q}style={galleryStyles.copySelectedBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+                  <NetworkIcons_1.CopyIcon size={11}color={AppColors_1.AppColors.grayTextStrong}/>
                   <react_native_1.Text style={galleryStyles.copySelectedBtnText}>
-                    {t("mediaGallery.copyUri","Copy URI")}
+                    Copy
                   </react_native_1.Text>
                 </react_native_1.TouchableOpacity>
 
-                <react_native_1.TouchableOpacity onPress={G}style={galleryStyles.shareSelectedBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-                  <NetworkIcons_1.ShareIcon size={12}color={AppColors_1.AppColors.sky400}/>
+                <react_native_1.TouchableOpacity onPress={j}style={galleryStyles.shareSelectedBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+                  <NetworkIcons_1.ShareIcon size={11}color={AppColors_1.AppColors.sky600}/>
                   <react_native_1.Text style={galleryStyles.shareSelectedBtnText}>
-                    {t("mediaGallery.share","Share")}
+                    Share
                   </react_native_1.Text>
                 </react_native_1.TouchableOpacity>
 
-                <react_native_1.TouchableOpacity onPress={D}style={galleryStyles.deleteBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-                  <NetworkIcons_1.TrashIcon size={13}color={AppColors_1.AppColors.red500}/>
+                <react_native_1.TouchableOpacity onPress={L}style={galleryStyles.deleteBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+                  <NetworkIcons_1.TrashIcon size={11}color={AppColors_1.AppColors.red500}/>
                   <react_native_1.Text style={galleryStyles.deleteBtnText}>
-                    {t("mediaGallery.deleteSelected",{count:d.size})}
+                    Delete ({p.size})
                   </react_native_1.Text>
                 </react_native_1.TouchableOpacity>
-              </>}
-
-            <react_native_1.TouchableOpacity onPress={F}style={galleryStyles.clearBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
-              <NetworkIcons_1.TrashIcon size={13}color={AppColors_1.AppColors.red500}/>
-              <react_native_1.Text style={galleryStyles.clearBtnText}>
-                {t("mediaGallery.purge",{size:(0,helpers_1.formatBytes)(w)})}
-              </react_native_1.Text>
-            </react_native_1.TouchableOpacity>
+              </>:<react_native_1.TouchableOpacity onPress={U}style={galleryStyles.clearBtn}hitSlop={{top:8,bottom:8,left:8,right:8}}>
+                <NetworkIcons_1.TrashIcon size={11}color={AppColors_1.AppColors.red500}/>
+                <react_native_1.Text style={galleryStyles.clearBtnText}>
+                  Purge All
+                </react_native_1.Text>
+              </react_native_1.TouchableOpacity>}
           </react_native_1.View>
         </react_native_1.View>}
 
       
-      <react_native_1.FlatList key={u}data={g}keyExtractor={e=>e.id}renderItem={u==="grid"?$:L}numColumns={u==="grid"?2:1}columnWrapperStyle={u==="grid"?galleryStyles.columnWrapper:void 0}style={{flex:1}}contentContainerStyle={[galleryStyles.listContent,{flexGrow:1}]}nestedScrollEnabled={!0}keyboardShouldPersistTaps="handled"refreshControl={<react_native_1.RefreshControl refreshing={z}onRefresh={M}tintColor={AppColors_1.AppColors.sky400}/>}ListEmptyComponent={<react_native_1.View style={galleryStyles.emptyContainer}>
-            <EmptyState_1.default customTitle={p==="image"?"No Photos Found":p==="video"?"No Videos Found":t("mediaGallery.noMediaTitle")}customSub={p==="image"?"Take a screenshot or import photos from Camera Roll.":p==="video"?"Record a video or import videos from Camera Roll.":t("mediaGallery.noMediaDesc")}showReload={!1}/>
-            <react_native_1.TouchableOpacity onPress={x}style={galleryStyles.emptyImportBtn}activeOpacity={.8}>
-              <NetworkIcons_1.CameraRollIcon size={14}color={AppColors_1.AppColors.white}/>
-              <react_native_1.Text style={galleryStyles.emptyImportBtnText}>
-                {p==="image"?t("mediaGallery.importPhotos","Import Photos from Camera Roll"):p==="video"?t("mediaGallery.importVideos","Import Videos from Camera Roll"):t("mediaGallery.openCameraRoll","Open Camera Roll")}
-              </react_native_1.Text>
-            </react_native_1.TouchableOpacity>
+      <react_native_1.FlatList key={h}data={x}keyExtractor={e=>e.id}renderItem={h==="grid"?Y:K}numColumns={h==="grid"?2:1}columnWrapperStyle={h==="grid"?galleryStyles.columnWrapper:void 0}style={{flex:1}}contentContainerStyle={[galleryStyles.listContent,{flexGrow:1}]}nestedScrollEnabled={!0}keyboardShouldPersistTaps="handled"refreshControl={<react_native_1.RefreshControl refreshing={W}onRefresh={G}tintColor={AppColors_1.AppColors.purple}/>}ListEmptyComponent={<react_native_1.View style={galleryStyles.emptyHeroCard}>
+            <react_native_1.View style={galleryStyles.emptyIconCircle}>
+              <NetworkIcons_1.ScreencastIcon size={32}color={AppColors_1.AppColors.purple}/>
+            </react_native_1.View>
+
+            <react_native_1.Text style={galleryStyles.emptyHeroTitle}>
+              {d==="image"?"No Screenshots Yet":d==="video"?"No Screen Recordings Yet":d==="gif"?"No Animated GIFs Yet":"Screencast & Media Studio"}
+            </react_native_1.Text>
+
+            <react_native_1.Text style={galleryStyles.emptyHeroSubtitle}>
+              {d==="image"?"Take a full-screen application snapshot or import photos from your device library.":d==="video"?"Record high-FPS screen videos with audio narration to reproduce and debug issues.":"Capture pixel-perfect screenshots, record 60fps screen videos, and export GIF animations with zero background overhead."}
+            </react_native_1.Text>
+
+            
+            <react_native_1.View style={galleryStyles.emptyActionsGrid}>
+              <TouchableScale_1.default onPress={M}style={galleryStyles.emptyActionCard}>
+                <react_native_1.View style={[galleryStyles.actionCardIconBox,{backgroundColor:`${AppColors_1.AppColors.purple}14`}]}>
+                  <NetworkIcons_1.CameraIcon size={18}color={AppColors_1.AppColors.purple}/>
+                </react_native_1.View>
+                <react_native_1.View style={galleryStyles.actionCardTextBox}>
+                  <react_native_1.Text style={galleryStyles.actionCardTitle}>Take Screenshot</react_native_1.Text>
+                  <react_native_1.Text style={galleryStyles.actionCardDesc}>Full-window lossless PNG</react_native_1.Text>
+                </react_native_1.View>
+              </TouchableScale_1.default>
+
+              <TouchableScale_1.default onPress={S}style={galleryStyles.emptyActionCard}>
+                <react_native_1.View style={[galleryStyles.actionCardIconBox,{backgroundColor:`${AppColors_1.AppColors.sky600}14`}]}>
+                  <NetworkIcons_1.VideoCameraIcon size={18}color={AppColors_1.AppColors.sky600}/>
+                </react_native_1.View>
+                <react_native_1.View style={galleryStyles.actionCardTextBox}>
+                  <react_native_1.Text style={galleryStyles.actionCardTitle}>Record Screen Video</react_native_1.Text>
+                  <react_native_1.Text style={galleryStyles.actionCardDesc}>High-FPS MP4 with audio</react_native_1.Text>
+                </react_native_1.View>
+              </TouchableScale_1.default>
+
+              <TouchableScale_1.default onPress={P}style={galleryStyles.emptyActionCard}>
+                <react_native_1.View style={[galleryStyles.actionCardIconBox,{backgroundColor:`${AppColors_1.AppColors.emerald500}14`}]}>
+                  <NetworkIcons_1.CameraRollIcon size={18}color={AppColors_1.AppColors.green600}/>
+                </react_native_1.View>
+                <react_native_1.View style={galleryStyles.actionCardTextBox}>
+                  <react_native_1.Text style={galleryStyles.actionCardTitle}>Import from Camera Roll</react_native_1.Text>
+                  <react_native_1.Text style={galleryStyles.actionCardDesc}>Device photos & videos</react_native_1.Text>
+                </react_native_1.View>
+              </TouchableScale_1.default>
+            </react_native_1.View>
+
+            
+            <react_native_1.View style={galleryStyles.featurePillsRow}>
+              <react_native_1.View style={galleryStyles.featurePill}>
+                <react_native_1.Text style={galleryStyles.featurePillText}>⚡ Zero Overhead</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={galleryStyles.featurePill}>
+                <react_native_1.Text style={galleryStyles.featurePillText}>✂️ Crop & Annotate</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={galleryStyles.featurePill}>
+                <react_native_1.Text style={galleryStyles.featurePillText}>🎞️ Convert to GIF</react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
           </react_native_1.View>}/>
 
       
-      <MediaPreviewModal_1.MediaPreviewModal item={s}visible={!!s}onClose={()=>n(null)}onDelete={B}onConvertToGif={P}/>
+      <MediaPreviewModal_1.MediaPreviewModal item={l}visible={!!l}onClose={()=>a(null)}onDelete={O}onConvertToGif={E}/>
 
-      <ConfirmationModal_1.ConfirmationModal visible={C.visible}title={C.title}message={C.message}confirmText={C.confirmText}cancelText={C.cancelText}isDestructive={!0}icon="trash"onConfirm={C.onConfirm}onCancel={()=>m(e=>({...e,visible:!1}))}/>
-    </react_native_1.View>};exports.MediaGalleryTab=MediaGalleryTab;const{width:WINDOW_WIDTH}=react_native_1.Dimensions.get("window"),CARD_WIDTH=(WINDOW_WIDTH-36)/2,galleryStyles=react_native_1.StyleSheet.create({container:{flex:1,backgroundColor:AppColors_1.AppColors.slate850},topHeaderBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:8,backgroundColor:AppColors_1.AppColors.primaryLight,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor},backToTabBtn:{flexDirection:"row",alignItems:"center",gap:6,paddingVertical:3,paddingHorizontal:6},backToTabText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:12,color:AppColors_1.AppColors.purple},closeCircleBtn:{width:26,height:26,borderRadius:13,backgroundColor:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,alignItems:"center",justifyContent:"center"},filterBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:9,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.borderGlassLight,gap:8},chipGroup:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:1},chip:{flexDirection:"row",alignItems:"center",gap:4.5,paddingHorizontal:8,paddingVertical:4.5,borderRadius:6,backgroundColor:AppColors_1.AppColors.whiteAlpha06,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha10},chipActive:{backgroundColor:`${AppColors_1.AppColors.sky400}2E`,borderColor:AppColors_1.AppColors.sky400},chipText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.slate400},chipTextActive:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.sky400},subBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:7,backgroundColor:`${AppColors_1.AppColors.slate900}99`,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.borderGlassLight,gap:8},resultCountWrapper:{flexDirection:"row",alignItems:"center",flexShrink:1},resultCountText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.slate400},resultCountTextSelected:{fontFamily:AppFonts_1.AppFonts.interSemiBold,color:AppColors_1.AppColors.sky400},actionsGroup:{flexDirection:"row",alignItems:"center",gap:6},rightControls:{flexDirection:"row",alignItems:"center",gap:6},importBtn:{flexDirection:"row",alignItems:"center",gap:5,backgroundColor:`${AppColors_1.AppColors.sky500}1F`,borderColor:`${AppColors_1.AppColors.sky400}44`,borderWidth:1,paddingHorizontal:8,paddingVertical:4.5,borderRadius:6},importBtnText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11,color:AppColors_1.AppColors.sky400},emptyContainer:{alignItems:"center",justifyContent:"center",paddingVertical:36},emptyImportBtn:{flexDirection:"row",alignItems:"center",gap:7,backgroundColor:AppColors_1.AppColors.sky500,paddingHorizontal:16,paddingVertical:10,borderRadius:8,marginTop:18,shadowColor:AppColors_1.AppColors.sky500,shadowOffset:{width:0,height:2},shadowOpacity:.35,shadowRadius:6,elevation:3},emptyImportBtnText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13,color:AppColors_1.AppColors.white},viewToggleContainer:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.whiteAlpha06,borderRadius:6,padding:2,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha10},viewToggleBtn:{paddingHorizontal:7,paddingVertical:4,borderRadius:4,alignItems:"center",justifyContent:"center"},viewToggleBtnActive:{backgroundColor:`${AppColors_1.AppColors.violet600}80`},deleteBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.red500}26`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}80`},deleteBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.red500},clearBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.red500}1F`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}4D`},clearBtnText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.red500},listContent:{padding:12,gap:10},columnWrapper:{gap:12},card:{width:CARD_WIDTH,backgroundColor:AppColors_1.AppColors.slate800,borderRadius:8,borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassLight,overflow:"hidden"},cardSelected:{borderColor:AppColors_1.AppColors.violet600,borderWidth:1.5},thumbnailContainer:{width:"100%",height:110,backgroundColor:AppColors_1.AppColors.slate850,position:"relative"},thumbnail:{width:"100%",height:"100%"},thumbnailFallback:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:AppColors_1.AppColors.slate900},checkbox:{position:"absolute",top:6,left:6,width:22,height:22,borderRadius:5,borderWidth:1.5,borderColor:"rgba(255, 255, 255, 0.65)",backgroundColor:"rgba(15, 23, 42, 0.65)",alignItems:"center",justifyContent:"center",zIndex:10},checkboxSelected:{backgroundColor:AppColors_1.AppColors.violet600,borderColor:AppColors_1.AppColors.violet600},miniPlayCircle:{position:"absolute",top:"50%",left:"50%",width:32,height:32,marginTop:-16,marginLeft:-16,borderRadius:16,backgroundColor:`${AppColors_1.AppColors.sky400}D9`,alignItems:"center",justifyContent:"center",paddingLeft:2,shadowColor:AppColors_1.AppColors.black,shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:4},typeBadge:{position:"absolute",top:6,right:6,flexDirection:"row",alignItems:"center",gap:3,backgroundColor:AppColors_1.AppColors.badgeGlassDark,paddingHorizontal:5,paddingVertical:2,borderRadius:4,borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassMedium},typeBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,color:AppColors_1.AppColors.slate200},cardInfo:{padding:8,gap:3},cardTitle:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11.5,color:AppColors_1.AppColors.white},cardMetaRow:{flexDirection:"row",alignItems:"center",gap:4},cardMeta:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:10,color:AppColors_1.AppColors.slate400},cardMetaDot:{fontSize:10,color:AppColors_1.AppColors.whiteAlpha30},listRow:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.slate800,borderRadius:8,borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassLight,padding:8,gap:10},listRowSelected:{borderColor:AppColors_1.AppColors.violet600,borderWidth:1.5,backgroundColor:`${AppColors_1.AppColors.violet600}14`},listCheckbox:{width:20,height:20,borderRadius:4,borderWidth:1.5,borderColor:"rgba(255, 255, 255, 0.65)",backgroundColor:"rgba(15, 23, 42, 0.65)",alignItems:"center",justifyContent:"center"},listThumbContainer:{width:46,height:46,borderRadius:6,backgroundColor:AppColors_1.AppColors.slate850,overflow:"hidden",position:"relative"},listThumb:{width:"100%",height:"100%"},listThumbFallback:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:AppColors_1.AppColors.slate900},listMiniPlay:{position:"absolute",top:"50%",left:"50%",width:20,height:20,marginTop:-10,marginLeft:-10,borderRadius:10,backgroundColor:`${AppColors_1.AppColors.sky400}D9`,alignItems:"center",justifyContent:"center",paddingLeft:1},listInfo:{flex:1,gap:4,minWidth:0},listTitle:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:12,color:AppColors_1.AppColors.white},listMetaRow:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap"},listBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:AppColors_1.AppColors.badgeGlassDark,paddingHorizontal:4,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassMedium},listBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.slate200},gridCopyBtn:{padding:3,borderRadius:4,backgroundColor:AppColors_1.AppColors.whiteAlpha08},listActionsRow:{flexDirection:"row",alignItems:"center",gap:6},listCopyBtn:{padding:6,borderRadius:6,backgroundColor:AppColors_1.AppColors.whiteAlpha10,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha15},listShareBtn:{padding:6,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.sky400}18`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}40`},listDeleteBtn:{padding:6,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.red500}14`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}33`},copySelectedBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,backgroundColor:AppColors_1.AppColors.whiteAlpha10,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20},copySelectedBtnText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:10.5,color:AppColors_1.AppColors.slate200},shareSelectedBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.sky400}20`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}60`},shareSelectedBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.sky400}});
+      
+      <ConfirmationModal_1.ConfirmationModal visible={f.visible}title={f.title}message={f.message}confirmText={f.confirmText}cancelText={f.cancelText}isDestructive={!0}icon="trash"onConfirm={f.onConfirm}onCancel={()=>b(e=>({...e,visible:!1}))}/>
+    </react_native_1.View>};exports.MediaGalleryTab=MediaGalleryTab;const{width:WINDOW_WIDTH}=react_native_1.Dimensions.get("window"),CARD_WIDTH=(WINDOW_WIDTH-36)/2,galleryStyles=react_native_1.StyleSheet.create({container:{flex:1,backgroundColor:AppColors_1.AppColors.grayBackground},topHeaderBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:10,backgroundColor:AppColors_1.AppColors.primaryLight,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.grayBorderSecondary},backToTabBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingVertical:4,paddingHorizontal:8,borderRadius:8,backgroundColor:`${AppColors_1.AppColors.purple}12`},backToTabText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11.5,color:AppColors_1.AppColors.purple},headerCenterTitle:{flexDirection:"row",alignItems:"center",gap:6},headerStudioTitle:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:13.5,color:AppColors_1.AppColors.grayTextStrong},headerBadge:{backgroundColor:`${AppColors_1.AppColors.purple}1A`,paddingHorizontal:6,paddingVertical:1.5,borderRadius:10},headerBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:AppColors_1.AppColors.purple},closeCircleBtn:{width:26,height:26,borderRadius:13,backgroundColor:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,alignItems:"center",justifyContent:"center"},recordingBanner:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:`${AppColors_1.AppColors.red500}15`,borderBottomWidth:1,borderBottomColor:`${AppColors_1.AppColors.red500}30`,paddingHorizontal:14,paddingVertical:8},recordingDot:{width:8,height:8,borderRadius:4,backgroundColor:AppColors_1.AppColors.red500,marginRight:6},recordingBannerText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12,color:AppColors_1.AppColors.red500,flex:1},stopRecordBtn:{flexDirection:"row",alignItems:"center",gap:5,backgroundColor:AppColors_1.AppColors.red500,paddingHorizontal:10,paddingVertical:4.5,borderRadius:6},stopSquare:{width:8,height:8,backgroundColor:AppColors_1.AppColors.white,borderRadius:1},stopRecordBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11,color:AppColors_1.AppColors.white},quickActionsBar:{flexDirection:"row",alignItems:"center",gap:8,paddingHorizontal:12,paddingTop:10,paddingBottom:6},quickBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,paddingVertical:7,paddingHorizontal:4,borderRadius:8,borderWidth:1},quickBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11},filterBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.grayBorderSecondary,gap:8},chipGroup:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:1},chip:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4.5,borderRadius:8,backgroundColor:AppColors_1.AppColors.primaryLight,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary},chipActive:{backgroundColor:`${AppColors_1.AppColors.purple}14`,borderColor:AppColors_1.AppColors.purple},chipText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.grayText},chipTextActive:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.purple},chipBadge:{backgroundColor:AppColors_1.AppColors.grayBackground,paddingHorizontal:4.5,paddingVertical:1,borderRadius:6},chipBadgeActive:{backgroundColor:AppColors_1.AppColors.purple},chipBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,color:AppColors_1.AppColors.grayTextWeak},chipBadgeTextActive:{color:AppColors_1.AppColors.white},viewToggleContainer:{flexDirection:"row",backgroundColor:AppColors_1.AppColors.primaryLight,borderRadius:8,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,padding:2},viewToggleBtn:{paddingHorizontal:7,paddingVertical:4,borderRadius:6},viewToggleBtnActive:{backgroundColor:AppColors_1.AppColors.purple},subBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:6.5,backgroundColor:AppColors_1.AppColors.primaryLight,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.grayBorderSecondary},resultCountWrapper:{flex:1},resultCountText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.grayTextWeak},resultCountTextSelected:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.purple},actionsGroup:{flexDirection:"row",alignItems:"center",gap:6},copySelectedBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:7,paddingVertical:3.5,borderRadius:6,backgroundColor:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary},copySelectedBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.grayTextStrong},shareSelectedBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:7,paddingVertical:3.5,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.sky600}14`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky600}30`},shareSelectedBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.sky600},deleteBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:7,paddingVertical:3.5,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.red500}14`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}30`},deleteBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.red500},clearBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:7,paddingVertical:3.5,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.red500}10`},clearBtnText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.red500},listContent:{padding:12,paddingBottom:40},columnWrapper:{justifyContent:"space-between",marginBottom:10},card:{width:CARD_WIDTH,backgroundColor:AppColors_1.AppColors.primaryLight,borderRadius:12,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,overflow:"hidden",shadowColor:AppColors_1.AppColors.black,shadowOffset:{width:0,height:2},shadowOpacity:.04,shadowRadius:4,elevation:2},cardSelected:{borderColor:AppColors_1.AppColors.purple,borderWidth:2},thumbnailContainer:{width:"100%",height:110,backgroundColor:AppColors_1.AppColors.grayBackground,position:"relative"},thumbnail:{width:"100%",height:"100%"},thumbnailFallback:{flex:1,alignItems:"center",justifyContent:"center"},checkbox:{position:"absolute",top:7,left:7,width:19,height:19,borderRadius:5,backgroundColor:"rgba(0, 0, 0, 0.45)",borderWidth:1.5,borderColor:AppColors_1.AppColors.white,alignItems:"center",justifyContent:"center",zIndex:5},checkboxSelected:{backgroundColor:AppColors_1.AppColors.purple,borderColor:AppColors_1.AppColors.purple},miniPlayCircle:{position:"absolute",top:"50%",left:"50%",transform:[{translateX:-16},{translateY:-16}],width:32,height:32,borderRadius:16,backgroundColor:"rgba(0, 0, 0, 0.65)",alignItems:"center",justifyContent:"center"},typeBadge:{position:"absolute",top:7,right:7,paddingHorizontal:5,paddingVertical:2,borderRadius:4},typeBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.white,letterSpacing:.3},durationBadge:{position:"absolute",bottom:6,right:6,backgroundColor:"rgba(0, 0, 0, 0.72)",paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},durationBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,color:AppColors_1.AppColors.white},cardInfo:{padding:8,gap:4},cardTitle:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11,color:AppColors_1.AppColors.grayTextStrong},cardMetaRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},cardMeta:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:10,color:AppColors_1.AppColors.grayTextWeak},cardMetaDot:{fontSize:9,color:AppColors_1.AppColors.grayTextWeak},gridCopyBtn:{padding:2},listRow:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.primaryLight,borderRadius:10,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,padding:8,marginBottom:8,gap:10},listRowSelected:{borderColor:AppColors_1.AppColors.purple,borderWidth:1.5},listCheckbox:{width:18,height:18,borderRadius:4,borderWidth:1.5,borderColor:AppColors_1.AppColors.grayBorderSecondary,alignItems:"center",justifyContent:"center"},listThumbContainer:{width:48,height:48,borderRadius:8,backgroundColor:AppColors_1.AppColors.grayBackground,overflow:"hidden",position:"relative"},listThumb:{width:"100%",height:"100%"},listThumbFallback:{flex:1,alignItems:"center",justifyContent:"center"},listMiniPlay:{position:"absolute",bottom:2,right:2,backgroundColor:"rgba(0, 0, 0, 0.65)",borderRadius:3,padding:1.5},listInfo:{flex:1,gap:3},listTitle:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:12,color:AppColors_1.AppColors.grayTextStrong},listMetaRow:{flexDirection:"row",alignItems:"center",gap:5},listBadge:{paddingHorizontal:4.5,paddingVertical:1,borderRadius:4},listBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,letterSpacing:.3},listActionsRow:{flexDirection:"row",alignItems:"center",gap:4},listActionBtn:{padding:5,borderRadius:6,backgroundColor:AppColors_1.AppColors.grayBackground},emptyHeroCard:{backgroundColor:AppColors_1.AppColors.primaryLight,borderRadius:16,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,padding:20,alignItems:"center",marginTop:8,shadowColor:AppColors_1.AppColors.black,shadowOffset:{width:0,height:2},shadowOpacity:.03,shadowRadius:6,elevation:2},emptyIconCircle:{width:64,height:64,borderRadius:32,backgroundColor:`${AppColors_1.AppColors.purple}14`,borderWidth:1,borderColor:`${AppColors_1.AppColors.purple}25`,alignItems:"center",justifyContent:"center",marginBottom:12},emptyHeroTitle:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:16,color:AppColors_1.AppColors.grayTextStrong,textAlign:"center",marginBottom:6},emptyHeroSubtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:12,lineHeight:17,color:AppColors_1.AppColors.grayText,textAlign:"center",marginBottom:18,paddingHorizontal:8},emptyActionsGrid:{width:"100%",gap:8,marginBottom:16},emptyActionCard:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:10,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,padding:10,gap:12},actionCardIconBox:{width:38,height:38,borderRadius:8,alignItems:"center",justifyContent:"center"},actionCardTextBox:{flex:1,gap:1.5},actionCardTitle:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12.5,color:AppColors_1.AppColors.grayTextStrong},actionCardDesc:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:10.5,color:AppColors_1.AppColors.grayTextWeak},featurePillsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,flexWrap:"wrap",paddingTop:4},featurePill:{backgroundColor:AppColors_1.AppColors.grayBackground,paddingHorizontal:8,paddingVertical:3.5,borderRadius:12,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary},featurePillText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak}});

package/dist/commonjs/components/Inspector/NetworkDetail.js

@@ -1,6 +1,6 @@
-"use strict";var __importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importDefault(require("react")),i18n_1=require("../../i18n"),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),TouchableScale_1=__importDefault(require("../TouchableScale")),SegmentedTabs_1=__importDefault(require("../SegmentedTabs")),MetaAccordion_1=__importDefault(require("../MetaAccordion")),HeadersSection_1=__importDefault(require("../HeadersSection")),SourcePageCard_1=__importDefault(require("../SourcePageCard")),SectionHeader_1=__importDefault(require("../SectionHeader")),JsonViewer_1=__importDefault(require("../JsonViewer")),DiffViewer_1=__importDefault(require("../DiffViewer")),CopyButton_1=__importDefault(require("../CopyButton")),ShareButton_1=__importDefault(require("../ShareButton")),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),helpers_1=require("../../helpers"),shareFormatter_1=require("../../helpers/shareFormatter"),NetworkIcons_1=require("../NetworkIcons"),NetworkDetail=react_1.default.memo(()=>{const{t:o}=(0,i18n_1.useTranslation)(),{selected:e,detailDisplayUrl:a,apiDetailActiveTab:n,setApiDetailActiveTab:_,detailSearch:r,setDetailSearch:l,reqExpanded:s,setReqExpanded:u,resExpanded:i,setResExpanded:f,showReqDiff:c,setShowReqDiff:h,showResDiff:d,setShowResDiff:w,prevRequestData:C,prevResponseData:y,logRouteMapRef:x}=(0,InspectorContext_1.useInspector)(),g=()=>{react_native_1.Alert.alert(o("common.openInBrowser")||"Open in Browser",`${o("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
+"use strict";var __importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importDefault(require("react")),i18n_1=require("../../i18n"),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),TouchableScale_1=__importDefault(require("../TouchableScale")),SegmentedTabs_1=__importDefault(require("../SegmentedTabs")),MetaAccordion_1=__importDefault(require("../MetaAccordion")),HeadersSection_1=__importDefault(require("../HeadersSection")),SourcePageCard_1=__importDefault(require("../SourcePageCard")),SectionHeader_1=__importDefault(require("../SectionHeader")),JsonViewer_1=__importDefault(require("../JsonViewer")),DiffViewer_1=__importDefault(require("../DiffViewer")),CopyButton_1=__importDefault(require("../CopyButton")),ShareButton_1=__importDefault(require("../ShareButton")),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),helpers_1=require("../../helpers"),shareFormatter_1=require("../../helpers/shareFormatter"),NetworkIcons_1=require("../NetworkIcons"),NetworkDetail=react_1.default.memo(()=>{const{t:o}=(0,i18n_1.useTranslation)(),{selected:e,detailDisplayUrl:a,apiDetailActiveTab:n,setApiDetailActiveTab:y,detailSearch:r,setDetailSearch:l,reqExpanded:s,setReqExpanded:u,resExpanded:i,setResExpanded:f,showReqDiff:c,setShowReqDiff:_,showResDiff:d,setShowResDiff:w,prevRequestData:C,prevResponseData:g,logRouteMapRef:x}=(0,InspectorContext_1.useInspector)(),h=()=>{react_native_1.Alert.alert(o("common.openInBrowser")||"Open URL",`${o("common.openInBrowserPrompt")||"Choose how you want to open or inspect this URL:"}
 
-${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:o("common.open")||"Open",onPress:()=>{react_native_1.Linking.canOpenURL(a).then(t=>{t?react_native_1.Linking.openURL(a):react_native_1.Linking.openURL(a).catch(()=>{})}).catch(()=>{})}}])};return e?<react_native_1.View style={{flex:1}}>
+${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:"Open in Postman",onPress:()=>{e&&(0,helpers_1.openWithPostman)(e)}},{text:o("common.open")||"Browser",onPress:()=>{react_native_1.Linking.canOpenURL(a).then(t=>{t?react_native_1.Linking.openURL(a):react_native_1.Linking.openURL(a).catch(()=>{})}).catch(()=>{})}}])};return e?<react_native_1.View style={{flex:1}}>
       
       <react_native_1.View style={{paddingHorizontal:8,paddingTop:4}}>
         <react_native_1.View style={styles_1.default.detailInfoBar}>
@@ -70,14 +70,17 @@ ${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:o("common.open")
                       <ShareButton_1.default onShare={()=>(0,shareFormatter_1.shareApiReport)(e)}/>
                       <CopyButton_1.default value={(0,helpers_1.getFetchCommand)(e)}label="fetch()"iconType="fetch"/>
                       <CopyButton_1.default value={a}label="URL"iconType="copy"/>
-                      <TouchableScale_1.default style={[styles_1.default.iconSquareBtn,{backgroundColor:`${AppColors_1.AppColors.sky600}15`,borderColor:`${AppColors_1.AppColors.sky600}35`}]}onPress={g}hitSlop={10}accessibilityLabel="Open in Browser">
+                      <TouchableScale_1.default style={[styles_1.default.iconSquareBtn,{backgroundColor:"rgba(255, 108, 55, 0.12)",borderColor:"rgba(255, 108, 55, 0.35)"}]}onPress={()=>(0,helpers_1.openWithPostman)(e)}hitSlop={10}accessibilityLabel="Open in Postman">
+                        <NetworkIcons_1.PostmanIcon color="#FF6C37"size={13}/>
+                      </TouchableScale_1.default>
+                      <TouchableScale_1.default style={[styles_1.default.iconSquareBtn,{backgroundColor:`${AppColors_1.AppColors.sky600}15`,borderColor:`${AppColors_1.AppColors.sky600}35`}]}onPress={h}hitSlop={10}accessibilityLabel="Open in Browser">
                         <NetworkIcons_1.ExternalLinkIcon color={AppColors_1.AppColors.sky600}size={13}/>
                       </TouchableScale_1.default>
                     </react_native_1.View>
                   </react_native_1.View>
 
                   
-                  <react_native_1.Pressable onPress={g}>
+                  <react_native_1.Pressable onPress={h}>
                     <react_native_1.Text selectable={!0}style={{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:12.5,color:AppColors_1.AppColors.skyBlue,textDecorationLine:"underline",lineHeight:18}}>
                       {a}
                     </react_native_1.Text>
@@ -88,7 +91,7 @@ ${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:o("common.open")
       </react_native_1.View>
 
       
-      <SegmentedTabs_1.default tabs={[{key:"metadata",label:o("network.detailTabs.metadata"),icon:t=><NetworkIcons_1.StatusIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},{key:"headers",label:o("network.detailTabs.headers"),icon:t=><NetworkIcons_1.HeadersIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},...e.request!=null?[{key:"request",label:o("network.detailTabs.request"),icon:t=><NetworkIcons_1.RequestIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>}]:[],{key:"response",label:o("network.detailTabs.response"),icon:t=><NetworkIcons_1.ResponseIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>}]}activeKey={n}onChange={t=>{(0,InspectorContext_1.animateNextLayout)(),_(t)}}style={{marginHorizontal:6,marginBottom:10,marginTop:6}}/>
+      <SegmentedTabs_1.default tabs={[{key:"metadata",label:o("network.detailTabs.metadata"),icon:t=><NetworkIcons_1.StatusIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},{key:"headers",label:o("network.detailTabs.headers"),icon:t=><NetworkIcons_1.HeadersIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},...e.request!=null?[{key:"request",label:o("network.detailTabs.request"),icon:t=><NetworkIcons_1.RequestIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>}]:[],{key:"response",label:o("network.detailTabs.response"),icon:t=><NetworkIcons_1.ResponseIcon color={t?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>}]}activeKey={n}onChange={t=>{(0,InspectorContext_1.animateNextLayout)(),y(t)}}style={{marginHorizontal:6,marginBottom:10,marginTop:6}}/>
 
       
       <react_native_1.ScrollView style={styles_1.default.detailScroll}contentContainerStyle={{paddingHorizontal:6,paddingBottom:24}}showsVerticalScrollIndicator={!0}>
@@ -130,7 +133,7 @@ ${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:o("common.open")
               </react_native_1.View>
 
               <react_native_1.View style={styles_1.default.sectionContainer}>
-                <SectionHeader_1.default title={o("network.requestTitle")}value={e.request}expanded={s}onToggleExpand={()=>u(t=>!t)}showDiff={C!=null}isDiffing={c}onToggleDiff={()=>{h(t=>!t),!s&&!c&&u(!0)}}/>
+                <SectionHeader_1.default title={o("network.requestTitle")}value={e.request}expanded={s}onToggleExpand={()=>u(t=>!t)}showDiff={C!=null}isDiffing={c}onToggleDiff={()=>{_(t=>!t),!s&&!c&&u(!0)}}/>
                 {c?<DiffViewer_1.default oldData={C}newData={e.request}forceOpen={s}/>:s?<JsonViewer_1.default data={e.request}search={r}/>:<react_native_1.View style={styles_1.default.codeBlock}>
                     <react_native_1.Text style={[styles_1.default.codeText,{color:AppColors_1.AppColors.grayTextWeak}]}>
                       {o("network.bodyHidden")}
@@ -150,8 +153,8 @@ ${a}`,[{text:o("common.cancel")||"Cancel",style:"cancel"},{text:o("common.open")
             </react_native_1.View>
 
             <react_native_1.View style={styles_1.default.sectionContainer}>
-              <SectionHeader_1.default title={o("network.responseTitle")}value={e.response}expanded={i}onToggleExpand={()=>f(t=>!t)}showDiff={y!=null}isDiffing={d}onToggleDiff={()=>{w(t=>!t),!i&&!d&&f(!0)}}/>
-              {d?<DiffViewer_1.default oldData={y}newData={e.response}forceOpen={i}/>:i?<JsonViewer_1.default data={e.response}search={r}wrap/>:<react_native_1.View style={styles_1.default.codeBlock}>
+              <SectionHeader_1.default title={o("network.responseTitle")}value={e.response}expanded={i}onToggleExpand={()=>f(t=>!t)}showDiff={g!=null}isDiffing={d}onToggleDiff={()=>{w(t=>!t),!i&&!d&&f(!0)}}/>
+              {d?<DiffViewer_1.default oldData={g}newData={e.response}forceOpen={i}/>:i?<JsonViewer_1.default data={e.response}search={r}wrap/>:<react_native_1.View style={styles_1.default.codeBlock}>
                   <react_native_1.Text style={[styles_1.default.codeText,{color:AppColors_1.AppColors.grayTextWeak}]}>
                     {o("network.bodyHidden")}
                   </react_native_1.Text>