Replace useless ternarys with logical ANDs

components/CollectionCard.tsx

@@ -129,12 +129,12 @@ export default function CollectionCard({ collection, className }: Props) {
         className="flex items-center absolute bottom-3 left-3 z-10 btn px-2 btn-ghost rounded-full"
         onClick={() => setEditCollectionSharingModal(true)}
       >
-        {collectionOwner.id ? (
+        {collectionOwner.id && (
           <ProfilePhoto
             src={collectionOwner.image || undefined}
             name={collectionOwner.name}
           />
-        ) : undefined}
+        )}
         {collection.members
           .sort((a, b) => (a.userId as number) - (b.userId as number))
           .map((e, i) => {
@@ -159,11 +159,9 @@ export default function CollectionCard({ collection, className }: Props) {
       <Link
         href={`/collections/${collection.id}`}
         style={{
-          backgroundImage: `linear-gradient(45deg, ${collection.color}30 10%, ${
-            settings.theme === "dark" ? "oklch(var(--b2))" : "oklch(var(--b2))"
-          } 50%, ${
-            settings.theme === "dark" ? "oklch(var(--b2))" : "oklch(var(--b2))"
-          } 100%)`,
+          backgroundImage: `linear-gradient(45deg, ${collection.color}30 10%, ${settings.theme === "dark" ? "oklch(var(--b2))" : "oklch(var(--b2))"
+            } 50%, ${settings.theme === "dark" ? "oklch(var(--b2))" : "oklch(var(--b2))"
+            } 100%)`,
         }}
         className="card card-compact shadow-md hover:shadow-none duration-200 border border-neutral-content"
       >
@@ -178,12 +176,12 @@ export default function CollectionCard({ collection, className }: Props) {
           <div className="flex justify-end items-center">
             <div className="text-right">
               <div className="font-bold text-sm flex justify-end gap-1 items-center">
-                {collection.isPublic ? (
+                {collection.isPublic && (
                   <i
                     className="bi-globe2 drop-shadow text-neutral"
                     title="This collection is being shared publicly."
                   ></i>
-                ) : undefined}
+                )}
                 <i
                   className="bi-link-45deg text-lg text-neutral"
                   title="This collection is being shared publicly."
@@ -203,24 +201,24 @@ export default function CollectionCard({ collection, className }: Props) {
           </div>
         </div>
       </Link>
-      {editCollectionModal ? (
+      {editCollectionModal && (
         <EditCollectionModal
           onClose={() => setEditCollectionModal(false)}
           activeCollection={collection}
         />
-      ) : undefined}
-      {editCollectionSharingModal ? (
+      )}
+      {editCollectionSharingModal && (
         <EditCollectionSharingModal
           onClose={() => setEditCollectionSharingModal(false)}
           activeCollection={collection}
         />
-      ) : undefined}
-      {deleteCollectionModal ? (
+      )}
+      {deleteCollectionModal && (
         <DeleteCollectionModal
           onClose={() => setDeleteCollectionModal(false)}
           activeCollection={collection}
         />
-      ) : undefined}
+      )}
     </div>
   );
 }

components/CollectionListing.tsx

@@ -231,11 +231,10 @@ const renderItem = (
   return (
     <div ref={provided.innerRef} {...provided.draggableProps} className="mb-1">
       <div
-        className={`${
-          currentPath === `/collections/${collection.id}`
+        className={`${currentPath === `/collections/${collection.id}`
             ? "bg-primary/20 is-active"
             : "hover:bg-neutral/20"
-        } duration-100 flex gap-1 items-center pr-2 pl-1 rounded-md`}
+          } duration-100 flex gap-1 items-center pr-2 pl-1 rounded-md`}
       >
         {Icon(item as ExtendedTreeItem, onExpand, onCollapse)}
 
@@ -253,12 +252,12 @@ const renderItem = (
             ></i>
             <p className="truncate w-full">{collection.name}</p>
 
-            {collection.isPublic ? (
+            {collection.isPublic && (
               <i
                 className="bi-globe2 text-sm text-black/50 dark:text-white/50 drop-shadow"
                 title="This collection is being shared publicly."
               ></i>
-            ) : undefined}
+            )}
             <div className="drop-shadow text-neutral text-xs">
               {collection._count?.links}
             </div>

components/LinkViews/LinkComponents/LinkActions.tsx

@@ -79,9 +79,8 @@ export default function LinkActions({
   return (
     <>
       <div
-        className={`dropdown dropdown-left absolute ${
-          position || "top-3 right-3"
-        } ${alignToTop ? "" : "dropdown-end"} z-20`}
+        className={`dropdown dropdown-left absolute ${position || "top-3 right-3"
+          } ${alignToTop ? "" : "dropdown-end"} z-20`}
       >
         <div
           tabIndex={0}
@@ -92,9 +91,8 @@ export default function LinkActions({
           <i title="More" className="bi-three-dots text-xl" />
         </div>
         <ul
-          className={`dropdown-content z-[20] menu shadow bg-base-200 border border-neutral-content rounded-box w-44 mr-1 ${
-            alignToTop ? "" : "translate-y-10"
-          }`}
+          className={`dropdown-content z-[20] menu shadow bg-base-200 border border-neutral-content rounded-box w-44 mr-1 ${alignToTop ? "" : "translate-y-10"
+            }`}
         >
           <li>
             <div
@@ -110,7 +108,7 @@ export default function LinkActions({
                 : t("pin_to_dashboard")}
             </div>
           </li>
-          {linkInfo !== undefined && toggleShowInfo ? (
+          {linkInfo !== undefined && toggleShowInfo && (
             <li>
               <div
                 role="button"
@@ -123,8 +121,8 @@ export default function LinkActions({
                 {!linkInfo ? t("show_link_details") : t("hide_link_details")}
               </div>
             </li>
-          ) : undefined}
-          {permissions === true || permissions?.canUpdate ? (
+          )}
+          {permissions === true || permissions?.canUpdate && (
             <li>
               <div
                 role="button"
@@ -137,7 +135,7 @@ export default function LinkActions({
                 {t("edit_link")}
               </div>
             </li>
-          ) : undefined}
+          )}
           {link.type === "url" && (
             <li>
               <div
@@ -152,7 +150,7 @@ export default function LinkActions({
               </div>
             </li>
           )}
-          {permissions === true || permissions?.canDelete ? (
+          {permissions === true || permissions?.canDelete && (
             <li>
               <div
                 role="button"
@@ -165,28 +163,28 @@ export default function LinkActions({
                 {t("delete")}
               </div>
             </li>
-          ) : undefined}
+          )}
         </ul>
       </div>
 
-      {editLinkModal ? (
+      {editLinkModal && (
         <EditLinkModal
           onClose={() => setEditLinkModal(false)}
           activeLink={link}
         />
-      ) : undefined}
-      {deleteLinkModal ? (
+      )}
+      {deleteLinkModal && (
         <DeleteLinkModal
           onClose={() => setDeleteLinkModal(false)}
           activeLink={link}
         />
-      ) : undefined}
-      {preservedFormatsModal ? (
+      )}
+      {preservedFormatsModal && (
         <PreservedFormatsModal
           onClose={() => setPreservedFormatsModal(false)}
           activeLink={link}
         />
-      ) : undefined}
+      )}
       {/* {expandedLink ? (
                 <ExpandedLink onClose={() => setExpandedLink(false)} link={link} />
               ) : undefined} */}

components/LinkViews/LinkList.tsx

@@ -91,9 +91,8 @@ export default function LinkCardCompact({
   return (
     <>
       <div
-        className={`${selectedStyle} border relative items-center flex ${
-          !showInfo && !isPWA() ? "hover:bg-base-300 p-3" : "py-3"
-        } duration-200 rounded-lg w-full`}
+        className={`${selectedStyle} border relative items-center flex ${!showInfo && !isPWA() ? "hover:bg-base-300 p-3" : "py-3"
+          } duration-200 rounded-lg w-full`}
         onClick={() =>
           selectable
             ? handleCheckboxClick(link)
@@ -139,9 +138,9 @@ export default function LinkCardCompact({
 
             <div className="mt-1 flex flex-col sm:flex-row sm:items-center gap-2 text-xs text-neutral">
               <div className="flex items-center gap-x-3 text-neutral flex-wrap">
-                {collection ? (
+                {collection && (
                   <LinkCollection link={link} collection={collection} />
-                ) : undefined}
+                )}
                 {link.name && <LinkTypeBadge link={link} />}
                 <LinkDate link={link} />
               </div>
@@ -153,8 +152,8 @@ export default function LinkCardCompact({
           collection={collection}
           position="top-3 right-3"
           flipDropdown={flipDropdown}
-          // toggleShowInfo={() => setShowInfo(!showInfo)}
-          // linkInfo={showInfo}
+        // toggleShowInfo={() => setShowInfo(!showInfo)}
+        // linkInfo={showInfo}
         />
       </div>
       <div

components/MobileNavigation.tsx

@@ -9,7 +9,7 @@ import { useTranslation } from "next-i18next";
 
 type Props = {};
 
-export default function MobileNavigation({}: Props) {
+export default function MobileNavigation({ }: Props) {
   const { t } = useTranslation();
   const [newLinkModal, setNewLinkModal] = useState(false);
   const [newCollectionModal, setNewCollectionModal] = useState(false);
@@ -21,9 +21,8 @@ export default function MobileNavigation({}: Props) {
         className={`fixed bottom-0 left-0 right-0 z-30 duration-200 sm:hidden`}
       >
         <div
-          className={`w-full flex bg-base-100 ${
-            isIphone() && isPWA() ? "pb-5" : ""
-          } border-solid border-t-neutral-content border-t`}
+          className={`w-full flex bg-base-100 ${isIphone() && isPWA() ? "pb-5" : ""
+            } border-solid border-t-neutral-content border-t`}
         >
           <MobileNavigationButton href={`/dashboard`} icon={"bi-house"} />
           <MobileNavigationButton
@@ -84,15 +83,15 @@ export default function MobileNavigation({}: Props) {
           <MobileNavigationButton href={`/collections`} icon={"bi-folder"} />
         </div>
       </div>
-      {newLinkModal ? (
+      {newLinkModal && (
         <NewLinkModal onClose={() => setNewLinkModal(false)} />
-      ) : undefined}
-      {newCollectionModal ? (
+      )}
+      {newCollectionModal && (
         <NewCollectionModal onClose={() => setNewCollectionModal(false)} />
-      ) : undefined}
-      {uploadFileModal ? (
+      )}
+      {uploadFileModal && (
         <UploadFileModal onClose={() => setUploadFileModal(false)} />
-      ) : undefined}
+      )}
     </>
   );
 }

components/ModalContent/EditLinkModal.tsx

@@ -72,7 +72,7 @@ export default function EditLinkModal({ onClose, activeLink }: Props) {
 
       <div className="divider mb-3 mt-1"></div>
 
-      {link.url ? (
+      {link.url && (
         <Link
           href={link.url}
           className="truncate text-neutral flex gap-2 mb-5 w-fit max-w-full"
@@ -82,7 +82,7 @@ export default function EditLinkModal({ onClose, activeLink }: Props) {
           <i className="bi-link-45deg text-xl" />
           <p>{shortenedURL}</p>
         </Link>
-      ) : undefined}
+      )}
 
       <div className="w-full">
         <p className="mb-2">{t("name")}</p>

components/ModalContent/NewLinkModal.tsx

@@ -128,7 +128,7 @@ export default function NewLinkModal({ onClose }: Props) {
         </div>
       </div>
       <div className={"mt-2"}>
-        {optionsExpanded ? (
+        {optionsExpanded && (
           <div className="mt-5">
             <div className="grid sm:grid-cols-2 gap-3">
               <div>
@@ -163,7 +163,7 @@ export default function NewLinkModal({ onClose }: Props) {
               </div>
             </div>
           </div>
-        ) : undefined}
+        )}
       </div>
       <div className="flex justify-between items-center mt-5">
         <div

components/ModalContent/NewUserModal.tsx

@@ -86,7 +86,7 @@ export default function NewUserModal({ onClose }: Props) {
             />
           </div>
 
-          {emailEnabled ? (
+          {emailEnabled && (
             <div>
               <p className="mb-2">{t("email")}</p>
               <TextInput
@@ -96,7 +96,7 @@ export default function NewUserModal({ onClose }: Props) {
                 value={form.email}
               />
             </div>
-          ) : undefined}
+          )}
 
           <div>
             <p className="mb-2">

components/ModalContent/PreservedFormatsModal.tsx

@@ -150,16 +150,16 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
       <p className="text-xl font-thin">{t("preserved_formats")}</p>
       <div className="divider mb-2 mt-1"></div>
       {screenshotAvailable(link) ||
-      pdfAvailable(link) ||
-      readabilityAvailable(link) ||
-      monolithAvailable(link) ? (
+        pdfAvailable(link) ||
+        readabilityAvailable(link) ||
+        monolithAvailable(link) ? (
         <p className="mb-3">{t("available_formats")}</p>
       ) : (
         ""
       )}
 
       <div className={`flex flex-col gap-3`}>
-        {monolithAvailable(link) ? (
+        {monolithAvailable(link) && (
           <PreservedFormatRow
             name={t("webpage")}
             icon={"bi-filetype-html"}
@@ -167,9 +167,9 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
             activeLink={link}
             downloadable={true}
           />
-        ) : undefined}
+        )}
 
-        {screenshotAvailable(link) ? (
+        {screenshotAvailable(link) && (
           <PreservedFormatRow
             name={t("screenshot")}
             icon={"bi-file-earmark-image"}
@@ -181,9 +181,9 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
             activeLink={link}
             downloadable={true}
           />
-        ) : undefined}
+        )}
 
-        {pdfAvailable(link) ? (
+        {pdfAvailable(link) && (
           <PreservedFormatRow
             name={t("pdf")}
             icon={"bi-file-earmark-pdf"}
@@ -191,16 +191,16 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
             activeLink={link}
             downloadable={true}
           />
-        ) : undefined}
+        )}
 
-        {readabilityAvailable(link) ? (
+        {readabilityAvailable(link) && (
           <PreservedFormatRow
             name={t("readable")}
             icon={"bi-file-earmark-text"}
             format={ArchivedFormat.readability}
             activeLink={link}
           />
-        ) : undefined}
+        )}
 
         {!isReady() && !atLeastOneFormatAvailable() ? (
           <div className={`w-full h-full flex flex-col justify-center p-10`}>
@@ -213,7 +213,7 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
             <p className="text-center text-2xl">{t("preservation_in_queue")}</p>
             <p className="text-center text-lg">{t("check_back_later")}</p>
           </div>
-        ) : !isReady() && atLeastOneFormatAvailable() ? (
+        ) : !isReady() && atLeastOneFormatAvailable() && (
           <div className={`w-full h-full flex flex-col justify-center p-5`}>
             <BeatLoader
               color="oklch(var(--p))"
@@ -223,12 +223,11 @@ export default function PreservedFormatsModal({ onClose, activeLink }: Props) {
             <p className="text-center">{t("there_are_more_formats")}</p>
             <p className="text-center text-sm">{t("check_back_later")}</p>
           </div>
-        ) : undefined}
+        )}
 
         <div
-          className={`flex flex-col sm:flex-row gap-3 items-center justify-center ${
-            isReady() ? "sm:mt " : ""
-          }`}
+          className={`flex flex-col sm:flex-row gap-3 items-center justify-center ${isReady() ? "sm:mt " : ""
+            }`}
         >
           <Link
             href={`https://web.archive.org/web/${link?.url?.replace(

components/ModalContent/UploadFileModal.tsx

@@ -157,7 +157,7 @@ export default function UploadFileModal({ onClose }: Props) {
         </div>
         <div className="sm:col-span-2 col-span-5">
           <p className="mb-2">{t("collection")}</p>
-          {link.collection.name ? (
+          {link.collection.name && (
             <CollectionSelection
               onChange={setCollection}
               defaultValue={{
@@ -165,10 +165,10 @@ export default function UploadFileModal({ onClose }: Props) {
                 value: link.collection.id,
               }}
             />
-          ) : null}
+          )}
         </div>
       </div>
-      {optionsExpanded ? (
+      {optionsExpanded && (
         <div className="mt-5">
           <div className="grid sm:grid-cols-2 gap-3">
             <div>
@@ -203,7 +203,7 @@ export default function UploadFileModal({ onClose }: Props) {
             </div>
           </div>
         </div>
-      ) : undefined}
+      )}
       <div className="flex justify-between items-center mt-5">
         <div
           onClick={() => setOptionsExpanded(!optionsExpanded)}

components/Navbar.tsx

@@ -120,15 +120,15 @@ export default function Navbar() {
           </ClickAwayHandler>
         </div>
       ) : null}
-      {newLinkModal ? (
+      {newLinkModal && (
         <NewLinkModal onClose={() => setNewLinkModal(false)} />
-      ) : undefined}
-      {newCollectionModal ? (
+      )}
+      {newCollectionModal && (
         <NewCollectionModal onClose={() => setNewCollectionModal(false)} />
-      ) : undefined}
-      {uploadFileModal ? (
+      )}
+      {uploadFileModal && (
         <UploadFileModal onClose={() => setUploadFileModal(false)} />
-      ) : undefined}
+      )}
     </div>
   );
 }

components/NoLinksFound.tsx

@@ -39,9 +39,9 @@ export default function NoLinksFound({ text }: Props) {
           </span>
         </div>
       </div>
-      {newLinkModal ? (
+      {newLinkModal && (
         <NewLinkModal onClose={() => setNewLinkModal(false)} />
-      ) : undefined}
+      )}
     </div>
   );
 }

components/PreserverdFormatRow.tsx

@@ -97,19 +97,18 @@ export default function PreservedFormatRow({
       </div>
 
       <div className="flex gap-1">
-        {downloadable || false ? (
+        {downloadable || false && (
           <div
             onClick={() => handleDownload()}
             className="btn btn-sm btn-square"
           >
             <i className="bi-cloud-arrow-down text-xl text-neutral" />
           </div>
-        ) : undefined}
+        )}
 
         <Link
-          href={`${
-            isPublic ? "/public" : ""
-          }/preserved/${link?.id}?format=${format}`}
+          href={`${isPublic ? "/public" : ""
+            }/preserved/${link?.id}?format=${format}`}
           target="_blank"
           className="btn btn-sm btn-square"
         >

components/ReadableView.tsx

@@ -183,7 +183,7 @@ export default function ReadableView({ link }: Props) {
                   link?.name || link?.description || link?.url || ""
                 )}
               </p>
-              {link?.url ? (
+              {link?.url && (
                 <Link
                   href={link?.url || ""}
                   title={link?.url}
@@ -192,11 +192,9 @@ export default function ReadableView({ link }: Props) {
                 >
                   <i className="bi-link-45deg"></i>
 
-                  {isValidUrl(link?.url || "")
-                    ? new URL(link?.url as string).host
-                    : undefined}
+                  {isValidUrl(link?.url || "") && new URL(link?.url as string).host}
                 </Link>
-              ) : undefined}
+              )}
             </div>
           </div>
 
@@ -231,10 +229,10 @@ export default function ReadableView({ link }: Props) {
           <p className="min-w-fit text-sm text-neutral">
             {date
               ? new Date(date).toLocaleString("en-US", {
-                  year: "numeric",
-                  month: "long",
-                  day: "numeric",
-                })
+                year: "numeric",
+                month: "long",
+                day: "numeric",
+              })
               : undefined}
           </p>
 
@@ -259,9 +257,8 @@ export default function ReadableView({ link }: Props) {
           ></div>
         ) : (
           <div
-            className={`w-full h-full flex flex-col justify-center p-10 ${
-              link?.readable === "pending" || !link?.readable ? "skeleton" : ""
-            }`}
+            className={`w-full h-full flex flex-col justify-center p-10 ${link?.readable === "pending" || !link?.readable ? "skeleton" : ""
+              }`}
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"