egutierrez/linkwarden
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fixed

Browse Source
This commit is contained in:
daniel31x13
2024-11-06 03:36:02 -05:00
parent b2c5c3c6dd
commit a6a0f6965b
5 changed files with 84 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/preserved/[id].tsx
+37 -37
View File
@@ -1,70 +1,70 @@
import React, { useEffect, useState } from "react";
import React, { useEffect } from "react";
import { useRouter } from "next/router";
import {
ArchivedFormat,
LinkIncludingShortenedCollectionAndTags,
} from "@/types/global";
import { ArchivedFormat } from "@/types/global";
import ReadableView from "@/components/ReadableView";
import getServerSideProps from "@/lib/client/getServerSideProps";
import { useGetLink, useLinks } from "@/hooks/store/links";
import { useGetLink } from "@/hooks/store/links";
import clsx from "clsx";
export default function Index() {
const { links } = useLinks();
const getLink = useGetLink();
const [link, setLink] = useState<LinkIncludingShortenedCollectionAndTags>();
const router = useRouter();
useEffect(() => {
const fetchLink = async () => {
if (router.query.id) {
await getLink.mutateAsync({ id: Number(router.query.id) });
}
};
fetchLink();
if (router.query.id) {
getLink.mutateAsync({ id: Number(router.query.id) });
}
}, []);
useEffect(() => {
if (links && links[0])
setLink(links.find((e) => e.id === Number(router.query.id)));
}, [links]);
return (
<div className="relative">
<div className={clsx(getLink.isPending ? "flex h-screen" : "relative")}>
{/* <div className="fixed left-1/2 transform -translate-x-1/2 w-fit py-1 px-3 bg-base-200 border border-neutral-content rounded-md">
Readable
</div> */}
{link && Number(router.query.format) === ArchivedFormat.readability && (
<ReadableView link={link} />
)}
{link && Number(router.query.format) === ArchivedFormat.monolith && (
{getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.readability ? (
<ReadableView link={getLink.data} />
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.monolith ? (
<iframe
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.monolith}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.monolith}`}
className="w-full h-screen border-none"
></iframe>
)}
{link && Number(router.query.format) === ArchivedFormat.pdf && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.pdf ? (
<iframe
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.pdf}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.pdf}`}
className="w-full h-screen border-none"
></iframe>
)}
{link && Number(router.query.format) === ArchivedFormat.png && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.png ? (
<img
alt=""
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.png}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.png}`}
className="w-fit mx-auto"
/>
)}
{link && Number(router.query.format) === ArchivedFormat.jpeg && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.jpeg ? (
<img
alt=""
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.jpeg}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.jpeg}`}
className="w-fit mx-auto"
/>
) : getLink.error ? (
<p>404 - Not found</p>
) : (
<div className="max-w-3xl p-5 m-auto w-full flex flex-col items-center gap-5">
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-3/4 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-5/6 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-3/4 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-5/6 mr-auto h-4 skeleton rounded-md"></div>
</div>
)}
</div>
);
pages/public/preserved/[id].tsx
+36 -30
View File
@@ -1,64 +1,70 @@
import React, { useEffect, useState } from "react";
import React, { useEffect } from "react";
import { useRouter } from "next/router";
import {
ArchivedFormat,
LinkIncludingShortenedCollectionAndTags,
} from "@/types/global";
import { ArchivedFormat } from "@/types/global";
import ReadableView from "@/components/ReadableView";
import getServerSideProps from "@/lib/client/getServerSideProps";
import { useGetLink } from "@/hooks/store/links";
import clsx from "clsx";
export default function Index() {
const getLink = useGetLink();
const [link, setLink] = useState<LinkIncludingShortenedCollectionAndTags>();
const router = useRouter();
useEffect(() => {
const fetchLink = async () => {
if (router.query.id) {
const get = await getLink.mutateAsync({ id: Number(router.query.id) });
setLink(get);
}
};
fetchLink();
if (router.query.id) {
getLink.mutateAsync({ id: Number(router.query.id), isPublicRoute: true });
}
}, []);
return (
<div className="relative">
<div className={clsx(getLink.isPending ? "flex h-screen" : "relative")}>
{/* <div className="fixed left-1/2 transform -translate-x-1/2 w-fit py-1 px-3 bg-base-200 border border-neutral-content rounded-md">
Readable
</div> */}
{link && Number(router.query.format) === ArchivedFormat.readability && (
<ReadableView link={link} />
)}
{link && Number(router.query.format) === ArchivedFormat.monolith && (
{getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.readability ? (
<ReadableView link={getLink.data} />
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.monolith ? (
<iframe
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.monolith}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.monolith}`}
className="w-full h-screen border-none"
></iframe>
)}
{link && Number(router.query.format) === ArchivedFormat.pdf && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.pdf ? (
<iframe
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.pdf}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.pdf}`}
className="w-full h-screen border-none"
></iframe>
)}
{link && Number(router.query.format) === ArchivedFormat.png && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.png ? (
<img
alt=""
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.png}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.png}`}
className="w-fit mx-auto"
/>
)}
{link && Number(router.query.format) === ArchivedFormat.jpeg && (
) : getLink.data?.id &&
Number(router.query.format) === ArchivedFormat.jpeg ? (
<img
alt=""
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.jpeg}`}
src={`/api/v1/archives/${getLink.data.id}?format=${ArchivedFormat.jpeg}`}
className="w-fit mx-auto"
/>
) : getLink.error ? (
<p>404 - Not found</p>
) : (
<div className="max-w-3xl p-5 m-auto w-full flex flex-col items-center gap-5">
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-3/4 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-5/6 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-3/4 mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-full mr-auto h-4 skeleton rounded-md"></div>
<div className="w-5/6 mr-auto h-4 skeleton rounded-md"></div>
</div>
)}
</div>
);