fix(StorePage/index.tsx): fix key prop in MarketCardComponent to use unique identifier from item instead of index to avoid rendering issues

feat(StorePage/index.tsx): add conditional check to getSavedComponents() if hasApiKey is true to only fetch saved components when API key is available

src/frontend/src/pages/StorePage/index.tsx

@@ -49,6 +49,9 @@ export default function StorePage(): JSX.Element {
 
   useEffect(() => {
     handleGetComponents();
+    if (hasApiKey) {
+      getSavedComponents();
+    }
   }, [
     searchText,
     tabActive,
@@ -266,11 +269,11 @@ export default function StorePage(): JSX.Element {
 
             <div className="grid w-full gap-4 md:grid-cols-2 lg:grid-cols-3">
               {!loading || searchData.length !== 0 ? (
-                searchData.map((item, idx) => {
+                searchData.map((item) => {
                   return (
                     <>
                       <MarketCardComponent
-                        key={idx}
+                        key={item.id}
                         data={item}
                         authorized={!loadingSaved}
                         disabled={loading}