function MyUploads()

in frontend/src/js/components/IngestionEvents/MyUploads.tsx [24:99]


function MyUploads(
    {getCollections, getWorkspacesMetadata, updateCurrentWorkspace, collections, currentUser, workspacesMetadata, currentWorkspace = "all"}: {
        getCollections: (dispatch: any) => any,
        getWorkspacesMetadata: (dispatch: any) => any,
        updateCurrentWorkspace: (dispatch: any) => any,
        collections: Collection[],
        currentUser?: PartialUser,
        workspacesMetadata: WorkspaceMetadata[],
        currentWorkspace?: string
          }) {

    const [defaultCollection, setDefaultCollection] = useState<Collection>()

    const [toggleIdSelected, setToggleIdSelected] = useState<FilterState>(FilterState.All);

    useEffect(() => {
        updateCurrentWorkspace(currentWorkspace)
    }, [currentWorkspace, updateCurrentWorkspace])

    useEffect(() => {
        getCollections({})
        getWorkspacesMetadata({})
    }, [getCollections, getWorkspacesMetadata])

    useEffect(() => {
        if (currentUser && collections.length > 0) {
            setDefaultCollection(
                getDefaultCollection(currentUser.username, collections)
            )
        }
    }, [collections, currentUser])

    const toggleFilterButtons: {id: FilterState, label: string}[] = [
        { id: FilterState.All, label: 'all' },
        { id: FilterState.ErrorsOnly, label: 'errors only' },
      ];

    return (
        <div className='app__main-content'>
        <h1 className='page-title'>My workspace uploads</h1>
        <EuiProvider globalStyles={false} colorMode="light">
            {defaultCollection &&
                <>
                {workspacesMetadata.length > 0 &&
                <EuiFlexGroup>
                    <EuiFormControlLayout prepend={<EuiFormLabel htmlFor={"workspace-picker"}>Workspace</EuiFormLabel>}>
                        <EuiSelect
                            value={currentWorkspace}
                            onChange={(e) => updateCurrentWorkspace(e.target.value)}
                            id={"workspace-picker"}
                            options={
                                [{value: "all", text: "All workspaces"}].concat(
                                    _.sortBy(workspacesMetadata, (w) => w.name).map((w: WorkspaceMetadata) =>
                                        ({value: w.name, text: w.name}))
                                )
                            }
                        ></EuiSelect>
                    </EuiFormControlLayout>
                    <EuiButtonGroup
                        css={css`border: none;`}
                        legend="selection group to show all events or just the errors"
                        options={toggleFilterButtons}
                        idSelected={toggleIdSelected}
                        onChange={(id) => setToggleIdSelected(id as FilterState)}
                    >
                    </EuiButtonGroup>
                </EuiFlexGroup>
                }
                 <IngestionEvents
                     collectionId={defaultCollection.uri}
                     workspaces={workspacesMetadata.filter((w) => currentWorkspace === "all" || w.name === currentWorkspace)}
                     breakdownByWorkspace={true}
                     showErrorsOnly={toggleIdSelected === FilterState.ErrorsOnly}
                 ></IngestionEvents>
                </>
            }