diff --git a/src/components/Company/Edit/EditCompanyProfileForm.js b/src/components/Company/Edit/EditCompanyProfileForm.js
index ab705b24..3a30e325 100644
--- a/src/components/Company/Edit/EditCompanyProfileForm.js
+++ b/src/components/Company/Edit/EditCompanyProfileForm.js
@@ -24,25 +24,73 @@ import { Redirect, useLocation, useParams } from "react-router-dom/cjs/react-rou
import { yupResolver } from "@hookform/resolvers/yup";
import EditCompanySchema from "./EditCompanySchema";
import MultiOptionTextField from "../../utils/form/MultiOptionTextField";
-import LogoUploadForm from "../Registration/Finish/LogoUploadForm";
+import LogoUploadForm, { turnImgIntoFile } from "../Registration/Finish/LogoUploadForm";
import { useContacts } from "../Registration/Finish/ContactsForm";
-
-export const EditCompanyControllerContext = React.createContext();
-
-const EditImage = ({ style, image, imageAlt }) => {
- return ();
-};
+import { FinishCompanyRegistrationController, FinishCompanyRegistrationControllerContext } from "../Registration/Finish/FinishCompanyRegistrationWidget";
+import { useLogoUpload } from "../Registration/Finish/LogoUploadForm";
+import { CloudUpload, Edit } from "@material-ui/icons";
+import getCroppedImg from "../../utils/image/cropImage";
const useStyles = makeStyles((theme) => ({
submitBtn: {
marginTop: theme.spacing(2),
},
+ avatar: {
+ marginBottom: theme.spacing(1),
+ height: "5em",
+ width: "5em",
+ },
}));
+export const EditCompanyControllerContext = React.createContext();
+
+const EditImageText = () => <>
+
+
+ {"Upload your Company's logo."}
+
+
+>;
+
+const EditImage = ({ classname, image, imageAlt }) => {
+ const {
+ logoUploadOptions,
+ register,
+ errors,
+ } = useContext(EditCompanyControllerContext);
+
+ const [editingImage, setEditingImage] = useState(false);
+
+ return editingImage ?
+
+
+
+ :
+ (<>
+
+
+
+
+ >
+ );
+};
+
const getParsedCompanyContacts = (contacts) => {
const newContacts = [];
for (const contact of contacts) {
@@ -58,20 +106,25 @@ const parseCompany = ({
}) => ({
contacts: contacts.map((value) => ({ value })),
...company,
- logo: "https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Ftse1.mm.bing.net%2Fth%3Fid%3DOIP.1SzV5xZOzNbaUOENWpw9vwHaHa%26pid%3DApi&f=1&ipt=36ec7cc75953554a84897bc0aaa6402e9267a031b8618c412927094349aca538&ipo=images"
});
+const getCorrectEditedImage = (logoUploadOptions, logo) => {
+ if (!logoUploadOptions.logoPreview) {
+
+ }
+};
+
export const EditCompanyController = () => {
const { id } = useParams();
const { company, error: companyError, loading: loadingCompany } = useCompany(id);
const { data: user, isValidating } = useSession();
let canEditRaceControl = false;
- const { handleSubmit, control, reset, getValues } = useForm({
+ const { handleSubmit, control, reset, getValues, register, watch, formState: { errors } } = useForm({
mode: "all",
resolver: yupResolver(EditCompanySchema),
defaultValues: {
- logo: "",
+ logo: undefined,
name: "",
contacts: [],
bio: "",
@@ -109,15 +162,26 @@ export const EditCompanyController = () => {
},
};
- const submit = (data) => {
+ const submit = async (data) => {
const contacts = getParsedCompanyContacts(data.contacts);
- editCompany({ ...data, contacts: contacts }).then(() => {
+
+ const croppedImage = logoUploadOptions.logoPreview ? await
+ getCroppedImg(
+ logoUploadOptions.logoPreview,
+ logoUploadOptions.croppedAreaPixels,
+ 0
+ ) : undefined;
+
+ editCompany({ ...data, contacts: contacts, logo: croppedImage }).then(() => {
}).catch((err) => {
});
+
};
+ const logoUploadOptions = useLogoUpload({ control, watch });
+
return {
controllerOptions: {
initialValue: {
@@ -131,6 +195,9 @@ export const EditCompanyController = () => {
control,
fields,
getValues,
+ logoUploadOptions,
+ register,
+ errors,
submit: handleSubmit(submit),
},
},
@@ -152,6 +219,8 @@ const EditCompanyProfileForm = ({ title }) => {
control,
getValues,
submit,
+ register,
+ errors,
} = useContext(EditCompanyControllerContext);
const classes = useStyles();
@@ -175,16 +244,11 @@ const EditCompanyProfileForm = ({ title }) => {
>
-
-
-
+
{