managed how LinkCards are viewed by members

components/Dropdown.tsx

@@ -12,7 +12,8 @@ type MenuItem =
       name: string;
       onClick?: MouseEventHandler;
       href: string;
-    };
+    }
+  | undefined;
 
 type Props = {
   onClickOutside: Function;
@@ -27,7 +28,7 @@ export default function Dropdown({ onClickOutside, className, items }: Props) {
       className={`${className} py-1 shadow-md border border-sky-100 bg-gray-50 rounded-md flex flex-col z-20`}
     >
       {items.map((e, i) => {
-        const inner = (
+        const inner = e && (
           <div className="cursor-pointer rounded-md">
             <div className="flex items-center gap-2 py-1 px-2 hover:bg-slate-200 duration-100">
               <p className="text-sky-900 select-none">{e.name}</p>
@@ -35,14 +36,16 @@ export default function Dropdown({ onClickOutside, className, items }: Props) {
           </div>
         );
 
-        return e.href ? (
+        return e && e.href ? (
           <Link key={i} href={e.href}>
             {inner}
           </Link>
         ) : (
-          <div key={i} onClick={e.onClick}>
-            {inner}
-          </div>
+          e && (
+            <div key={i} onClick={e.onClick}>
+              {inner}
+            </div>
+          )
         );
       })}
     </ClickAwayHandler>