All files / src/apps/sources/pages CreateSourcePage.tsx

23.08% Statements 3/13
0% Branches 0/9
0% Functions 0/4
27.27% Lines 3/11

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94                                                                          1x                                                                                     1x             1x            
import React, { useEffect } from "react";
import { Grid, Paper } from "@mui/material";
import { connect } from "react-redux";
import { Redirect, useLocation } from "react-router-dom";
import {
  createSourceDispatchAction,
  createSourceErrorsSelector,
  createSourceLoadingSelector,
  resetCreateSourceAction
} from "../redux";
import { APISource } from "../types";
import {
  orgsSelector,
  profileSelector
} from "../../authentication/redux/reducer";
import { APIOrg, APIProfile } from "../../authentication";
import { CONTEXT, usePrevious } from "../../../utils";
import SourceForm from "../components/SourceForm";
import Header from "../../../components/Header";
import { getSourceTypeFromPreviousPath } from "../utils";
import { AppState } from "../../../redux";
 
interface Props {
  errors?: {};
  profile?: APIProfile;
  usersOrgs?: APIOrg[];
  createSourceAction: (
    ...args: Parameters<typeof createSourceDispatchAction>
  ) => void;
  loading: boolean;
  newSource?: APISource;
  resetCreateSource: () => void;
}
interface UseLocation {
  prevPath: string;
}
 
const CreateSourcePage: React.FC<Props> = ({
  profile,
  usersOrgs,
  errors,
  createSourceAction,
  loading,
  resetCreateSource,
  newSource
}: Props) => {
  const previouslyLoading = usePrevious(loading);
  const { state } = useLocation<UseLocation>();
  const previousPath = state ? state.prevPath : "";
 
  // eslint-disable-next-line react-hooks/exhaustive-deps
  useEffect(() => resetCreateSource, []);
 
  if (!loading && previouslyLoading && newSource) {
    return <Redirect to={newSource.url} />;
  }
 
  return (
    <Header
      title={`${getSourceTypeFromPreviousPath(previousPath)} > Create Source`}
      backUrl="/user/sources/"
      backText="Back to sources"
      justifyChildren="space-around"
    >
      <Grid id="create-source-page" item xs={6} component="div">
        <Paper>
          <SourceForm
            context={CONTEXT.create}
            errors={errors}
            profile={profile}
            usersOrgs={usersOrgs ? usersOrgs : []}
            loading={loading}
            onSubmit={(values: APISource) => createSourceAction(values)}
          />
        </Paper>
      </Grid>
    </Header>
  );
};
 
export const mapStateToProps = (state: AppState) => ({
  profile: profileSelector(state),
  usersOrgs: orgsSelector(state),
  loading: createSourceLoadingSelector(state),
  newSource: state.sources.newSource,
  errors: createSourceErrorsSelector(state)
});
export const mapActionsToProps = {
  createSourceAction: createSourceDispatchAction,
  resetCreateSource: resetCreateSourceAction
};
 
export default connect(mapStateToProps, mapActionsToProps)(CreateSourcePage);