feat: mutate profile page if successful change

app/components/Profile/Profile.EditModal.tsx

@@ -28,6 +28,7 @@ export const ProfileEditModal = (props: {
   isOpen: boolean;
   setIsOpen: (isOpen: boolean) => void;
   token: string;
+  profile_id: number;
 }) => {
   const [privacyModalOpen, setPrivacyModalOpen] = useState(false);
   const [statusModalOpen, setStatusModalOpen] = useState(false);
@@ -112,7 +113,7 @@ export const ProfileEditModal = (props: {
                     <p className="text-xl font-bold">Профиль</p>
                   </div>
                   <p className="mx-1 text-base text-gray-500">
-                    Изменения будут видны после перезагрузки страницы
+                    Некоторые изменения будут видны после перезагрузки страницы
                   </p>
                 </div>
                 <button
@@ -297,11 +298,13 @@ export const ProfileEditModal = (props: {
         token={props.token}
         status={status}
         setStatus={setStatus}
+        profile_id={props.profile_id}
       />
       <ProfileEditSocialModal
         isOpen={socialModalOpen}
         setIsOpen={setSocialModalOpen}
         token={props.token}
+        profile_id={props.profile_id}
       />
     </>
   );

app/components/Profile/Profile.EditSocialModal.tsx

@@ -4,11 +4,13 @@ import { Button, Modal, Label, TextInput } from "flowbite-react";
 import { Spinner } from "../Spinner/Spinner";
 import { ENDPOINTS } from "#/api/config";
 import { useEffect, useState } from "react";
+import { useSWRConfig } from "swr";
 
 export const ProfileEditSocialModal = (props: {
   isOpen: boolean;
   setIsOpen: (isOpen: boolean) => void;
   token: string;
+  profile_id: number;
 }) => {
   const [loading, setLoading] = useState(false);
   const [updating, setUpdating] = useState(false);
@@ -19,6 +21,7 @@ export const ProfileEditSocialModal = (props: {
     instPage: "",
     ttPage: "",
   });
+  const { mutate } = useSWRConfig();
 
   function _addUrl(username: string, social: string) {
     if (!username) {
@@ -95,6 +98,9 @@ export const ProfileEditSocialModal = (props: {
     })
       .then((res) => {
         if (res.ok) {
+          mutate(
+            `${ENDPOINTS.user.profile}/${props.profile_id}?token=${props.token}`
+          );
           setUpdating(false);
           props.setIsOpen(false);
         } else {

app/components/Profile/Profile.EditStatusModal.tsx

@@ -3,6 +3,7 @@
 import { Button, Modal, Textarea } from "flowbite-react";
 import { ENDPOINTS } from "#/api/config";
 import { useEffect, useState } from "react";
+import { useSWRConfig } from "swr";
 
 export const ProfileEditStatusModal = (props: {
   isOpen: boolean;
@@ -10,10 +11,12 @@ export const ProfileEditStatusModal = (props: {
   token: string;
   status: string;
   setStatus: (status: string) => void;
+  profile_id: number;
 }) => {
   const [loading, setLoading] = useState(false);
   const [_status, _setStatus] = useState("");
   const [_stringLength, _setStringLength] = useState(0);
+  const { mutate } = useSWRConfig();
 
   useEffect(() => {
     _setStatus(props.status);
@@ -38,6 +41,9 @@ export const ProfileEditStatusModal = (props: {
     })
       .then((res) => {
         if (res.ok) {
+          mutate(
+            `${ENDPOINTS.user.profile}/${props.profile_id}?token=${props.token}`
+          );
           setLoading(false);
           props.setStatus(_status);
           props.setIsOpen(false);

app/pages/Profile.tsx

@@ -207,7 +207,7 @@ export const ProfilePage = (props: any) => {
           )}
         </div>
       </div>
-      <ProfileEditModal isOpen={isOpen && isMyProfile} setIsOpen={setIsOpen} token={authUser.token} />
+      <ProfileEditModal isOpen={isOpen && isMyProfile} setIsOpen={setIsOpen} token={authUser.token} profile_id={user.id}/>
     </>
   );
 };