From 3ed78c0e45875bc6b3969d43f87eb203f93d78a5 Mon Sep 17 00:00:00 2001
From: SD <syutkina.dasha@gmail.com>
Date: Tue, 10 Sep 2024 20:49:19 +0400
Subject: [PATCH] fix: fix main filter point, fix save profile pictures

---
 next.config.js                             |  3 +-
 src/components/Account/ProfileSettings.tsx | 50 +++++++++++++---------
 src/components/Experts/Filter.tsx          |  1 +
 src/styles/_form.scss                      |  3 +-
 src/types/profile.ts                       |  3 +-
 5 files changed, 35 insertions(+), 25 deletions(-)

diff --git a/next.config.js b/next.config.js
index ccf41ec..0cfa5f5 100644
--- a/next.config.js
+++ b/next.config.js
@@ -34,8 +34,7 @@ const nextConfig = {
 	},
 	// output: 'standalone',
 	poweredByHeader: false,
-	productionBrowserSourceMaps: true,
-	trailingSlash: true
+	productionBrowserSourceMaps: true
 };
 
 module.exports = withNextIntl(nextConfig);
diff --git a/src/components/Account/ProfileSettings.tsx b/src/components/Account/ProfileSettings.tsx
index 21da0a7..cfbb04b 100644
--- a/src/components/Account/ProfileSettings.tsx
+++ b/src/components/Account/ProfileSettings.tsx
@@ -15,6 +15,7 @@ import { OutlinedButton } from '../view/OutlinedButton';
 import {FilledButton, FilledSquareButton, FilledYellowButton} from '../view/FilledButton';
 import { DeleteAccountModal } from '../Modals/DeleteAccountModal';
 import { Loader } from '../view/Loader';
+import {ButtonProps} from "antd/es/button/button";
 
 type ProfileSettingsProps = {
     locale: string;
@@ -40,6 +41,20 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
         }
     }, [profileSettings]);
 
+    const onSave = (newProfile: ProfileRequest) => {
+        setSaveLoading(true);
+        save(newProfile)
+            .then(() => {
+                fetchProfileSettings();
+            })
+            .catch(() => {
+                message.error('Не удалось сохранить изменения');
+            })
+            .finally(() => {
+                setSaveLoading(false);
+            })
+    }
+
     const onSaveProfile = () => {
         form.validateFields()
             .then(({ login, surname, username }) => {
@@ -56,27 +71,18 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
                 };
 
                 if (photo) {
-                    console.log(photo);
-                    const formData = new FormData();
-                    formData.append('file', photo as FileType);
+                    const reader = new FileReader();
+                    reader.readAsDataURL(photo as File);
+                    reader.onloadend = () => {
+                        const newReg = new RegExp('data:image/(png|jpg|jpeg);base64,')
+                        newProfile.faceImage = reader.result.replace(newReg, '');
+                        newProfile.isFaceImageKeepExisting = false;
 
-                    newProfile.faceImage = `[${(photo as File).arrayBuffer()}]`;
-                    newProfile.isFaceImageKeepExisting = false;
+                        onSave(newProfile);
+                    }
+                } else {
+                    onSave(newProfile);
                 }
-
-                console.log(newProfile);
-
-                setSaveLoading(true);
-                save(newProfile)
-                    .then(() => {
-                        fetchProfileSettings();
-                    })
-                    .catch(() => {
-                        message.error('Не удалось сохранить изменения');
-                    })
-                    .finally(() => {
-                        setSaveLoading(false);
-                    })
             })
     }
 
@@ -103,6 +109,10 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
                     modalTitle="Редактировать"
                     modalOk="Сохранить"
                     modalCancel="Отмена"
+                    modalProps={{
+                        okButtonProps: { className: 'b-button__filled_yellow' },
+                        cancelButtonProps: { className: 'b-button__outlined' }
+                    }}
                     beforeCrop={beforeCrop}
                 >
                     <Upload
@@ -114,7 +124,7 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
                                 url: profileSettings.faceImageUrl
                             }
                         ] : undefined}
-                        accept=".jpg,.jpeg,.png,.gif"
+                        accept=".jpg,.jpeg,.png"
                         beforeUpload={beforeUpload}
                         multiple={false}
                         showUploadList={false}
diff --git a/src/components/Experts/Filter.tsx b/src/components/Experts/Filter.tsx
index debb1d1..846dd34 100644
--- a/src/components/Experts/Filter.tsx
+++ b/src/components/Experts/Filter.tsx
@@ -114,6 +114,7 @@ export const ExpertsFilter = ({
             ...getObjectByAdditionalFilter(searchParams)
         };
         const search = getSearchParamsString(newFilter);
+        console.log('basePath', basePath);
 
         router.push(search ? `${basePath}?${search}#filter` : `${basePath}#filter`);
 
diff --git a/src/styles/_form.scss b/src/styles/_form.scss
index db377ea..6e00e77 100644
--- a/src/styles/_form.scss
+++ b/src/styles/_form.scss
@@ -109,10 +109,11 @@ textarea {
 }
 
 .user-avatar {
-  display: flex;
+  display: grid;
   gap: 16px;
   align-items: center;
   margin-bottom: 4px;
+  grid-template-columns: 100px auto;
 
   &__edit {
     position: relative;
diff --git a/src/types/profile.ts b/src/types/profile.ts
index 3d30c4e..a429ca0 100644
--- a/src/types/profile.ts
+++ b/src/types/profile.ts
@@ -1,4 +1,3 @@
-import { UploadFile } from 'antd';
 import { EducationDTO } from './education';
 import { ExpertsTags } from './tags';
 import { PracticeDTO } from './practice';
@@ -28,7 +27,7 @@ export type ProfileRequest = {
     languagesLinks?: { languageId: number }[];
     username?: string;
     surname?: string;
-    faceImage?: UploadFile;
+    faceImage?: any;
     isFaceImageKeepExisting?: boolean;
     phone?: string;
 };