@twilio/flex-ui/src/components/view/TeamsView/TeamsView.d.ts

Twilio Flex UI

import { DynamicContentStore, FilterDefinition } from "../../../flex-ui-core/src";
import * as React from "react";
import { FlexState } from "../../../store";
import { FilterDefinitionFactory, TeamsViewChildrenKeys, TeamsViewImplProps, TeamsViewImplStateProps, TeamsViewProgrammableProps, TeamsViewProps } from "./TeamsView.definitions";
/**
 * @classdesc This renders the teams page.
 * @class TeamsView
 * @component
 * @hideconstructor
 * @param {TeamsView.TeamsViewProps} props - Properties to be passed to configure this component.
 * @category Components / Programmable
 * @subcategory Components
 */
export declare class TeamsView extends React.PureComponent<TeamsViewProps> {
    static readonly displayName = "TeamsView";
    /**
     * Dynamic content store
     * @static
     * @type {DynamicContentStore<TeamsView.TeamsViewImplProps, TeamsViewChildrenKeys>}
     * @readonly
     */
    static readonly Content: DynamicContentStore<TeamsViewImplProps, TeamsViewChildrenKeys>;
    /**
     * Activities filter
     * @static
     * @type {activitiesFilterSelector}
     * @readonly
     */
    static activitiesFilter: import("reselect").OutputSelector<FlexState, FilterDefinition, (res: [string, any][]) => FilterDefinition>;
    /**
     * Default properties
     * @static
     * @type {Partial<TeamsView.TeamsViewProps>}
     * @readonly
     */
    static readonly defaultProps: TeamsViewProgrammableProps;
    /**
     * Helper method to subscribe to workers with predefined filter. Can be called to populate
     * workers state when outside TeamsView, such as when using WorkersDataTable separately.
     *
     * @static
     * @method
     * @returns {Promise<void>}
     * @name subscribeToWorkers
     * @deprecated
     * @deprecatedSince 2.0.0
     * @altRecommendation Use native WorkersDataTable inside teams view
     * @altRecommendationExample
     * // Use WorkersDataTable to subscribe to workers directly - this must be used when inside TeamsView
     * @altRecommendationLink https://assets.flex.twilio.com/docs/releases/flex-ui/latest/programmable-components/components/WorkersDataTable/
     * @private
     */
    static subscribeToWorkers: () => Promise<void>;
    private getBaseRoute;
    private getTaskSidFromRoute;
    private getWorkerSidFromRoute;
    render(): JSX.Element;
    private renderRouteChildren;
}
export declare const Connected: import("react-redux").ConnectedComponent<React.FC<Pick<TeamsViewImplStateProps & import("../../theme").ThemeProps & {
    isViewActive?: boolean;
    hiddenFilter?: import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter | import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter[] | string;
    filters: (FilterDefinition | FilterDefinitionFactory)[];
    selectedTaskSid?: string;
    selectedWorkerSid?: string;
    teams?: import("../../../state/Supervisor/SupervisorState.definitions").Teams[];
    teamsHierarchy?: {
        [key: string]: string;
    };
    selectedTeams?: string[];
    textSearch?: string;
    isNewTeamsViewEnabled?: boolean;
    isNewTeamsViewColumnsEnabled?: boolean;
    agentMetricsColumnsPreference?: import("../../supervisor/TeamFiltersPanel/AgentMetricsTab/AgentMetricsTab.definitions").metricDataType[];
    isGraphQLPreferenceEnabled?: boolean;
    isCustomColumnsTeamsViewEnabled?: boolean;
    preferenceHooks?: {
        createFlexUserPreference: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    preferenceValue: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<any>;
        fetchPreferences: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<{
            data: {
                flexUserPreference: {
                    preferenceValue: any;
                };
            };
        }>;
    };
}, "selectedTaskSid" | "filters" | "teams" | "isNewTeamsViewEnabled" | "teamsHierarchy" | "selectedTeams" | "agentMetricsColumnsPreference" | "isViewActive" | "isNewTeamsViewColumnsEnabled" | "isGraphQLPreferenceEnabled" | "isCustomColumnsTeamsViewEnabled" | "preferenceHooks" | "hiddenFilter" | "selectedWorkerSid" | "textSearch" | keyof TeamsViewImplStateProps> & {
    theme?: import("@emotion/react").Theme;
}>, import("react-redux").Omit<Pick<TeamsViewImplStateProps & import("../../theme").ThemeProps & {
    isViewActive?: boolean;
    hiddenFilter?: import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter | import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter[] | string;
    filters: (FilterDefinition | FilterDefinitionFactory)[];
    selectedTaskSid?: string;
    selectedWorkerSid?: string;
    teams?: import("../../../state/Supervisor/SupervisorState.definitions").Teams[];
    teamsHierarchy?: {
        [key: string]: string;
    };
    selectedTeams?: string[];
    textSearch?: string;
    isNewTeamsViewEnabled?: boolean;
    isNewTeamsViewColumnsEnabled?: boolean;
    agentMetricsColumnsPreference?: import("../../supervisor/TeamFiltersPanel/AgentMetricsTab/AgentMetricsTab.definitions").metricDataType[];
    isGraphQLPreferenceEnabled?: boolean;
    isCustomColumnsTeamsViewEnabled?: boolean;
    preferenceHooks?: {
        createFlexUserPreference: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    preferenceValue: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<any>;
        fetchPreferences: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<{
            data: {
                flexUserPreference: {
                    preferenceValue: any;
                };
            };
        }>;
    };
}, "selectedTaskSid" | "filters" | "teams" | "isNewTeamsViewEnabled" | "teamsHierarchy" | "selectedTeams" | "agentMetricsColumnsPreference" | "isViewActive" | "isNewTeamsViewColumnsEnabled" | "isGraphQLPreferenceEnabled" | "isCustomColumnsTeamsViewEnabled" | "preferenceHooks" | "hiddenFilter" | "selectedWorkerSid" | "textSearch" | keyof TeamsViewImplStateProps> & {
    theme?: import("@emotion/react").Theme;
}, "workers" | "appliedFilters" | "legacyFilters" | "appliedLegacyFilterQuery" | "flexUserSid" | "stickyWorker" | "isLoadingWorkers" | "errorLoadingWorkers" | "selectedTask" | "selectedWorker" | "monitoredTaskSid" | "isSearchFilterApplied" | "appliedFiltersCount" | "filterDefinitions" | "filterQuery"> & import("../../theme").ThemeProps & {
    isViewActive?: boolean;
    hiddenFilter?: import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter | import("../../../state/Supervisor/SupervisorState.definitions").AppliedFilter[] | string;
    filters: (FilterDefinition | FilterDefinitionFactory)[];
    selectedTaskSid?: string;
    selectedWorkerSid?: string;
    teams?: import("../../../state/Supervisor/SupervisorState.definitions").Teams[];
    teamsHierarchy?: {
        [key: string]: string;
    };
    selectedTeams?: string[];
    textSearch?: string;
    isNewTeamsViewEnabled?: boolean;
    isNewTeamsViewColumnsEnabled?: boolean;
    agentMetricsColumnsPreference?: import("../../supervisor/TeamFiltersPanel/AgentMetricsTab/AgentMetricsTab.definitions").metricDataType[];
    isGraphQLPreferenceEnabled?: boolean;
    isCustomColumnsTeamsViewEnabled?: boolean;
    preferenceHooks?: {
        createFlexUserPreference: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    preferenceValue: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<any>;
        fetchPreferences: (input: {
            variables: {
                input: {
                    preferenceKey: string;
                    flexUserSid: string;
                };
            };
        }) => Promise<{
            data: {
                flexUserPreference: {
                    preferenceValue: any;
                };
            };
        }>;
    };
}>;