Skip to content

Commit

Permalink
Added company values filling form inputs and editCompany service
Browse files Browse the repository at this point in the history
  • Loading branch information
@tomaspalma
tomaspalma committed Sep 15, 2023
1 parent 1d05cf2 commit 0631e65
Show file tree
Hide file tree
Showing 9 changed files with 216 additions and 100 deletions.
2 changes: 1 addition & 1 deletion src/AppRouter.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import {
import { CookieConsent } from "./cookieConsent";
import {
EditOfferController,
EditOfferControllerContext
EditOfferControllerContext,
} from "./components/Offers/Edit/EditOfferForm";
import EditOfferPage from "./pages/EditOfferPage";
import PrivacyPolicyPage from "./pages/PrivacyPolicyPage";
Expand Down
216 changes: 132 additions & 84 deletions src/components/Company/Edit/EditCompanyProfileForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import { useMobile } from "../../../utils/media-queries";
import useOfferFormStyles from "../../../components/Offers/Form/form-components/offerStyles";
import TextEditorComponent from "../../Offers/Form/form-components/TextEditorComponent";

Check failure on line 18 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

'TextEditorComponent' is defined but never used
import useOffer from "../../../hooks/useOffer";

Check failure on line 19 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

'useOffer' is defined but never used
import { Controller, useForm } from "react-hook-form";
import { Controller, useForm, useWatch } from "react-hook-form";
import useCompany from "../../../hooks/useCompany";
import useSession from "../../../hooks/useSession";
import { Redirect, useLocation, useParams } from "react-router-dom/cjs/react-router-dom.min";
Expand All @@ -31,8 +31,8 @@ export const EditCompanyControllerContext = React.createContext();

const useStyles = makeStyles((theme) => ({
submitBtn: {
marginTop: theme.spacing(2)
}
marginTop: theme.spacing(2),
},
}));

export const EditCompanyController = () => {
Expand All @@ -41,9 +41,21 @@ export const EditCompanyController = () => {
const { data: user, isValidating } = useSession();
let canEditRaceControl = false;

const shouldRevalidateEditingPermissions = useCallback(() => {
return user?.isAdmin || user?.company?._id === id;
}, [company, user]);
const { handleSubmit, control, reset, formState } = useForm({

Check failure on line 44 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

'formState' is assigned a value but never used
mode: "all",
resolver: yupResolver(EditCompanySchema),
defaultValues: {
logo: "",
name: "",
contacts: [],
bio: "",
},
reValidateMode: "onChange",
});

const fields = useWatch({ control });

const shouldRevalidateEditingPermissions = useCallback(() => user?.isAdmin || user?.company?._id === id, [id, user]);

const [canEdit, setCanEdit] = useState(shouldRevalidateEditingPermissions());

Expand All @@ -54,6 +66,12 @@ export const EditCompanyController = () => {
}
}, [shouldRevalidateEditingPermissions, loadingCompany, company, user]);

useEffect(() => {
if (company && !isValidating && canEdit) {
reset(company);
}
}, [canEdit, isValidating, company, reset]);

const location = useLocation();
const redirectProps = {
to: {
Expand All @@ -65,6 +83,11 @@ export const EditCompanyController = () => {
},
};

const submit = useCallback((data) => {

Check warning on line 86 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

React Hook useCallback does nothing when called with only one argument. Did you forget to pass an array of dependencies?

Check failure on line 86 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

'data' is defined but never used. Allowed unused args must match /^_/u
alert("Foda-se meu");
},
);

return {
controllerOptions: {
initialValue: {
Expand All @@ -75,7 +98,10 @@ export const EditCompanyController = () => {
companyError,
isValidating,
canEditRaceControl,
}
control,
fields,
submit: handleSubmit(submit),
},
},
};
};
Expand All @@ -92,17 +118,13 @@ const EditCompanyProfileForm = ({ title }) => {
redirectProps,
isValidating,
canEditRaceControl,
control,
submit,
} = useContext(EditCompanyControllerContext);

const classes = useStyles();

const { control } = useForm({
mode: "all",
resolver: yupResolver(EditCompanySchema),
reValidateMode: "onChange",
});

const { fields, append, remove } = useContacts({ control });
const { fields: contacts, append, remove } = useContacts({ control });

Check failure on line 127 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

