Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
primogenial
/
languages
/
wp-content
/
plugins
/
astra-sites
/
inc
/
lib
/
onboarding
/
assets
/
src
/
steps
/
site-list
/
favorite-sites
:
index.js
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
/** External Dependencies */ import React, { useState, useEffect } from 'react'; /** Internal Dependencies */ import { useStateValue } from '../../../store/store'; import SiteGrid from '../sites-grid'; import NoFavoriteSites from '../no-favorite-sites'; import RelatedSites from '../related-sites'; import { useFilteredSites } from '../index'; import { getGridItem } from '../../../utils/functions'; const FavoriteSites = () => { const [ siteData, setSiteData ] = useState( { skeleton: true, allFavorites: [], } ); const [ { favoriteSiteIDs, onMyFavorite } ] = useStateValue(); const allFilteredSites = useFilteredSites(); useEffect( () => { setSiteData( { ...siteData, skeleton: true, } ); const allFavorites = []; if ( onMyFavorite && Object.keys( allFilteredSites ).length > 0 ) { for ( const siteId in allFilteredSites ) { if ( favoriteSiteIDs.length && favoriteSiteIDs.includes( siteId ) ) { const gridItem = getGridItem( allFilteredSites[ siteId ] ); allFavorites.push( gridItem ); } } } setSiteData( { ...siteData, allFavorites, skeleton: false, } ); }, [ favoriteSiteIDs, onMyFavorite ] ); return ( <> { siteData.skeleton ? ( <div className="st-sites-grid st-sites-favorites-grid"> <SiteGrid skeleton={ siteData.skeleton } /> </div> ) : ( <> { siteData.allFavorites.length ? ( <div className="st-sites-grid"> <SiteGrid sites={ siteData.allFavorites } /> </div> ) : ( <> <NoFavoriteSites /> <RelatedSites sites={ allFilteredSites } /> </> ) } </> ) } </> ); }; export default FavoriteSites;