chore: remove unused states

src/assets/js/components/popup/proposal.jsx

@@ -16,7 +16,6 @@ import {
   State,
 } from '@/main';
 import {
-  setAssetDashboardLink,
   setShowProposal,
   setShowSuccess,
 } from '@/features/popup/popupSlice';
@@ -233,7 +232,12 @@ export const Proposal = (props) => {
         setButtonState(state ? 'update' : 'add');
 
         dispatch(setShowSuccess(true));
-        dispatch(setAssetDashboardLink(getAssetDashboardLink(result[0].id)));
+
+        const event = new CustomEvent('set-asset-dashboard-link', {
+          detail: getAssetDashboardLink(result[0].id)
+        });
+        document.dispatchEvent(event);
+
         dispatch(setShowProposal(false));
       })
       .catch((error) => {

src/assets/js/components/popup/success.jsx

@@ -1,9 +1,7 @@
 import React from 'react';
 import { useSelector } from 'react-redux';
 
-export const Success = () => {
-  const assetDashboardLink = useSelector((state) => state.popup.assetDashboardLink);
-
+export const Success = ({ assetDashboardLink }) => {
   const openAssetDashboard = () => {
     window.open(assetDashboardLink);
   };

src/assets/js/features/popup/popupSlice.js

@@ -3,16 +3,12 @@ import { createSlice } from '@reduxjs/toolkit';
 const popupSlice = createSlice({
   name: 'popup',
   initialState: {
-    loading: false,
     showSignIn: true,
     showProposal: false,
     showSuccess: false,
     assetDashboardLink: '',
   },
   reducers: {
-    setLoading: (state, action) => {
-      state.loading = action.payload;
-    },
     setShowSignIn: (state, action) => {
       state.showSignIn = action.payload;
     },
@@ -22,14 +18,10 @@ const popupSlice = createSlice({
     setShowSuccess: (state, action) => {
       state.showSuccess = action.payload;
     },
-    setAssetDashboardLink: (state, action) => {
-      state.assetDashboardLink = action.payload;
-    },
   },
 });
 
 export const {
-  setLoading,
   setShowSignIn,
   setShowProposal,
   setShowSuccess,

src/assets/js/popup.jsx

@@ -2,7 +2,10 @@
 
 import ReactDOM from 'react-dom/client';
 import React from 'react';
-import { useEffect } from 'react';
+import {
+  useEffect,
+  useState,
+} from 'react';
 import {
   Provider,
   useDispatch,
@@ -31,20 +34,26 @@ const PopupPage = () => {
   const showProposal = useSelector((state) => state.popup.showProposal);
   const showSuccess = useSelector((state) => state.popup.showSuccess);
 
+  const [assetDashboardLink, setAssetDashboardLink] = useState('');
+
   useEffect(() => {
     browser.storage.sync.get('token').then((result) => {
       if (result.token) {
         dispatch(setShowSignIn(false));
         dispatch(setShowProposal(true));
       }
     });
+
+    document.addEventListener('set-asset-dashboard-link', (event) => {
+      setAssetDashboardLink(event.detail);
+    });
   }, []);
 
   return (
     <>
       {showSignIn && <SignInCallToAction />}
       {showProposal && <Proposal />}
-      {showSuccess && <Success />}
+      {showSuccess && <Success assetDashboardLink={assetDashboardLink} />}
     </>
   );
 }