react-native-inapp-inspector 1.1.25 → 1.1.26

package/dist/commonjs/components/Inspector/CrashFilterModal.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { CrashFilterType } from '../../types/enums';
+export interface CrashFilters {
+    types: Set<CrashFilterType>;
+    timeWindow: 'all' | '15m' | '1h' | '24h' | '7d';
+    platform: 'all' | 'ios' | 'android';
+    engine: 'all' | 'hermes' | 'jsc';
+    sortBy: 'time_desc' | 'time_asc';
+}
+export declare const DEFAULT_CRASH_FILTERS: CrashFilters;
+export declare const isCrashFiltersDefault: (f: CrashFilters) => boolean;
+interface CrashFilterModalProps {
+    visible: boolean;
+    onClose: () => void;
+    filters: CrashFilters;
+    onApply: (filters: CrashFilters) => void;
+    searchQuery?: string;
+}
+declare const CrashFilterModal: React.FC<CrashFilterModalProps>;
+export default CrashFilterModal;

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

@@ -0,0 +1,597 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isCrashFiltersDefault = exports.DEFAULT_CRASH_FILTERS = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const InspectorContext_1 = require("./InspectorContext");
+const AppColors_1 = require("../../styles/AppColors");
+const AppFonts_1 = require("../../styles/AppFonts");
+const i18n_1 = require("../../i18n");
+const NetworkIcons_1 = require("../NetworkIcons");
+const TouchableScale_1 = __importDefault(require("../TouchableScale"));
+exports.DEFAULT_CRASH_FILTERS = {
+    types: new Set(['all']),
+    timeWindow: 'all',
+    platform: 'all',
+    engine: 'all',
+    sortBy: 'time_desc',
+};
+const isCrashFiltersDefault = (f) => (f.types.has('all') || f.types.size === 0) &&
+    f.timeWindow === 'all' &&
+    f.platform === 'all' &&
+    f.engine === 'all' &&
+    f.sortBy === 'time_desc';
+exports.isCrashFiltersDefault = isCrashFiltersDefault;
+const CrashFilterModal = ({ visible, onClose, filters, onApply, searchQuery = '', }) => {
+    const { t } = (0, i18n_1.useTranslation)();
+    const { crashRecords } = (0, InspectorContext_1.useInspector)();
+    const [draft, setDraft] = (0, react_1.useState)(() => ({
+        ...filters,
+        types: new Set(filters.types),
+    }));
+    (0, react_1.useEffect)(() => {
+        if (visible) {
+            setDraft({
+                ...filters,
+                types: new Set(filters.types),
+            });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [visible]);
+    const toggleType = (key) => {
+        setDraft(prev => {
+            const next = new Set(prev.types);
+            if (key === 'all') {
+                return { ...prev, types: new Set(['all']) };
+            }
+            next.delete('all');
+            if (next.has(key)) {
+                next.delete(key);
+                if (next.size === 0)
+                    next.add('all');
+            }
+            else {
+                next.add(key);
+            }
+            return { ...prev, types: next };
+        });
+    };
+    const setTimeWindow = (tw) => {
+        setDraft(prev => ({ ...prev, timeWindow: tw }));
+    };
+    const setPlatform = (p) => {
+        setDraft(prev => ({ ...prev, platform: p }));
+    };
+    const setEngine = (e) => {
+        setDraft(prev => ({ ...prev, engine: e }));
+    };
+    const setSort = (sortBy) => {
+        setDraft(prev => ({ ...prev, sortBy }));
+    };
+    const handleResetDraft = () => {
+        setDraft({
+            ...exports.DEFAULT_CRASH_FILTERS,
+            types: new Set(exports.DEFAULT_CRASH_FILTERS.types),
+        });
+    };
+    const handleApply = () => {
+        onApply({
+            ...draft,
+            types: new Set(draft.types),
+        });
+        onClose();
+    };
+    const handleDiscard = () => {
+        setDraft({
+            ...filters,
+            types: new Set(filters.types),
+        });
+        onClose();
+    };
+    const draftMatchCount = (0, react_1.useMemo)(() => {
+        let crashes = crashRecords;
+        if (searchQuery.trim().length > 0) {
+            const q = searchQuery.toLowerCase();
+            crashes = crashes.filter(c => (c.message || '').toLowerCase().includes(q) ||
+                (c.name || '').toLowerCase().includes(q) ||
+                (c.stack || '').toLowerCase().includes(q));
+        }
+        if (draft.types.size > 0 && !draft.types.has('all')) {
+            crashes = crashes.filter(c => {
+                if (draft.types.has('fatal') && c.isFatal)
+                    return true;
+                if (draft.types.has('js') && c.type === 'js')
+                    return true;
+                if (draft.types.has('promise') && c.type === 'promise')
+                    return true;
+                if (draft.types.has('render') && c.type === 'render')
+                    return true;
+                if (draft.types.has('native') && c.type === 'native')
+                    return true;
+                return false;
+            });
+        }
+        if (draft.timeWindow !== 'all') {
+            const now = Date.now();
+            const cutoff = draft.timeWindow === '15m'
+                ? now - 15 * 60 * 1000
+                : draft.timeWindow === '1h'
+                    ? now - 60 * 60 * 1000
+                    : draft.timeWindow === '24h'
+                        ? now - 24 * 60 * 60 * 1000
+                        : now - 7 * 24 * 60 * 60 * 1000;
+            crashes = crashes.filter(c => c.timestamp >= cutoff);
+        }
+        if (draft.platform !== 'all') {
+            crashes = crashes.filter(c => (c.deviceInfo?.platform || '').toLowerCase() === draft.platform);
+        }
+        if (draft.engine !== 'all') {
+            crashes = crashes.filter(c => {
+                const isHermes = c.deviceInfo?.isHermes;
+                if (draft.engine === 'hermes')
+                    return isHermes === true;
+                return isHermes === false || isHermes === undefined;
+            });
+        }
+        return crashes.length;
+    }, [crashRecords, searchQuery, draft]);
+    const isAllTypes = draft.types.has('all') || draft.types.size === 0;
+    const typeChips = [
+        { key: 'all', label: t('crash.filterTypeAll'), Icon: NetworkIcons_1.FilterIcon, color: AppColors_1.AppColors.grayTextStrong },
+        { key: 'fatal', label: t('crash.filterFatal'), Icon: NetworkIcons_1.SkullIcon, color: AppColors_1.AppColors.errorColor },
+        { key: 'js', label: t('crash.filterJsError'), Icon: NetworkIcons_1.JsIcon, color: AppColors_1.AppColors.sky600 },
+        { key: 'promise', label: t('crash.filterPromise'), Icon: NetworkIcons_1.HourglassIcon, color: AppColors_1.AppColors.darkOrange },
+        { key: 'render', label: t('crash.filterRender'), Icon: NetworkIcons_1.LayoutIcon, color: AppColors_1.AppColors.purple },
+        { key: 'native', label: t('crash.filterNative'), Icon: NetworkIcons_1.ChipIcon, color: AppColors_1.AppColors.amber700 },
+    ];
+    return (<react_native_1.Modal visible={visible} transparent animationType="fade" onRequestClose={handleDiscard}>
+      <react_native_1.View style={styles.backdrop}>
+        <react_native_1.Pressable style={react_native_1.StyleSheet.absoluteFill} onPress={handleDiscard}/>
+
+        <react_native_1.View style={styles.modalCard}>
+          <react_native_1.View style={styles.header}>
+            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
+              <react_native_1.View style={styles.headerIconBox}>
+                <NetworkIcons_1.FilterIcon color={AppColors_1.AppColors.brandPurple} size={15}/>
+              </react_native_1.View>
+              <react_native_1.View>
+                <react_native_1.Text style={styles.headerTitle}>{t('crash.filterTitle')}</react_native_1.Text>
+                <react_native_1.Text style={styles.headerSubtitle}>
+                  {t('crash.filterSubtitle')}
+                </react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
+              <react_native_1.TouchableOpacity onPress={handleResetDraft} hitSlop={8} style={styles.resetBtn}>
+                <react_native_1.Text style={styles.resetBtnText}>{t('crash.filterReset')}</react_native_1.Text>
+              </react_native_1.TouchableOpacity>
+
+              <react_native_1.TouchableOpacity onPress={handleDiscard} hitSlop={10} style={styles.closeBtn}>
+                <NetworkIcons_1.CloseWhite />
+              </react_native_1.TouchableOpacity>
+            </react_native_1.View>
+          </react_native_1.View>
+
+          <react_native_1.ScrollView style={{ maxHeight: 460 }} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={true}>
+            <react_native_1.View style={styles.section}>
+              <react_native_1.View style={styles.sectionHeaderRow}>
+                <NetworkIcons_1.SkullIcon color={AppColors_1.AppColors.grayTextWeak} size={12}/>
+                <react_native_1.Text style={styles.sectionTitle}>
+                  {t('crash.filterTypeSection')}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={styles.chipsWrap}>
+                {typeChips.map(chip => {
+            const isSelected = chip.key === 'all' ? isAllTypes : draft.types.has(chip.key);
+            return (<TouchableScale_1.default key={chip.key} onPress={() => toggleType(chip.key)} style={[
+                    styles.filterPill,
+                    isSelected && styles.filterPillActive,
+                ]}>
+                      {chip.key === 'all' && isSelected && (<NetworkIcons_1.CheckIcon color={AppColors_1.AppColors.white} size={12}/>)}
+                      <chip.Icon size={12} color={isSelected ? AppColors_1.AppColors.white : chip.color}/>
+                      <react_native_1.Text style={[
+                    styles.filterPillText,
+                    isSelected && styles.filterPillTextActive,
+                ]}>
+                        {chip.label}
+                      </react_native_1.Text>
+                    </TouchableScale_1.default>);
+        })}
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.section}>
+              <react_native_1.View style={styles.sectionHeaderRow}>
+                <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.grayTextWeak} size={12}/>
+                <react_native_1.Text style={styles.sectionTitle}>
+                  {t('crash.filterTimeSection')}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={styles.chipsWrap}>
+                {[
+            { key: 'all', label: t('crash.filterTimeAll') },
+            { key: '15m', label: t('crash.filterTime15m') },
+            { key: '1h', label: t('crash.filterTime1h') },
+            { key: '24h', label: t('crash.filterTime24h') },
+            { key: '7d', label: t('crash.filterTime7d') },
+        ].map(item => (<TouchableScale_1.default key={item.key} onPress={() => setTimeWindow(item.key)} style={[
+                styles.filterPill,
+                draft.timeWindow === item.key && styles.filterPillActive,
+            ]}>
+                    <react_native_1.Text style={[
+                styles.filterPillText,
+                draft.timeWindow === item.key &&
+                    styles.filterPillTextActive,
+            ]}>
+                      {item.label}
+                    </react_native_1.Text>
+                  </TouchableScale_1.default>))}
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.section}>
+              <react_native_1.View style={styles.sectionHeaderRow}>
+                <NetworkIcons_1.AppleIcon color={AppColors_1.AppColors.grayTextWeak} size={12}/>
+                <react_native_1.Text style={styles.sectionTitle}>
+                  {t('crash.filterPlatformSection')}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={styles.chipsWrap}>
+                <TouchableScale_1.default onPress={() => setPlatform('all')} style={[
+            styles.filterPill,
+            draft.platform === 'all' && styles.filterPillActive,
+        ]}>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.platform === 'all' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterPlatformAll')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+
+                <TouchableScale_1.default onPress={() => setPlatform('ios')} style={[
+            styles.filterPill,
+            draft.platform === 'ios' && styles.filterPillActive,
+        ]}>
+                  <NetworkIcons_1.AppleIcon size={12} color={draft.platform === 'ios'
+            ? AppColors_1.AppColors.white
+            : AppColors_1.AppColors.grayTextStrong}/>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.platform === 'ios' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterPlatformIos')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+
+                <TouchableScale_1.default onPress={() => setPlatform('android')} style={[
+            styles.filterPill,
+            draft.platform === 'android' && styles.filterPillActive,
+        ]}>
+                  <NetworkIcons_1.AndroidIcon size={12} color={draft.platform === 'android'
+            ? AppColors_1.AppColors.white
+            : AppColors_1.AppColors.greenColor}/>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.platform === 'android' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterPlatformAndroid')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.section}>
+              <react_native_1.View style={styles.sectionHeaderRow}>
+                <NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.grayTextWeak} size={12}/>
+                <react_native_1.Text style={styles.sectionTitle}>
+                  {t('crash.filterEngineSection')}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={styles.chipsWrap}>
+                <TouchableScale_1.default onPress={() => setEngine('all')} style={[
+            styles.filterPill,
+            draft.engine === 'all' && styles.filterPillActive,
+        ]}>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.engine === 'all' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterEngineAll')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+
+                <TouchableScale_1.default onPress={() => setEngine('hermes')} style={[
+            styles.filterPill,
+            draft.engine === 'hermes' && styles.filterPillActive,
+        ]}>
+                  <NetworkIcons_1.BoltIcon size={12} color={draft.engine === 'hermes'
+            ? AppColors_1.AppColors.white
+            : AppColors_1.AppColors.brandPurple}/>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.engine === 'hermes' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterEngineHermes')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+
+                <TouchableScale_1.default onPress={() => setEngine('jsc')} style={[
+            styles.filterPill,
+            draft.engine === 'jsc' && styles.filterPillActive,
+        ]}>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.engine === 'jsc' && styles.filterPillTextActive,
+        ]}>
+                    {t('crash.jsc')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            <react_native_1.View style={styles.section}>
+              <react_native_1.View style={styles.sectionHeaderRow}>
+                <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.grayTextWeak} size={12}/>
+                <react_native_1.Text style={styles.sectionTitle}>
+                  {t('crash.filterSortSection')}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={styles.chipsWrap}>
+                <TouchableScale_1.default onPress={() => setSort('time_desc')} style={[
+            styles.filterPill,
+            draft.sortBy === 'time_desc' && styles.filterPillActive,
+        ]}>
+                  <NetworkIcons_1.ClockIcon size={12} color={draft.sortBy === 'time_desc'
+            ? AppColors_1.AppColors.white
+            : AppColors_1.AppColors.grayText}/>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.sortBy === 'time_desc' &&
+                styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterSortNewest')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+
+                <TouchableScale_1.default onPress={() => setSort('time_asc')} style={[
+            styles.filterPill,
+            draft.sortBy === 'time_asc' && styles.filterPillActive,
+        ]}>
+                  <NetworkIcons_1.HourglassIcon size={12} color={draft.sortBy === 'time_asc'
+            ? AppColors_1.AppColors.white
+            : AppColors_1.AppColors.grayText}/>
+                  <react_native_1.Text style={[
+            styles.filterPillText,
+            draft.sortBy === 'time_asc' &&
+                styles.filterPillTextActive,
+        ]}>
+                    {t('crash.filterSortOldest')}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
+              </react_native_1.View>
+            </react_native_1.View>
+          </react_native_1.ScrollView>
+
+          <react_native_1.View style={styles.footer}>
+            <react_native_1.TouchableOpacity onPress={handleDiscard} style={styles.discardBtn} activeOpacity={0.8}>
+              <react_native_1.Text style={styles.discardBtnText}>
+                {t('crash.filterDiscard')}
+              </react_native_1.Text>
+            </react_native_1.TouchableOpacity>
+
+            <react_native_1.TouchableOpacity onPress={handleApply} style={styles.applyBtn} activeOpacity={0.85}>
+              <react_native_1.Text style={styles.applyBtnText}>
+                {t('crash.filterApply', { count: draftMatchCount })}
+              </react_native_1.Text>
+            </react_native_1.TouchableOpacity>
+          </react_native_1.View>
+        </react_native_1.View>
+      </react_native_1.View>
+    </react_native_1.Modal>);
+};
+const styles = react_native_1.StyleSheet.create({
+    backdrop: {
+        flex: 1,
+        backgroundColor: `${AppColors_1.AppColors.primaryBlack}85`,
+        justifyContent: 'center',
+        alignItems: 'center',
+        padding: 16,
+    },
+    modalCard: {
+        width: '100%',
+        maxWidth: 440,
+        backgroundColor: AppColors_1.AppColors.white,
+        borderRadius: 14,
+        borderWidth: 1,
+        borderColor: AppColors_1.AppColors.dividerColor,
+        shadowColor: AppColors_1.AppColors.black,
+        shadowOpacity: 0.18,
+        shadowRadius: 12,
+        shadowOffset: { width: 0, height: 4 },
+        elevation: 8,
+        overflow: 'hidden',
+    },
+    header: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        paddingHorizontal: 14,
+        paddingVertical: 12,
+        borderBottomWidth: 1,
+        borderBottomColor: AppColors_1.AppColors.dividerColor,
+        backgroundColor: `${AppColors_1.AppColors.brandPurple}08`,
+    },
+    headerIconBox: {
+        width: 28,
+        height: 28,
+        borderRadius: 7,
+        backgroundColor: `${AppColors_1.AppColors.brandPurple}18`,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    headerTitle: {
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 13.5,
+        color: AppColors_1.AppColors.primaryBlack,
+    },
+    headerSubtitle: {
+        fontFamily: AppFonts_1.AppFonts.interMedium,
+        fontSize: 10,
+        color: AppColors_1.AppColors.grayTextWeak,
+    },
+    resetBtn: {
+        paddingHorizontal: 8,
+        paddingVertical: 4,
+        borderRadius: 5,
+        backgroundColor: `${AppColors_1.AppColors.darkOrange}14`,
+        borderWidth: 1,
+        borderColor: `${AppColors_1.AppColors.darkOrange}30`,
+    },
+    resetBtnText: {
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 10,
+        color: AppColors_1.AppColors.darkOrange,
+    },
+    closeBtn: {
+        width: 24,
+        height: 24,
+        borderRadius: 12,
+        backgroundColor: `${AppColors_1.AppColors.primaryBlack}18`,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    scrollContent: {
+        padding: 14,
+        gap: 14,
+    },
+    section: {
+        gap: 7,
+    },
+    sectionHeaderRow: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 5,
+    },
+    sectionTitle: {
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 9.5,
+        color: AppColors_1.AppColors.grayTextWeak,
+        letterSpacing: 0.5,
+    },
+    chipsWrap: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        gap: 6.5,
+    },
+    filterPill: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 5,
+        paddingHorizontal: 9,
+        paddingVertical: 5.5,
+        borderRadius: 7,
+        backgroundColor: AppColors_1.AppColors.grayBackground,
+        borderWidth: 1,
+        borderColor: AppColors_1.AppColors.dividerColor,
+    },
+    filterPillActive: {
+        backgroundColor: AppColors_1.AppColors.brandPurple,
+        borderColor: AppColors_1.AppColors.brandPurple,
+        shadowColor: AppColors_1.AppColors.brandPurple,
+        shadowOffset: { width: 0, height: 1 },
+        shadowOpacity: 0.25,
+        shadowRadius: 3,
+        elevation: 2,
+    },
+    filterPillText: {
+        fontFamily: AppFonts_1.AppFonts.interMedium,
+        fontSize: 11,
+        color: AppColors_1.AppColors.primaryBlack,
+    },
+    filterPillTextActive: {
+        color: AppColors_1.AppColors.white,
+        fontFamily: AppFonts_1.AppFonts.interBold,
+    },
+    footer: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 10,
+        paddingHorizontal: 14,
+        paddingVertical: 12,
+        borderTopWidth: 1,
+        borderTopColor: AppColors_1.AppColors.dividerColor,
+        backgroundColor: AppColors_1.AppColors.grayBackground,
+    },
+    discardBtn: {
+        flex: 1,
+        paddingVertical: 9.5,
+        borderRadius: 8,
+        borderWidth: 1,
+        borderColor: AppColors_1.AppColors.dividerColor,
+        backgroundColor: AppColors_1.AppColors.white,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    discardBtnText: {
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 12.5,
+        color: AppColors_1.AppColors.grayTextStrong,
+    },
+    applyBtn: {
+        flex: 2,
+        backgroundColor: AppColors_1.AppColors.brandPurple,
+        paddingVertical: 9.5,
+        borderRadius: 8,
+        alignItems: 'center',
+        justifyContent: 'center',
+        shadowColor: AppColors_1.AppColors.brandPurple,
+        shadowOffset: { width: 0, height: 1 },
+        shadowOpacity: 0.25,
+        shadowRadius: 3,
+        elevation: 2,
+    },
+    applyBtnText: {
+        fontFamily: AppFonts_1.AppFonts.interBold,
+        fontSize: 12.5,
+        color: AppColors_1.AppColors.white,
+    },
+});
+exports.default = CrashFilterModal;

package/dist/commonjs/components/Inspector/CrashTab.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const CrashTab: React.MemoExoticComponent<() => React.JSX.Element>;
+export default CrashTab;