@cccsaurora/howler-ui 2.12.0-dev.30

package/dist/components/app/providers/ParameterProvider.js

@@ -0,0 +1,180 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isEmpty, isNull, isUndefined, omitBy, pickBy } from 'lodash-es';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useLocation, useParams, useSearchParams } from 'react-router-dom';
+import { createContext } from 'use-context-selector';
+import Throttler from 'utils/Throttler';
+export const ParameterContext = createContext(null);
+const DEFAULT_VALUES = {
+    query: 'howler.id:*',
+    sort: 'event.created desc',
+    span: 'date.range.1.month'
+};
+const WRITE_THROTTLER = new Throttler(100);
+/**
+ * Helper function to convert a number/string representation of a number into a valid offset.
+ * @returns
+ */
+const parseOffset = (_offset) => {
+    if (typeof _offset === 'number') {
+        return _offset;
+    }
+    const candidate = parseInt(_offset);
+    return isNaN(candidate) ? 0 : candidate;
+};
+/**
+ * Context responsible for tracking updates to query operations in hit and view search.
+ */
+const ParameterProvider = ({ children }) => {
+    const location = useLocation();
+    const routeParams = useParams();
+    const [params, setParams] = useSearchParams();
+    const pendingChanges = useRef({});
+    const [values, _setValues] = useState({
+        selected: params.get('selected'),
+        query: params.get('query') ?? DEFAULT_VALUES.query,
+        sort: params.get('sort') ?? DEFAULT_VALUES.sort,
+        span: params.get('span') ?? DEFAULT_VALUES.span,
+        filter: params.get('filter'),
+        startDate: params.get('start_date'),
+        endDate: params.get('end_date'),
+        offset: parseOffset(params.get('offset')),
+        trackTotalHits: (params.get('track_total_hits') ?? 'false') !== 'false'
+    });
+    // TODO: SELECTING A BUNDLE STILL CAUSES A FREAKOUT
+    const set = useCallback((key) => value => {
+        if (value === values[key]) {
+            return;
+        }
+        if (key === 'selected' && !value && location.pathname.startsWith('/bundles')) {
+            pendingChanges.current[key] = routeParams.id;
+        }
+        else {
+            pendingChanges.current[key] = value ?? DEFAULT_VALUES[key] ?? null;
+        }
+        if (key === 'span' && !value.endsWith('custom')) {
+            pendingChanges.current.startDate = null;
+            pendingChanges.current.endDate = null;
+        }
+        WRITE_THROTTLER.debounce(() => {
+            _setValues(_current => ({ ..._current, ...pendingChanges.current }));
+            pendingChanges.current = {};
+        });
+    }, [location.pathname, routeParams.id, values]);
+    const setOffset = useCallback(_offset => _setValues(_current => ({ ..._current, offset: parseOffset(_offset) })), []);
+    const setCustomSpan = useCallback((startDate, endDate) => {
+        _setValues(_values => ({
+            ..._values,
+            startDate,
+            endDate
+        }));
+    }, []);
+    const getDiff = useCallback((operation) => {
+        /**
+         * A record of changes necessary to synchronize the query string and the internal values store.
+         */
+        const changes = {};
+        const standardKeys = [
+            ['query', values.query],
+            ['sort', values.sort],
+            ['span', values.span],
+            ['filter', values.filter],
+            ['start_date', values.startDate],
+            ['end_date', values.endDate]
+        ];
+        standardKeys.forEach(([key, value]) => {
+            // Get the value from the URL, using the default values as fallback (and set to undefined if neither is set)
+            const fromSearchWithFallback = params.has(key) ? params.get(key) : (DEFAULT_VALUES[key] ?? undefined);
+            // If there's a difference between the search value and the value in the internal store, we append the key and new value to changes
+            // This is based on the operation
+            if (fromSearchWithFallback !== value) {
+                changes[key] = operation === 'write' ? value : fromSearchWithFallback;
+            }
+            // This is where things get a bit tricky. We use the fact that undefined and null are different concepts in Javascript here
+            // "undefined" is later filtered out, meaning "no change", while null means "remove this value"
+            if (operation === 'write') {
+                // If the change is to just set it to default in the query string, set it to null to just remove that entry altogether
+                // Due to the DEFAULT_VALUES check in fromSearchWithFallback above, this will use the defeault value.
+                // i.e., this has the same effect, but cleans up the query string
+                if (params.has(key) && !isUndefined(changes[key]) && changes[key] === DEFAULT_VALUES[key]) {
+                    changes[key] = null;
+                }
+            }
+        });
+        // Logic for the selected key - this can vary depending on the context
+        if (operation === 'write') {
+            // Are we in a bundle, with a selected parameter?
+            // If so, does it match the bundle ID? If so, it's redundant and should be removed
+            if (location.pathname.startsWith('/bundles') &&
+                (!params.has('selected') || values.selected === params.get('selected'))) {
+                changes.selected = null;
+            }
+            else {
+                // We're either not in a bundle, or in a bundle and a hit different from the main bundle is selected
+                changes.selected = values.selected;
+            }
+        }
+        else {
+            if (params.has('selected')) {
+                // If we have a selected hit, that's the selected value to use
+                changes.selected = params.get('selected');
+            }
+            else if (location.pathname.startsWith('/bundles')) {
+                // If not, fallback to the bundle ID
+                changes.selected = routeParams.id;
+            }
+            else {
+                // Otherwise nothing has been selected
+                changes.selected = null;
+            }
+        }
+        if (parseOffset(params.get('offset')) !== values.offset) {
+            changes.offset = operation === 'write' ? values.offset : parseOffset(params.get('offset'));
+            // Same deal - if offset is 0, just remove it entirely (it'll default to 0 offset)
+            if (operation === 'write' && !changes.offset) {
+                changes.offset = null;
+            }
+        }
+        // This is where we check for what has actually changed against the given store
+        // We first omit undefined keys (fromSearchWithFallback can introduce these)
+        // Then we omit any values that already match the store we're updating
+        // (query string or internal state).
+        return omitBy(omitBy(changes, isUndefined), (val, key) => operation === 'write' ? val == params.get(key) : val == values[key]);
+    }, [values, params, location.pathname, routeParams.id]);
+    /**
+     * Effect to synchronize the context's state with the address bar
+     */
+    useEffect(() => {
+        const changes = getDiff('write');
+        if (!isEmpty(changes)) {
+            const existingParams = Object.fromEntries(params.entries());
+            setParams(_params => {
+                const newParams = new URLSearchParams({ ...existingParams, ...changes });
+                Object.entries(pickBy(changes, isNull)).forEach(([key]) => newParams.delete(key));
+                return newParams;
+            }, { replace: !changes.query && !Object.keys(changes).includes('offset') });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [values]);
+    useEffect(() => {
+        const changes = getDiff('read');
+        if (!isEmpty(changes)) {
+            _setValues(_current => ({
+                ..._current,
+                ...changes
+            }));
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [location.search, location.pathname, routeParams.id]);
+    return (_jsx(ParameterContext.Provider, { value: {
+            ...values,
+            setOffset,
+            setCustomSpan,
+            setSelected: useMemo(() => set('selected'), [set]),
+            setQuery: useMemo(() => set('query'), [set]),
+            setSort: useMemo(() => set('sort'), [set]),
+            setSpan: useMemo(() => set('span'), [set]),
+            setFilter: useMemo(() => set('filter'), [set])
+        }, children: children }));
+};
+export default ParameterProvider;

package/dist/components/app/providers/SocketProvider.d.ts

@@ -0,0 +1,57 @@
+import type { PropsWithChildren } from 'react';
+export type ListenerType<K extends keyof WebSocketEventMap> = (this: WebSocket, ev: WebSocketEventMap[K]) => void;
+/**
+ * The type of the data returned from the server during a WebSocket connection.
+ * The only guaranteed keys are error, message and status.
+ */
+export type RecievedDataType<T = {
+    [index: string]: any;
+}> = T & {
+    error: boolean;
+    message: string;
+    type: string;
+    status: number;
+};
+/**
+ * Enum to help track the status of the Websocket, since the corresponding websocket enums are directly on the object
+ */
+export declare enum Status {
+    CLOSED,
+    CLOSING,
+    CONNECTING,
+    OPEN
+}
+interface SocketContextType {
+    /**
+     * Add a listener for events from the websocket connection.
+     * @param key The unique key used to track this listener
+     * @param v The listener function
+     */
+    addListener: <T = {
+        [index: string]: any;
+    }>(key: string, v: (data: RecievedDataType<T>) => void) => void;
+    /**
+     * Remove a listener from the websocket connection.
+     * @param key The unique key used to track the listener we're removing
+     */
+    removeListener: (key: string) => void;
+    /**
+     * Wrapper function for WebSocket.send(...). Used to send data to the server.
+     */
+    emit: (data: any) => void;
+    /**
+     * The status of the websocket connection.
+     */
+    status: Status;
+    /**
+     * Manually attempt reconnecting to the server.
+     */
+    reconnect: () => void;
+    /**
+     * Helper function to tell if the socket is open
+     */
+    isOpen: () => boolean;
+}
+export declare const SocketContext: import("react").Context<SocketContextType>;
+declare const SocketProvider: React.FC<PropsWithChildren>;
+export default SocketProvider;

package/dist/components/app/providers/SocketProvider.js

@@ -0,0 +1,226 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable no-console */
+import api from 'api';
+import useMyLocalStorage from 'components/hooks/useMyLocalStorage';
+import { createContext, useCallback, useEffect, useRef, useState } from 'react';
+import { StorageKey } from 'utils/constants';
+import { getStored, setAxiosCache, setStored } from 'utils/sessionStorage';
+import { isHitUpdate } from 'utils/socketUtils';
+/**
+ * Enum to help track the status of the Websocket, since the corresponding websocket enums are directly on the object
+ */
+export var Status;
+(function (Status) {
+    Status[Status["CLOSED"] = WebSocket.CLOSED] = "CLOSED";
+    Status[Status["CLOSING"] = WebSocket.CLOSING] = "CLOSING";
+    Status[Status["CONNECTING"] = WebSocket.CONNECTING] = "CONNECTING";
+    Status[Status["OPEN"] = WebSocket.OPEN] = "OPEN";
+})(Status || (Status = {}));
+export const SocketContext = createContext(null);
+const SocketProvider = ({ children }) => {
+    const { get } = useMyLocalStorage();
+    // In order to persist the connection through state changes, we use a ref
+    const socket = useRef();
+    // Due to react setState race conditions, listeners are also stored in a ref
+    const listeners = useRef({});
+    // We will need to use the app token to authenticate.
+    // Note the token MUST BE either an app token or a JWT - user/pass or apikey authentication isn't allowed
+    const appToken = get(StorageKey.APP_TOKEN);
+    const [status, setStatus] = useState(Status.CLOSED);
+    // Track whether we should retry the connection to the server
+    const [retry, setRetry] = useState(true);
+    // Track the number of failed attempts when connecting to the server
+    const [failedAttempts, setFailedAttempts] = useState(0);
+    const onClose = useCallback(e => {
+        // https://www.rfc-editor.org/rfc/rfc6455:
+        // 1006 is a reserved value and MUST NOT be set as a status code in a
+        // Close control frame by an endpoint.  It is designated for use in
+        // applications expecting a status code to indicate that the
+        // connection was closed abnormally, e.g., without sending or
+        // receiving a Close control frame.
+        if (e.code === 1006) {
+            setTimeout(() => setRetry(true), 1000 * Math.pow(2, failedAttempts));
+            setFailedAttempts(failedAttempts + 1);
+        }
+        // https://www.rfc-editor.org/rfc/rfc6455:
+        // 1008 indicates that an endpoint is terminating the connection
+        // because it has received a message that violates its policy.  This
+        // is a generic status code that can be returned when there is no
+        // other more suitable status code (e.g., 1003 or 1009) or if there
+        // is a need to hide specific details about the policy.
+        //
+        // In our case, we use 1008 to indicate the connection did something wrong.
+        // For more granular error handling, we provide a status code equivalent
+        // To the HTTP status codes we know (400, 401, 403, etc.).
+        else if (e.code === 1008) {
+            try {
+                // Check to see if there's any data we can parse, or if it's just a bad connection
+                const data = JSON.parse(e.reason);
+                // If we are unauthorized, we can update the token through the usual process and tell
+                // the connection to retry with the new token
+                if (data.status === 401) {
+                    api.user.whoami.get().then(() => setRetry(true));
+                }
+                else {
+                    console.error(data);
+                    setRetry(false);
+                }
+            }
+            catch (err) {
+                // There's no useful data, or the refresh attempt failed.
+                // Either way, we can't really do anything
+            }
+        }
+        setStatus(Status.CLOSED);
+    }, [failedAttempts]);
+    /**
+     * Handler for errors with the websocket connection
+     */
+    const onWsError = useCallback(() => {
+        setStatus(Status.CLOSING);
+        socket.current?.close();
+        setStatus(Status.CLOSED);
+        // Exponential fall off of connection attempts (1s, then 2, 4, 8, 16, etc.)
+        setTimeout(() => setRetry(true), 1000 * Math.pow(2, failedAttempts));
+        setFailedAttempts(failedAttempts + 1);
+    }, [failedAttempts]);
+    /**
+     * Handler for messages sent form the server NOT RELATED to the websocket connection itself
+     *
+     * i.e. We sent bad data, did something the server didn't like, etc.
+     */
+    const onMessageError = useCallback(e => {
+        try {
+            const data = JSON.parse(e.data);
+            if (data?.error || data?.status >= 400) {
+                console.warn(data?.message || 'Websocket Error');
+            }
+        }
+        catch (err) {
+            console.warn('Websocket Error');
+        }
+    }, []);
+    /**
+     * Handler called when the page unloads, used to gracefully close the socket.
+     *
+     * This isn't a hard requirement to run, but it's good form.
+     */
+    const onBeforeUnload = useCallback(() => socket.current?.close(), []);
+    // Effect used to start a connection to the websocket server
+    useEffect(() => {
+        // If the socket is already open, ovbviously we don't need to connect again
+        if ([Status.OPEN, Status.CONNECTING].includes(status)) {
+            if (status === Status.OPEN) {
+                setRetry(false);
+            }
+            return;
+        }
+        // If we aren't retrying or we don't have an app token we can use, we don't continue
+        if (!retry || !appToken)
+            return;
+        setRetry(false);
+        // Here we go!
+        setStatus(Status.CONNECTING);
+        const host = window.location.host.startsWith('localhost') ? 'localhost:5000' : window.location.host;
+        const protocol = window.location.protocol.startsWith('http:') ? 'ws' : 'wss';
+        const ws = new WebSocket(`${protocol}://${host}/socket/v1/connect`);
+        // Add our listeners to the websocket
+        ws.addEventListener('close', onClose);
+        ws.addEventListener('error', onWsError);
+        ws.addEventListener('message', onMessageError);
+        ws.addEventListener('open', () => {
+            socket.current = ws;
+            // Hooray! The connection was successful.
+            // But we aren't done yet - we need to authenticate before doing anything else.
+            // So, we send the token
+            ws.send(appToken);
+            // Just for this first response, we add a custom listener to the socket.
+            // It waits for a response from our token message, and ensures the server accepted it
+            const onAuth = e => {
+                ws.removeEventListener('message', onAuth);
+                const data = JSON.parse(e.data);
+                // If there's no error, the token was accepted and we're good to go!
+                if (!data.error) {
+                    console.debug(data.message);
+                    setStatus(Status.OPEN);
+                    setRetry(false);
+                    setFailedAttempts(0);
+                    // If there is, the server will close the socket and the token refreshing code will take over
+                }
+                else {
+                    console.error(data.message);
+                }
+            };
+            ws.addEventListener('message', onAuth);
+        });
+        window.addEventListener('beforeunload', onBeforeUnload);
+    }, [appToken, status, onBeforeUnload, onClose, onWsError, onMessageError, retry]);
+    // Handler for when the socket opens
+    useEffect(() => {
+        // The socket is open, so we can add any listeners that were waiting for it to open
+        if (status === Status.OPEN) {
+            Object.values(listeners.current).forEach(l => {
+                socket.current?.removeEventListener('message', l);
+                socket.current?.addEventListener('message', l);
+            });
+        }
+    }, [listeners, status]);
+    // Handler for when the socket closes
+    useEffect(() => {
+        if (!socket.current)
+            return;
+        if ([Status.CLOSED, Status.CLOSING].includes(status)) {
+            socket.current.removeEventListener('close', onClose);
+            socket.current.removeEventListener('error', onWsError);
+            socket.current.removeEventListener('message', onMessageError);
+            Object.values(listeners.current).forEach(l => socket.current.removeEventListener('message', l));
+            listeners.current = {};
+            window.removeEventListener('beforeunload', onBeforeUnload);
+            socket.current.close();
+            socket.current = null;
+        }
+    }, [status, socket, appToken, onBeforeUnload, onClose, onWsError, onMessageError]);
+    const addListener = useCallback((key, callback) => {
+        // If a listener with the same key already exists, remove it.
+        if (listeners.current[key]) {
+            socket.current?.removeEventListener('message', listeners[key]);
+        }
+        // We wrap the callback so that all the listeners don't need to JSON.parse the data
+        const wrapped = ev => {
+            const parsedData = JSON.parse(ev.data);
+            if (isHitUpdate(parsedData) && parsedData.status < 300) {
+                setStored(StorageKey.ETAG, {
+                    ...getStored(StorageKey.ETAG),
+                    [parsedData.hit.howler.id]: parsedData.version
+                });
+                setAxiosCache(parsedData.version, {
+                    api_response: parsedData.hit,
+                    api_error_message: '',
+                    api_server_version: '',
+                    api_status_code: parsedData.status
+                });
+            }
+            callback(parsedData);
+        };
+        socket.current?.addEventListener('message', wrapped);
+        listeners.current[key] = wrapped;
+    }, []);
+    const removeListener = useCallback((key) => {
+        socket.current?.removeEventListener('message', listeners.current[key]);
+        delete listeners.current[key];
+    }, []);
+    const emit = useCallback(data => {
+        if (typeof data !== 'string') {
+            data = JSON.stringify(data);
+        }
+        if (status !== Status.OPEN || !socket.current) {
+            console.warn('socket closed, not sending');
+            return;
+        }
+        socket.current?.send(data);
+    }, [status]);
+    const isOpen = useCallback(() => status === Status.OPEN, [status]);
+    const reconnect = useCallback(() => setRetry(true), []);
+    return (_jsx(SocketContext.Provider, { value: { addListener, removeListener, emit, status, reconnect, isOpen }, children: children }));
+};
+export default SocketProvider;

package/dist/components/app/providers/TemplateProvider.d.ts

@@ -0,0 +1,13 @@
+import type { Hit } from 'models/entities/generated/Hit';
+import type { Template } from 'models/entities/generated/Template';
+import type { FC, PropsWithChildren } from 'react';
+interface TemplateContextType {
+    templates: Template[];
+    getTemplates: (force?: boolean) => Promise<Template[]>;
+    getMatchingTemplate: (h: Hit) => Template;
+    refresh: () => void;
+    loaded: boolean;
+}
+export declare const TemplateContext: import("use-context-selector").Context<TemplateContextType>;
+declare const TemplateProvider: FC<PropsWithChildren>;
+export default TemplateProvider;

package/dist/components/app/providers/TemplateProvider.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import api from 'api';
+import useMyApi from 'components/hooks/useMyApi';
+import { useCallback, useRef, useState } from 'react';
+import { createContext } from 'use-context-selector';
+const SIX_TAIL_PHISH_DETAILS = [
+    'event.start',
+    'event.end',
+    'destination.ip',
+    'destination.domain',
+    'cloud.service.name',
+    'error.code',
+    'error.message'
+];
+/**
+ * TODO: Ask analysts to move these into the API
+ */
+const BUILTIN_TEMPLATES = [
+    {
+        analytic: '6TailPhish',
+        keys: SIX_TAIL_PHISH_DETAILS,
+        owner: 'none',
+        template_id: '6tailphish.builtin',
+        type: 'readonly'
+    }
+];
+export const TemplateContext = createContext(null);
+const TemplateProvider = ({ children }) => {
+    const request = useRef(null);
+    const { dispatchApi } = useMyApi();
+    const [loaded, setLoaded] = useState(false);
+    const templateRequest = useRef(null);
+    const [templates, setTemplates] = useState(BUILTIN_TEMPLATES);
+    const getTemplates = useCallback(async (force = false) => {
+        if (request.current) {
+            return request.current;
+        }
+        if (loaded && !force) {
+            return templates;
+        }
+        else if (templateRequest.current) {
+            return templateRequest.current;
+        }
+        else {
+            try {
+                request.current = dispatchApi(api.template.get());
+                const result = await request.current;
+                const fullList = [...BUILTIN_TEMPLATES, ...result];
+                setTemplates(fullList);
+                setLoaded(true);
+                return fullList;
+            }
+            catch (e) {
+                return [];
+            }
+            finally {
+                request.current = null;
+            }
+        }
+    }, [dispatchApi, loaded, templates]);
+    /**
+     * Based on a given hit, retrieve the best match for a template
+     */
+    const getMatchingTemplate = useCallback((hit) => templates
+        .filter(_template => 
+    // The analytic must match, and the detection must either a) not exist or b) match the hit
+    _template.analytic === hit.howler.analytic &&
+        (!_template.detection || _template.detection.toLowerCase() === hit.howler.detection?.toLowerCase()))
+        .sort((a, b) => {
+        // Sort priority:
+        // 1. personal > readonly > global
+        // 2. detection > !detection
+        if (a.type !== b.type) {
+            const order = {
+                personal: 2,
+                readonly: 1,
+                global: 0
+            };
+            return order[b.type] - order[a.type];
+        }
+        else {
+            if (a.detection && !b.detection) {
+                return -1;
+            }
+            else if (!a.detection && b.detection) {
+                return 1;
+            }
+            else {
+                return 0;
+            }
+        }
+    })[0], [templates]);
+    const refresh = useCallback(() => {
+        setLoaded(false);
+        getTemplates();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return (_jsx(TemplateContext.Provider, { value: { templates, getTemplates, getMatchingTemplate, refresh, loaded }, children: children }));
+};
+export default TemplateProvider;

package/dist/components/app/providers/UserListProvider.d.ts

@@ -0,0 +1,12 @@
+import type { HowlerUser } from 'models/entities/HowlerUser';
+import type { FC, PropsWithChildren } from 'react';
+interface UserListContextType {
+    users: {
+        [id: string]: HowlerUser;
+    };
+    searchUsers: (query: string) => void;
+    fetchUsers: (ids: Set<string>) => void;
+}
+export declare const UserListContext: import("react").Context<UserListContextType>;
+declare const UserListProvider: FC<PropsWithChildren>;
+export default UserListProvider;

package/dist/components/app/providers/UserListProvider.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import api from 'api';
+import useMyApi from 'components/hooks/useMyApi';
+import { createContext, useCallback, useState } from 'react';
+export const UserListContext = createContext(null);
+const UserListProvider = ({ children }) => {
+    const { dispatchApi } = useMyApi();
+    const [users, setUsers] = useState({});
+    const searchUsers = useCallback(async (query) => {
+        const newUsers = (await dispatchApi(api.search.user.post({ query, rows: 1000 }), {
+            throwError: false,
+            logError: false,
+            showError: false
+        }))?.items?.reduce((dict, user) => ({ ...dict, [user.username]: user }), {});
+        setUsers(_users => ({
+            ..._users,
+            ...newUsers
+        }));
+    }, [dispatchApi]);
+    const fetchUsers = useCallback(async (ids) => {
+        ids.delete('Unknown');
+        const idsToGet = Array.from(ids.values()).filter(id => !Object.keys(users).includes(id));
+        if (idsToGet.length <= 0) {
+            return;
+        }
+        await searchUsers(`id:${[...idsToGet].join(' OR ')}`);
+    }, [searchUsers, users]);
+    return _jsx(UserListContext.Provider, { value: { users, fetchUsers, searchUsers }, children: children });
+};
+export default UserListProvider;

package/dist/components/app/providers/ViewProvider.d.ts

@@ -0,0 +1,18 @@
+import type { View } from 'models/entities/generated/View';
+import { type FC, type PropsWithChildren } from 'react';
+export interface ViewContextType {
+    ready: boolean;
+    defaultView: string;
+    setDefaultView: (viewId: string) => void;
+    views: View[];
+    addFavourite: (id: string) => Promise<void>;
+    removeFavourite: (id: string) => Promise<void>;
+    fetchViews: (force?: boolean) => Promise<void>;
+    addView: (v: View) => Promise<View>;
+    editView: (id: string, title: string, query: string, sort: string, span: string, advanceOnTriage: boolean) => Promise<View>;
+    removeView: (id: string) => Promise<void>;
+    getCurrentView: () => View;
+}
+export declare const ViewContext: import("use-context-selector").Context<ViewContextType>;
+declare const ViewProvider: FC<PropsWithChildren>;
+export default ViewProvider;