From e3d82b27e15bffa49983c661a369667d0034b14b Mon Sep 17 00:00:00 2001
From: Lovel George <36924734+lovelgeorge99@users.noreply.github.com>
Date: Thu, 2 Jan 2025 12:25:40 -0500
Subject: [PATCH] update state of data after remove

---
 .../views/verification/SocialProfile.tsx      | 32 ++++++++++++-------
 1 file changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/components/views/verification/SocialProfile.tsx b/src/components/views/verification/SocialProfile.tsx
index 34dab51b02..1204cb0cba 100644
--- a/src/components/views/verification/SocialProfile.tsx
+++ b/src/components/views/verification/SocialProfile.tsx
@@ -13,7 +13,7 @@ import {
 import styled from 'styled-components';
 
 import { useRouter } from 'next/router';
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { Shadow } from '@/components/styled-components/Shadow';
 import DiscordIcon from '/public/images/icons/social/discord.svg';
 import LinkedinIcon from '/public/images/icons/social/linkedin.svg';
@@ -48,21 +48,16 @@ const SocialProfile = () => {
 		[verificationData],
 	);
 
-	const discordData = useMemo(
-		() => findSocialMedia('discord'),
-		[findSocialMedia],
+	const [twitterData, setTwitterData] = useState(
+		useMemo(() => findSocialMedia('twitter'), [findSocialMedia]),
 	);
 
-	const twitterData = useMemo(
-		() => findSocialMedia('twitter'),
-		[findSocialMedia],
+	const [linkedinData, setLinkedinData] = useState(
+		useMemo(() => findSocialMedia('linkedin'), [findSocialMedia]),
 	);
-
-	const linkedinData = useMemo(
-		() => findSocialMedia('linkedin'),
-		[findSocialMedia],
+	const [discordData, setDiscordData] = useState(
+		useMemo(() => findSocialMedia('discord'), [findSocialMedia]),
 	);
-
 	async function handleSocialSubmit(
 		socialNetwork: string,
 		notAuthorized: boolean,
@@ -110,6 +105,19 @@ const SocialProfile = () => {
 				},
 			});
 
+			const stateHandlers: any = {
+				twitter: setTwitterData,
+				linkedin: setLinkedinData,
+				discord: setDiscordData,
+			};
+
+			// Loop through the states to find and update the matching one
+			Object.keys(stateHandlers).forEach(key => {
+				if (id === Number(findSocialMedia(key)?.id)) {
+					stateHandlers[key](null);
+				}
+			});
+
 			if (slug) {
 				const { data } = await client.query({
 					query: FETCH_PROJECT_VERIFICATION,