xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

Replace useless ternarys with logical ANDs

This commit is contained in:
Isaac Wise 2024-07-22 22:34:36 -05:00
parent 2264abd384
commit e79b98d3b0
No known key found for this signature in database
GPG Key ID: A02A33A7E2427136
25 changed files with 195 additions and 212 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/CollectionCard.tsx
View File

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

9
components/CollectionListing.tsx
View File

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

34
components/LinkViews/LinkComponents/LinkActions.tsx
View File

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

13
components/LinkViews/LinkList.tsx
View File

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

19
components/MobileNavigation.tsx
View File

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

4
components/ModalContent/EditLinkModal.tsx
View File

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

4
components/ModalContent/NewLinkModal.tsx
View File

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

4
components/ModalContent/NewUserModal.tsx
View File

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

31
components/ModalContent/PreservedFormatsModal.tsx
View File

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

8
components/ModalContent/UploadFileModal.tsx
View File

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

12
components/Navbar.tsx
View File

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

4
components/NoLinksFound.tsx
View File

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

9
components/PreserverdFormatRow.tsx
View File

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

21
components/ReadableView.tsx
View File

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

13
layouts/CenteredForm.tsx
View File

@ -23,22 +23,21 @@ export default function CenteredForm({
data-testid={dataTestId} data-testid={dataTestId}
> >
<div className="m-auto flex flex-col gap-2 w-full"> <div className="m-auto flex flex-col gap-2 w-full">
{settings.theme ? ( {settings.theme && (
<Image <Image
src={`/linkwarden_${ src={`/linkwarden_${settings.theme === "dark" ? "dark" : "light"
settings.theme === "dark" ? "dark" : "light" }.png`}
}.png`}
width={640} width={640}
height={136} height={136}
alt="Linkwarden" alt="Linkwarden"
className="h-12 w-fit mx-auto" className="h-12 w-fit mx-auto"
/> />
) : undefined} )}
{text ? ( {text && (
<p className="text-lg max-w-[30rem] min-w-80 w-full mx-auto font-semibold px-2 text-center"> <p className="text-lg max-w-[30rem] min-w-80 w-full mx-auto font-semibold px-2 text-center">
{text} {text}
</p> </p>
) : undefined} )}
{children} {children}
<p className="text-center text-xs text-neutral mb-5"> <p className="text-center text-xs text-neutral mb-5">
<Trans <Trans

4
layouts/MainLayout.tsx
View File

@ -34,9 +34,9 @@ export default function MainLayout({ children }: Props) {
return ( return (
<div className="flex" data-testid="dashboard-wrapper"> <div className="flex" data-testid="dashboard-wrapper">
{showAnnouncement ? ( {showAnnouncement && (
<Announcement toggleAnnouncementBar={toggleAnnouncementBar} /> <Announcement toggleAnnouncementBar={toggleAnnouncementBar} />
) : undefined} )}
<div className="hidden lg:block"> <div className="hidden lg:block">
<Sidebar className={`fixed top-0`} /> <Sidebar className={`fixed top-0`} />
</div> </div>

43
pages/collections/[id].tsx
View File

@ -115,9 +115,8 @@ export default function Index() {
<div <div
className="h-[60rem] p-5 flex gap-3 flex-col" className="h-[60rem] p-5 flex gap-3 flex-col"
style={{ style={{
backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${ backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${settings.theme === "dark" ? "#262626" : "#f3f4f6"
settings.theme === "dark" ? "#262626" : "#f3f4f6" } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
}} }}
> >
{activeCollection && ( {activeCollection && (
@ -211,12 +210,12 @@ export default function Index() {
className="flex items-center btn px-2 btn-ghost rounded-full w-fit" className="flex items-center btn px-2 btn-ghost rounded-full w-fit"
onClick={() => setEditCollectionSharingModal(true)} onClick={() => setEditCollectionSharingModal(true)}
> >
{collectionOwner.id ? ( {collectionOwner.id && (
<ProfilePhoto <ProfilePhoto
src={collectionOwner.image || undefined} src={collectionOwner.image || undefined}
name={collectionOwner.name} name={collectionOwner.name}
/> />
) : undefined} )}
{activeCollection.members {activeCollection.members
.sort((a, b) => (a.userId as number) - (b.userId as number)) .sort((a, b) => (a.userId as number) - (b.userId as number))
.map((e, i) => { .map((e, i) => {
@ -241,20 +240,20 @@ export default function Index() {
<p className="text-neutral text-sm"> <p className="text-neutral text-sm">
{activeCollection.members.length > 0 && {activeCollection.members.length > 0 &&
activeCollection.members.length === 1 activeCollection.members.length === 1
? t("by_author_and_other", { ? t("by_author_and_other", {
author: collectionOwner.name,
count: activeCollection.members.length,
})
: activeCollection.members.length > 0 &&
activeCollection.members.length !== 1
? t("by_author_and_others", {
author: collectionOwner.name, author: collectionOwner.name,
count: activeCollection.members.length, count: activeCollection.members.length,
}) })
: activeCollection.members.length > 0 &&
activeCollection.members.length !== 1
? t("by_author_and_others", {
author: collectionOwner.name,
count: activeCollection.members.length,
})
: t("by_author", { : t("by_author", {
author: collectionOwner.name, author: collectionOwner.name,
})} })}
</p> </p>
</div> </div>
</div> </div>
@ -299,15 +298,15 @@ export default function Index() {
setSortBy={setSortBy} setSortBy={setSortBy}
editMode={ editMode={
permissions === true || permissions === true ||
permissions?.canUpdate || permissions?.canUpdate ||
permissions?.canDelete permissions?.canDelete
? editMode ? editMode
: undefined : undefined
} }
setEditMode={ setEditMode={
permissions === true || permissions === true ||
permissions?.canUpdate || permissions?.canUpdate ||
permissions?.canDelete permissions?.canDelete
? setEditMode ? setEditMode
: undefined : undefined
} }
@ -315,11 +314,11 @@ export default function Index() {
<p> <p>
{activeCollection?._count?.links === 1 {activeCollection?._count?.links === 1
? t("showing_count_result", { ? t("showing_count_result", {
count: activeCollection?._count?.links, count: activeCollection?._count?.links,
}) })
: t("showing_count_results", { : t("showing_count_results", {
count: activeCollection?._count?.links, count: activeCollection?._count?.links,
})} })}
</p> </p>
</LinkListOptions> </LinkListOptions>

8
pages/collections/index.tsx
View File

@ -58,7 +58,7 @@ export default function Collections() {
</div> </div>
</div> </div>
{sortedCollections.filter((e) => e.ownerId !== data?.user.id)[0] ? ( {sortedCollections.filter((e) => e.ownerId !== data?.user.id)[0] && (
<> <>
<PageHeader <PageHeader
icon={"bi-folder"} icon={"bi-folder"}
@ -74,11 +74,11 @@ export default function Collections() {
})} })}
</div> </div>
</> </>
) : undefined} )}
</div> </div>
{newCollectionModal ? ( {newCollectionModal && (
<NewCollectionModal onClose={() => setNewCollectionModal(false)} /> <NewCollectionModal onClose={() => setNewCollectionModal(false)} />
) : undefined} )}
</MainLayout> </MainLayout>
); );
} }

4
pages/dashboard.tsx
View File

@ -324,9 +324,9 @@ export default function Dashboard() {
)} )}
</div> </div>
</div> </div>
{newLinkModal ? ( {newLinkModal && (
<NewLinkModal onClose={() => setNewLinkModal(false)} /> <NewLinkModal onClose={() => setNewLinkModal(false)} />
) : undefined} )}
</MainLayout> </MainLayout>
); );
} }

10
pages/login.tsx
View File

@ -203,9 +203,9 @@ export default function Login({
{t("login")} {t("login")}
</Button> </Button>
{availableLogins.buttonAuths.length > 0 ? ( {availableLogins.buttonAuths.length > 0 && (
<div className="divider my-1">{t("or_continue_with")}</div> <div className="divider my-1">{t("or_continue_with")}</div>
) : undefined} )}
</> </>
); );
} }
@ -224,9 +224,9 @@ export default function Login({
loading={submitLoader} loading={submitLoader}
> >
{value.name.toLowerCase() === "google" || {value.name.toLowerCase() === "google" ||
value.name.toLowerCase() === "apple" ? ( value.name.toLowerCase() === "apple" && (
<i className={"bi-" + value.name.toLowerCase()}></i> <i className={"bi-" + value.name.toLowerCase()}></i>
) : undefined} )}
{value.name} {value.name}
</Button> </Button>
</React.Fragment> </React.Fragment>

49
pages/public/collections/[id].tsx
View File

@ -104,16 +104,17 @@ export default function PublicCollections() {
// @ts-ignore // @ts-ignore
const LinkComponent = linkView[viewMode]; const LinkComponent = linkView[viewMode];
return collection ? ( if (!collection) return null;
return (
<div <div
className="h-96" className="h-96"
style={{ style={{
backgroundImage: `linear-gradient(${collection?.color}30 10%, ${ backgroundImage: `linear-gradient(${collection?.color}30 10%, ${settings.theme === "dark" ? "#262626" : "#f3f4f6"
settings.theme === "dark" ? "#262626" : "#f3f4f6" } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
}} }}
> >
{collection ? ( {collection && (
<Head> <Head>
<title>{collection.name} | Linkwarden</title> <title>{collection.name} | Linkwarden</title>
<meta <meta
@ -122,7 +123,7 @@ export default function PublicCollections() {
key="title" key="title"
/> />
</Head> </Head>
) : undefined} )}
<div className="lg:w-3/4 w-full mx-auto p-5 bg"> <div className="lg:w-3/4 w-full mx-auto p-5 bg">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<p className="text-4xl font-thin mb-2 capitalize mt-10"> <p className="text-4xl font-thin mb-2 capitalize mt-10">
@ -151,12 +152,12 @@ export default function PublicCollections() {
className="flex items-center btn px-2 btn-ghost rounded-full" className="flex items-center btn px-2 btn-ghost rounded-full"
onClick={() => setEditCollectionSharingModal(true)} onClick={() => setEditCollectionSharingModal(true)}
> >
{collectionOwner.id ? ( {collectionOwner.id && (
<ProfilePhoto <ProfilePhoto
src={collectionOwner.image || undefined} src={collectionOwner.image || undefined}
name={collectionOwner.name} name={collectionOwner.name}
/> />
) : undefined} )}
{collection.members {collection.members
.sort((a, b) => (a.userId as number) - (b.userId as number)) .sort((a, b) => (a.userId as number) - (b.userId as number))
.map((e, i) => { .map((e, i) => {
@ -181,20 +182,20 @@ export default function PublicCollections() {
<p className="text-neutral text-sm"> <p className="text-neutral text-sm">
{collection.members.length > 0 && {collection.members.length > 0 &&
collection.members.length === 1 collection.members.length === 1
? t("by_author_and_other", { ? t("by_author_and_other", {
author: collectionOwner.name,
count: collection.members.length,
})
: collection.members.length > 0 &&
collection.members.length !== 1
? t("by_author_and_others", {
author: collectionOwner.name, author: collectionOwner.name,
count: collection.members.length, count: collection.members.length,
}) })
: collection.members.length > 0 &&
collection.members.length !== 1
? t("by_author_and_others", {
author: collectionOwner.name,
count: collection.members.length,
})
: t("by_author", { : t("by_author", {
author: collectionOwner.name, author: collectionOwner.name,
})} })}
</p> </p>
</div> </div>
</div> </div>
@ -218,11 +219,11 @@ export default function PublicCollections() {
placeholder={ placeholder={
collection._count?.links === 1 collection._count?.links === 1
? t("search_count_link", { ? t("search_count_link", {
count: collection._count?.links, count: collection._count?.links,
}) })
: t("search_count_links", { : t("search_count_links", {
count: collection._count?.links, count: collection._count?.links,
}) })
} }
/> />
</LinkListOptions> </LinkListOptions>
@ -248,15 +249,13 @@ export default function PublicCollections() {
</p> */} </p> */}
</div> </div>
</div> </div>
{editCollectionSharingModal ? ( {editCollectionSharingModal && (
<EditCollectionSharingModal <EditCollectionSharingModal
onClose={() => setEditCollectionSharingModal(false)} onClose={() => setEditCollectionSharingModal(false)}
activeCollection={collection} activeCollection={collection}
/> />
) : undefined} )}
</div> </div>
) : (
<></>
); );
} }

26
pages/register.tsx
View File

@ -133,9 +133,9 @@ export default function Register({
loading={submitLoader} loading={submitLoader}
> >
{value.name.toLowerCase() === "google" || {value.name.toLowerCase() === "google" ||
value.name.toLowerCase() === "apple" ? ( value.name.toLowerCase() === "apple" && (
<i className={"bi-" + value.name.toLowerCase()}></i> <i className={"bi-" + value.name.toLowerCase()}></i>
) : undefined} )}
{value.name} {value.name}
</Button> </Button>
</React.Fragment> </React.Fragment>
@ -149,8 +149,8 @@ export default function Register({
text={ text={
process.env.NEXT_PUBLIC_STRIPE process.env.NEXT_PUBLIC_STRIPE
? t("trial_offer_desc", { ? t("trial_offer_desc", {
count: Number(process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14), count: Number(process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14),
}) })
: t("register_desc") : t("register_desc")
} }
data-testid="registration-form" data-testid="registration-form"
@ -201,7 +201,7 @@ export default function Register({
</div> </div>
)} )}
{emailEnabled ? ( {emailEnabled && (
<div> <div>
<p className="text-sm w-fit font-semibold mb-1">{t("email")}</p> <p className="text-sm w-fit font-semibold mb-1">{t("email")}</p>
@ -214,7 +214,7 @@ export default function Register({
onChange={(e) => setForm({ ...form, email: e.target.value })} onChange={(e) => setForm({ ...form, email: e.target.value })}
/> />
</div> </div>
) : undefined} )}
<div className="w-full"> <div className="w-full">
<p className="text-sm w-fit font-semibold mb-1"> <p className="text-sm w-fit font-semibold mb-1">
@ -248,7 +248,7 @@ export default function Register({
/> />
</div> </div>
{process.env.NEXT_PUBLIC_STRIPE ? ( {process.env.NEXT_PUBLIC_STRIPE && (
<div className="text-xs text-neutral mb-3"> <div className="text-xs text-neutral mb-3">
<p> <p>
<Trans <Trans
@ -270,7 +270,7 @@ export default function Register({
/> />
</p> </p>
</div> </div>
) : undefined} )}
<Button <Button
type="submit" type="submit"
@ -282,9 +282,9 @@ export default function Register({
{t("sign_up")} {t("sign_up")}
</Button> </Button>
{availableLogins.buttonAuths.length > 0 ? ( {availableLogins.buttonAuths.length > 0 && (
<div className="divider my-1">{t("or_continue_with")}</div> <div className="divider my-1">{t("or_continue_with")}</div>
) : undefined} )}
{displayLoginExternalButton()} {displayLoginExternalButton()}
<div> <div>
@ -298,7 +298,7 @@ export default function Register({
{t("login")} {t("login")}
</Link> </Link>
</div> </div>
{process.env.NEXT_PUBLIC_STRIPE ? ( {process.env.NEXT_PUBLIC_STRIPE && (
<div className="text-neutral text-center flex items-baseline gap-1 justify-center"> <div className="text-neutral text-center flex items-baseline gap-1 justify-center">
<p>{t("need_help")}</p> <p>{t("need_help")}</p>
<Link <Link
@ -309,7 +309,7 @@ export default function Register({
{t("get_in_touch")} {t("get_in_touch")}
</Link> </Link>
</div> </div>
) : undefined} )}
</div> </div>
</div> </div>
</form> </form>

8
pages/settings/access-tokens.tsx
View File

@ -48,7 +48,7 @@ export default function AccessTokens() {
{t("new_token")} {t("new_token")}
</button> </button>
{tokens.length > 0 ? ( {tokens.length > 0 && (
<table className="table mt-2 overflow-x-auto"> <table className="table mt-2 overflow-x-auto">
<thead> <thead>
<tr> <tr>
@ -93,12 +93,12 @@ export default function AccessTokens() {
))} ))}
</tbody> </tbody>
</table> </table>
) : undefined} )}
</div> </div>
{newTokenModal ? ( {newTokenModal && (
<NewTokenModal onClose={() => setNewTokenModal(false)} /> <NewTokenModal onClose={() => setNewTokenModal(false)} />
) : undefined} )}
{revokeTokenModal && selectedToken && ( {revokeTokenModal && selectedToken && (
<RevokeTokenModal <RevokeTokenModal
onClose={() => { onClose={() => {

38
pages/settings/account.tsx
View File

@ -29,19 +29,19 @@ export default function Account() {
!objectIsEmpty(account) !objectIsEmpty(account)
? account ? account
: ({ : ({
// @ts-ignore // @ts-ignore
id: null, id: null,
name: "", name: "",
username: "", username: "",
email: "", email: "",
emailVerified: null, emailVerified: null,
password: undefined, password: undefined,
image: "", image: "",
isPrivate: true, isPrivate: true,
// @ts-ignore // @ts-ignore
createdAt: null, createdAt: null,
whitelistedUsers: [], whitelistedUsers: [],
} as unknown as AccountSettings) } as unknown as AccountSettings)
); );
const { t } = useTranslation(); const { t } = useTranslation();
@ -176,7 +176,7 @@ export default function Account() {
onChange={(e) => setUser({ ...user, username: e.target.value })} onChange={(e) => setUser({ ...user, username: e.target.value })}
/> />
</div> </div>
{emailEnabled ? ( {emailEnabled && (
<div> <div>
<p className="mb-2">{t("email")}</p> <p className="mb-2">{t("email")}</p>
<TextInput <TextInput
@ -185,7 +185,7 @@ export default function Account() {
onChange={(e) => setUser({ ...user, email: e.target.value })} onChange={(e) => setUser({ ...user, email: e.target.value })}
/> />
</div> </div>
) : undefined} )}
<div> <div>
<p className="mb-2">{t("language")}</p> <p className="mb-2">{t("language")}</p>
<select <select
@ -418,9 +418,7 @@ export default function Account() {
<p> <p>
{t("delete_account_warning")} {t("delete_account_warning")}
{process.env.NEXT_PUBLIC_STRIPE {process.env.NEXT_PUBLIC_STRIPE && " " + t("cancel_subscription_notice")}
? " " + t("cancel_subscription_notice")
: undefined}
</p> </p>
</div> </div>
@ -429,14 +427,14 @@ export default function Account() {
</Link> </Link>
</div> </div>
{emailChangeVerificationModal ? ( {emailChangeVerificationModal && (
<EmailChangeVerificationModal <EmailChangeVerificationModal
onClose={() => setEmailChangeVerificationModal(false)} onClose={() => setEmailChangeVerificationModal(false)}
onSubmit={submit} onSubmit={submit}
oldEmail={account.email || ""} oldEmail={account.email || ""}
newEmail={user.email || ""} newEmail={user.email || ""}
/> />
) : undefined} )}
</SettingsLayout> </SettingsLayout>
); );
} }

4
pages/settings/delete.tsx
View File

@ -83,7 +83,7 @@ export default function Delete() {
/> />
</div> </div>
{process.env.NEXT_PUBLIC_STRIPE ? ( {process.env.NEXT_PUBLIC_STRIPE && (
<fieldset className="border rounded-md p-2 border-primary"> <fieldset className="border rounded-md p-2 border-primary">
<legend className="px-3 py-1 text-sm sm:text-base border rounded-md border-primary"> <legend className="px-3 py-1 text-sm sm:text-base border rounded-md border-primary">
<b>{t("optional")}</b> <i>{t("feedback_help")}</i> <b>{t("optional")}</b> <i>{t("feedback_help")}</i>
@ -123,7 +123,7 @@ export default function Delete() {
/> />
</div> </div>
</fieldset> </fieldset>
) : undefined} )}
<Button <Button
className="mx-auto" className="mx-auto"