feat: adding a toggle switch for left panel items

src/templates/blocks/Projects/ProjectsA.js

@@ -2,7 +2,7 @@ import React, { memo, useContext } from 'react';
 import { useTranslation } from 'react-i18next';
 import ReactMarkdown from 'react-markdown';
 import PageContext from '../../../contexts/PageContext';
-import { formatDateRange, safetyCheck } from '../../../utils';
+import { formatDateRange, isItemVisible, safetyCheck } from '../../../utils';
 
 const ProjectItem = ({ item, language }) => {
   const { t } = useTranslation();
@@ -49,9 +49,16 @@ const ProjectsA = () => {
     <div>
       <Heading>{data.projects.heading}</Heading>
       <div className="grid gap-4">
-        {data.projects.items.map((x) => (
-          <ProjectItem key={x.id} item={x} language={data.metadata.language} />
-        ))}
+        {data.projects.items.map(
+          (x) =>
+            isItemVisible(x) && (
+              <ProjectItem
+                key={x.id}
+                item={x}
+                language={data.metadata.language}
+              />
+            ),
+        )}
       </div>
     </div>
   ) : null;