'contacts' is assigned a value but never used

const getContacts = useCallback(() => {
if (!company) return [{}];
Expand All @@ -126,82 +148,108 @@ const EditCompanyProfileForm = ({ title }) => {
return <Redirect {...redirectProps} />;
}

console.log("Submit is: ", submit);

Check warning on line 151 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

Unexpected console statement

return <>
<div className={formCardClasses.formCard}>
<CardHeader title={title} />
<Content className={formCardClasses.formContent}>
<Grid container spacing={4} className={formCardClasses.formArea}>
<Grid container className={formCardClasses.formArea}>
<Grid item xs={12}>
<Box
display="flex"
justifyContent="center"
<form
onSubmit={submit()}
>
<Avatar
alt={`${company?.name}'s logo`}
src={company?.logo}
style={{ height: '5em', width: '5em' }}
/>
</Box>
</Grid>
<Grid item xs={12}>
<TextField
label="Name"
value={company?.name}
fullWidth
required
autoFocus
/>
</Grid>
<Grid item xs={12}>
<MultiOptionTextField
control={control}
controllerName="contacts"
values={getContacts()}
onAdd={append}
onRemove={remove}
/>
</Grid>
<Grid item xs={12}>
<Controller
name="bio"
render={(
{ field: { onChange, onBlur, ref, name, value } },
) => (
<TextField
name={name}
value={value}
label="Company Bio"
id="bio"
// error={!!errors.bio}
inputRef={ref}
onBlur={onBlur}
onChange={onChange}
multiline
// helperText={
// `${value?.length}/${FinishCompanyRegistrationConstants.bio.maxLength} ${errors.bio?.message || ""}`
// }
rows={5}
variant="outlined"
FormHelperTextProps={{
style: {
marginLeft: 0,
},
}}
fullWidth
/>)}
control={control}
/>
<Grid container spacing={4}>
<Grid item xs={12}>
<Box
display="flex"
justifyContent="center"
>
<Avatar
alt={`${company?.name}'s logo`}
src={company?.logo}
style={{ height: "5em", width: "5em" }}
/>
</Box>
</Grid>
<Grid item xs={12}>
<Controller
name="name"
render={(
{ field: {
onChange, onBlur, ref, name, value,
} }
) => (
<TextField
label="Name"
name={name}
id={name}
inputRef={ref}
onBlur={onBlur}
value={value}
fullWidth
required
autoFocus
onChange={onChange}
/>
)}
control={control}
/>
</Grid>
<Grid item xs={12}>
<MultiOptionTextField
control={control}
controllerName="contacts"
values={getContacts()}
onAdd={append}
onRemove={remove}
itemLabelPrefix="Contact #"
/>
</Grid>
<Grid item xs={12}>
<Controller
name="bio"
render={(
{ field: { onChange, onBlur, ref, name, value } },
) => (
<TextField
name={name}
value={value}
label="Company Bio"
id="bio"
// error={!!errors.bio}
inputRef={ref}
onBlur={onBlur}
onChange={onChange}
multiline
// helperText={
// `${value?.length}/${FinishCompanyRegistrationConstants.bio.maxLength} ${errors.bio?.message || ""}`

Check failure on line 226 in src/components/Company/Edit/EditCompanyProfileForm.js

View workflow job for this annotation

GitHub Actions / build 

This line has a length of 154. Maximum allowed is 140
// }
rows={5}
variant="outlined"
FormHelperTextProps={{
style: {
marginLeft: 0,
},
}}
fullWidth
/>)}
control={control}
/>
</Grid>
</Grid>
<Button
// disabled={loading || formDisabled}
variant="contained"
color="primary"
type="submit"
className={classes.submitBtn}
>
Submit
</Button>
</form>
</Grid>
</Grid>
<Button
// disabled={loading || formDisabled}
variant="contained"
color="primary"
type="submit"
className={classes.submitBtn}
>
Submit
</Button>
<div className={formCardClasses.requiredFields}>
<Typography>* Required fields</Typography>
</div>
Expand All @@ -212,7 +260,7 @@ const EditCompanyProfileForm = ({ title }) => {
};

EditCompanyProfileForm.propTypes = {
title: PropTypes.string
}
title: PropTypes.string,
};

export default EditCompanyProfileForm;
11 changes: 11 additions & 0 deletions src/components/Company/Edit/EditCompanySchema.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import * as yup from "yup";
import { HumanValidationReasons } from "../../../utils";
import FinishCompanyRegistrationSchema from "../Registration/Finish/FinishCompanyRegistrationSchema";
import { generateValidationRule } from "./EditCompanyUtils";

export default FinishCompanyRegistrationSchema.concat(yup.object().shape({
name: yup.string()
.required(HumanValidationReasons.REQUIRED)
.min(...generateValidationRule("name", "minLength", HumanValidationReasons.TOO_SHORT))
.max(...generateValidationRule("name", "maxLength", HumanValidationReasons.TOO_LONG)),
}));
8 changes: 8 additions & 0 deletions src/components/Company/Edit/EditCompanyUtils.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import { validationRulesGenerator, generalHumanError } from "../../../utils";

Check failure on line 1 in src/components/Company/Edit/EditCompanyUtils.js

View workflow job for this annotation

GitHub Actions / build 

'generalHumanError' is defined but never used
import { CompanyApplicationConstants } from "../../Apply/Company/CompanyApplicationUtils";

export const EditCompanyConstants = {
name: { ...CompanyApplicationConstants.companyName },
};

export const generateValidationRule = validationRulesGenerator(EditCompanyConstants);
10 changes: 5 additions & 5 deletions src/components/Company/Registration/Finish/LogoUploadForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export const useLogoUpload = ({ watch }) => {
useEffect(() => {
if (!logoInput) {
setLogoPreview(undefined);
return () => {};
return () => { };
} else {

const objectUrl = URL.createObjectURL(logoInput);
Expand Down Expand Up @@ -180,10 +180,10 @@ const LogoUploadForm = () => {
>
<Grid item xs={12} sm={4}>
{logoPreview &&
<LogoPreview
img={logoPreview}
setCroppedAreaPixels={setCroppedAreaPixels}
/> }
<LogoPreview
img={logoPreview}
setCroppedAreaPixels={setCroppedAreaPixels}
/>}
</Grid>
</Grid>
<Typography
Expand Down
18 changes: 10 additions & 8 deletions src/components/Offers/Form/form-components/OfferForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,8 @@ const OfferForm = ({ context, title }) => {
showHiddenField,
} = useContext(context);

console.log("Fields are: ", fields);

Check warning on line 84 in src/components/Offers/Form/form-components/OfferForm.js

View workflow job for this annotation

GitHub Actions / build 

Unexpected console statement

const isMobile = useMobile();

const formDisabled = !isLoggedIn || companyUnfinishedRegistration;
Expand Down Expand Up @@ -149,14 +151,14 @@ const OfferForm = ({ context, title }) => {
/>
</Grid>
{showOwnerComponent &&
<Grid item xs={12} lg={6}>
<OwnerComponent
disabled={formDisabled}
errors={errors}
requestErrors={requestErrors}
control={control}
/>
</Grid>}
<Grid item xs={12} lg={6}>
<OwnerComponent
disabled={formDisabled}
errors={errors}
requestErrors={requestErrors}
control={control}
/>
</Grid>}
<Grid item xs={12} lg={6}>
<FormControl fullWidth margin="dense">
<LocationComponent
Expand Down
3 changes: 2 additions & 1 deletion src/components/utils/form/MultiOptionTextField.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,8 @@ const MultiOptionTextField = ({
onChange={onChange}
InputProps={{
endAdornment:
<RemoveLineButton i={i} items={values} onClick={() => onRemove(i)} /> }}
<RemoveLineButton i={i} items={values} onClick={() => onRemove(i)} />
}}
margin="normal"
helperText={errors?.[i]?.value?.message || ""}
{...textFieldProps}
Expand Down
4 changes: 3 additions & 1 deletion src/hooks/useOfferForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,9 @@ export default (schema) => {
clearErrors();
}
},
[clearErrors, isLoggedIn]);
[clearErrors, isLoggedIn]);

console.log("So much abstraction makes the code harder to read: ", fields);

Check warning on line 77 in src/hooks/useOfferForm.js

View workflow job for this annotation

GitHub Actions / build 

Unexpected console statement

return {
success,
Expand Down
Loading

0 comments on commit 0631e65

Please sign in to comment.