added internationalization to pages [WIP]
This commit is contained in:
daniel31x13
parent
2c87459f35
commit
d261bd39ec
|
|
@ -0,0 +1,203 @@
|
|||
import React, { Dispatch, SetStateAction, useEffect, useState } from "react";
|
||||
import FilterSearchDropdown from "./FilterSearchDropdown";
|
||||
import SortDropdown from "./SortDropdown";
|
||||
import ViewDropdown from "./ViewDropdown";
|
||||
import { TFunction } from "i18next";
|
||||
import BulkDeleteLinksModal from "./ModalContent/BulkDeleteLinksModal";
|
||||
import BulkEditLinksModal from "./ModalContent/BulkEditLinksModal";
|
||||
import toast from "react-hot-toast";
|
||||
import useCollectivePermissions from "@/hooks/useCollectivePermissions";
|
||||
import { useRouter } from "next/router";
|
||||
import useLinkStore from "@/store/links";
|
||||
import { Sort } from "@/types/global";
|
||||
|
||||
type Props = {
|
||||
children: React.ReactNode;
|
||||
t: TFunction<"translation", undefined>;
|
||||
viewMode: string;
|
||||
setViewMode: Dispatch<SetStateAction<string>>;
|
||||
searchFilter?: {
|
||||
name: boolean;
|
||||
url: boolean;
|
||||
description: boolean;
|
||||
tags: boolean;
|
||||
textContent: boolean;
|
||||
};
|
||||
setSearchFilter?: (filter: {
|
||||
name: boolean;
|
||||
url: boolean;
|
||||
description: boolean;
|
||||
tags: boolean;
|
||||
textContent: boolean;
|
||||
}) => void;
|
||||
sortBy: Sort;
|
||||
setSortBy: Dispatch<SetStateAction<Sort>>;
|
||||
editMode?: boolean;
|
||||
setEditMode?: (mode: boolean) => void;
|
||||
};
|
||||
|
||||
const LinkListOptions = ({
|
||||
children,
|
||||
t,
|
||||
viewMode,
|
||||
setViewMode,
|
||||
searchFilter,
|
||||
setSearchFilter,
|
||||
sortBy,
|
||||
setSortBy,
|
||||
editMode,
|
||||
setEditMode,
|
||||
}: Props) => {
|
||||
const { links, selectedLinks, setSelectedLinks, deleteLinksById } =
|
||||
useLinkStore();
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
|
||||
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (editMode && setEditMode) return setEditMode(false);
|
||||
}, [router]);
|
||||
|
||||
const collectivePermissions = useCollectivePermissions(
|
||||
selectedLinks.map((link) => link.collectionId as number)
|
||||
);
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(t("deleting_selections"));
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
selectedLinks.length === 1
|
||||
? t("link_deleted")
|
||||
: t("links_deleted", { count: selectedLinks.length })
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex justify-between items-center">
|
||||
{children}
|
||||
|
||||
<div className="flex gap-3 items-center justify-end">
|
||||
<div className="flex gap-2 items-center mt-2">
|
||||
{links.length > 0 && editMode !== undefined && setEditMode && (
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
)}
|
||||
{searchFilter && setSearchFilter && (
|
||||
<FilterSearchDropdown
|
||||
searchFilter={searchFilter}
|
||||
setSearchFilter={setSearchFilter}
|
||||
/>
|
||||
)}
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} t={t} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length === 1
|
||||
? t("link_selected")
|
||||
: t("links_selected", { count: selectedLinks.length })}
|
||||
</span>
|
||||
) : (
|
||||
<span>{t("nothing_selected")}</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canUpdate
|
||||
)
|
||||
}
|
||||
>
|
||||
{t("edit")}
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey ? bulkDeleteLinks() : setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canDelete
|
||||
)
|
||||
}
|
||||
>
|
||||
{t("delete")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{bulkDeleteLinksModal && (
|
||||
<BulkDeleteLinksModal
|
||||
onClose={() => {
|
||||
setBulkDeleteLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
{bulkEditLinksModal && (
|
||||
<BulkEditLinksModal
|
||||
onClose={() => {
|
||||
setBulkEditLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default LinkListOptions;
|
||||
|
|
@ -1,13 +1,15 @@
|
|||
import React, { Dispatch, SetStateAction } from "react";
|
||||
import { Sort } from "@/types/global";
|
||||
import { dropdownTriggerer } from "@/lib/client/utils";
|
||||
import { TFunction } from "i18next";
|
||||
|
||||
type Props = {
|
||||
sortBy: Sort;
|
||||
setSort: Dispatch<SetStateAction<Sort>>;
|
||||
t: TFunction<"translation", undefined>;
|
||||
};
|
||||
|
||||
export default function SortDropdown({ sortBy, setSort }: Props) {
|
||||
export default function SortDropdown({ sortBy, setSort, t }: Props) {
|
||||
return (
|
||||
<div className="dropdown dropdown-bottom dropdown-end">
|
||||
<div
|
||||
|
|
@ -29,13 +31,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Date (Newest First)"
|
||||
checked={sortBy === Sort.DateNewestFirst}
|
||||
onChange={() => {
|
||||
setSort(Sort.DateNewestFirst);
|
||||
}}
|
||||
onChange={() => setSort(Sort.DateNewestFirst)}
|
||||
/>
|
||||
<span className="label-text">Date (Newest First)</span>
|
||||
<span className="label-text">{t("date_newest_first")}</span>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -48,11 +47,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Date (Oldest First)"
|
||||
checked={sortBy === Sort.DateOldestFirst}
|
||||
onChange={() => setSort(Sort.DateOldestFirst)}
|
||||
/>
|
||||
<span className="label-text">Date (Oldest First)</span>
|
||||
<span className="label-text">{t("date_oldest_first")}</span>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -65,11 +63,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Name (A-Z)"
|
||||
checked={sortBy === Sort.NameAZ}
|
||||
onChange={() => setSort(Sort.NameAZ)}
|
||||
/>
|
||||
<span className="label-text">Name (A-Z)</span>
|
||||
<span className="label-text">{t("name_az")}</span>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -82,11 +79,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Name (Z-A)"
|
||||
checked={sortBy === Sort.NameZA}
|
||||
onChange={() => setSort(Sort.NameZA)}
|
||||
/>
|
||||
<span className="label-text">Name (Z-A)</span>
|
||||
<span className="label-text">{t("name_za")}</span>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -99,11 +95,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Description (A-Z)"
|
||||
checked={sortBy === Sort.DescriptionAZ}
|
||||
onChange={() => setSort(Sort.DescriptionAZ)}
|
||||
/>
|
||||
<span className="label-text">Description (A-Z)</span>
|
||||
<span className="label-text">{t("description_az")}</span>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -116,11 +111,10 @@ export default function SortDropdown({ sortBy, setSort }: Props) {
|
|||
type="radio"
|
||||
name="sort-radio"
|
||||
className="radio checked:bg-primary"
|
||||
value="Description (Z-A)"
|
||||
checked={sortBy === Sort.DescriptionZA}
|
||||
onChange={() => setSort(Sort.DescriptionZA)}
|
||||
/>
|
||||
<span className="label-text">Description (Z-A)</span>
|
||||
<span className="label-text">{t("description_za")}</span>
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,87 @@
|
|||
import DeleteUserModal from "@/components/ModalContent/DeleteUserModal";
|
||||
import { User as U } from "@prisma/client";
|
||||
import { TFunction } from "i18next";
|
||||
|
||||
interface User extends U {
|
||||
subscriptions: {
|
||||
active: boolean;
|
||||
};
|
||||
}
|
||||
|
||||
type UserModal = {
|
||||
isOpen: boolean;
|
||||
userId: number | null;
|
||||
};
|
||||
|
||||
const UserListing = (
|
||||
users: User[],
|
||||
deleteUserModal: UserModal,
|
||||
setDeleteUserModal: Function,
|
||||
t: TFunction<"translation", undefined>
|
||||
) => {
|
||||
return (
|
||||
<div className="overflow-x-auto whitespace-nowrap w-full">
|
||||
<table className="table w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>{t("username")}</th>
|
||||
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||||
<th>{t("email")}</th>
|
||||
)}
|
||||
{process.env.NEXT_PUBLIC_STRIPE === "true" && (
|
||||
<th>{t("subscribed")}</th>
|
||||
)}
|
||||
<th>{t("created_at")}</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{users.map((user, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className="group hover:bg-neutral-content hover:bg-opacity-30 duration-100"
|
||||
>
|
||||
<td className="text-primary">{index + 1}</td>
|
||||
<td>
|
||||
{user.username ? user.username : <b>{t("not_available")}</b>}
|
||||
</td>
|
||||
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||||
<td>{user.email}</td>
|
||||
)}
|
||||
{process.env.NEXT_PUBLIC_STRIPE === "true" && (
|
||||
<td>
|
||||
{user.subscriptions?.active ? (
|
||||
<i className="bi bi-check text-green-500"></i>
|
||||
) : (
|
||||
<i className="bi bi-x text-red-500"></i>
|
||||
)}
|
||||
</td>
|
||||
)}
|
||||
<td>{new Date(user.createdAt).toLocaleString()}</td>
|
||||
<td className="relative">
|
||||
<button
|
||||
className="btn btn-sm btn-ghost duration-100 hidden group-hover:block absolute z-20 right-[0.35rem] top-[0.35rem]"
|
||||
onClick={() =>
|
||||
setDeleteUserModal({ isOpen: true, userId: user.id })
|
||||
}
|
||||
>
|
||||
<i className="bi bi-trash"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
{deleteUserModal.isOpen && deleteUserModal.userId ? (
|
||||
<DeleteUserModal
|
||||
onClose={() => setDeleteUserModal({ isOpen: false, userId: null })}
|
||||
userId={deleteUserModal.userId}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserListing;
|
||||
|
|
@ -42,6 +42,7 @@ export default function AuthRedirect({ children }: Props) {
|
|||
{ path: "/tags", isProtected: true },
|
||||
{ path: "/preserved", isProtected: true },
|
||||
{ path: "/admin", isProtected: true },
|
||||
{ path: "/search", isProtected: true },
|
||||
];
|
||||
|
||||
if (isPublicPage) {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import useLocalSettingsStore from "@/store/localSettings";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import React, { ReactNode, useEffect } from "react";
|
||||
import React, { ReactNode } from "react";
|
||||
|
||||
interface Props {
|
||||
text?: string;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import { prisma } from "@/lib/api/db";
|
||||
import { UsersAndCollections } from "@prisma/client";
|
||||
import getPermission from "@/lib/api/getPermission";
|
||||
import removeFile from "@/lib/api/storage/removeFile";
|
||||
import { removeFiles } from "@/lib/api/manageLinkFiles";
|
||||
|
||||
export default async function deleteLinksById(
|
||||
|
|
|
|||
|
|
@ -1,12 +1,14 @@
|
|||
import { CollectionIncludingMembersAndLinkCount, Member } from "@/types/global";
|
||||
import getPublicUserData from "./getPublicUserData";
|
||||
import { toast } from "react-hot-toast";
|
||||
import { TFunction } from "i18next";
|
||||
|
||||
const addMemberToCollection = async (
|
||||
ownerUsername: string,
|
||||
memberUsername: string,
|
||||
collection: CollectionIncludingMembersAndLinkCount,
|
||||
setMember: (newMember: Member) => null | undefined
|
||||
setMember: (newMember: Member) => null | undefined,
|
||||
t: TFunction<"translation", undefined>
|
||||
) => {
|
||||
const checkIfMemberAlreadyExists = collection.members.find((e) => {
|
||||
const username = (e.user.username || "").toLowerCase();
|
||||
|
|
@ -39,9 +41,9 @@ const addMemberToCollection = async (
|
|||
},
|
||||
});
|
||||
}
|
||||
} else if (checkIfMemberAlreadyExists) toast.error("User already exists.");
|
||||
} else if (checkIfMemberAlreadyExists) toast.error(t("user_already_member"));
|
||||
else if (memberUsername.trim().toLowerCase() === ownerUsername.toLowerCase())
|
||||
toast.error("You are already the collection owner.");
|
||||
toast.error(t("you_are_already_collection_owner"));
|
||||
};
|
||||
|
||||
export default addMemberToCollection;
|
||||
|
|
|
|||
|
|
@ -4,4 +4,5 @@ module.exports = {
|
|||
defaultLocale: "en",
|
||||
locales: ["en"],
|
||||
},
|
||||
reloadOnPrerender: process.env.NODE_ENV === "development",
|
||||
};
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import Link from "next/link";
|
|||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import UserListing from "@/components/UserListing";
|
||||
|
||||
interface User extends U {
|
||||
subscriptions: {
|
||||
|
|
@ -64,7 +65,7 @@ export default function Admin() {
|
|||
<input
|
||||
id="search-box"
|
||||
type="text"
|
||||
placeholder={"Search for Users"}
|
||||
placeholder={t("search_users")}
|
||||
value={searchQuery}
|
||||
onChange={(e) => {
|
||||
setSearchQuery(e.target.value);
|
||||
|
|
@ -95,13 +96,13 @@ export default function Admin() {
|
|||
<div className="divider my-3"></div>
|
||||
|
||||
{filteredUsers && filteredUsers.length > 0 && searchQuery !== "" ? (
|
||||
UserListing(filteredUsers, deleteUserModal, setDeleteUserModal)
|
||||
UserListing(filteredUsers, deleteUserModal, setDeleteUserModal, t)
|
||||
) : searchQuery !== "" ? (
|
||||
<p>No users found with the given search query.</p>
|
||||
<p>{t("no_user_found_in_search")}</p>
|
||||
) : users && users.length > 0 ? (
|
||||
UserListing(users, deleteUserModal, setDeleteUserModal)
|
||||
UserListing(users, deleteUserModal, setDeleteUserModal, t)
|
||||
) : (
|
||||
<p>No users found.</p>
|
||||
<p>{t("no_users_found")}</p>
|
||||
)}
|
||||
|
||||
{newUserModal ? (
|
||||
|
|
@ -111,70 +112,4 @@ export default function Admin() {
|
|||
);
|
||||
}
|
||||
|
||||
const UserListing = (
|
||||
users: User[],
|
||||
deleteUserModal: UserModal,
|
||||
setDeleteUserModal: Function
|
||||
) => {
|
||||
return (
|
||||
<div className="overflow-x-auto whitespace-nowrap w-full">
|
||||
<table className="table w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Username</th>
|
||||
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||||
<th>Email</th>
|
||||
)}
|
||||
{process.env.NEXT_PUBLIC_STRIPE === "true" && <th>Subscribed</th>}
|
||||
<th>Created At</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{users.map((user, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className="group hover:bg-neutral-content hover:bg-opacity-30 duration-100"
|
||||
>
|
||||
<td className="text-primary">{index + 1}</td>
|
||||
<td>{user.username ? user.username : <b>N/A</b>}</td>
|
||||
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||||
<td>{user.email}</td>
|
||||
)}
|
||||
{process.env.NEXT_PUBLIC_STRIPE === "true" && (
|
||||
<td>
|
||||
{user.subscriptions?.active ? (
|
||||
JSON.stringify(user.subscriptions?.active)
|
||||
) : (
|
||||
<b>N/A</b>
|
||||
)}
|
||||
</td>
|
||||
)}
|
||||
<td>{new Date(user.createdAt).toLocaleString()}</td>
|
||||
<td className="relative">
|
||||
<button
|
||||
className="btn btn-sm btn-ghost duration-100 hidden group-hover:block absolute z-20 right-[0.35rem] top-[0.35rem]"
|
||||
onClick={() =>
|
||||
setDeleteUserModal({ isOpen: true, userId: user.id })
|
||||
}
|
||||
>
|
||||
<i className="bi bi-trash"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
{deleteUserModal.isOpen && deleteUserModal.userId ? (
|
||||
<DeleteUserModal
|
||||
onClose={() => setDeleteUserModal({ isOpen: false, userId: null })}
|
||||
userId={deleteUserModal.userId}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -114,44 +114,7 @@ if (
|
|||
|
||||
if (!user) throw Error("Invalid credentials.");
|
||||
else if (!user?.emailVerified && emailEnabled) {
|
||||
const identifier = user?.email as string;
|
||||
const token = randomBytes(32).toString("hex");
|
||||
const url = `${
|
||||
process.env.NEXTAUTH_URL
|
||||
}/callback/email?token=${token}&email=${encodeURIComponent(
|
||||
identifier
|
||||
)}`;
|
||||
const from = process.env.EMAIL_FROM as string;
|
||||
|
||||
const recentVerificationRequestsCount =
|
||||
await prisma.verificationToken.count({
|
||||
where: {
|
||||
identifier,
|
||||
createdAt: {
|
||||
gt: new Date(new Date().getTime() - 1000 * 60 * 5), // 5 minutes
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
if (recentVerificationRequestsCount >= 4)
|
||||
throw Error("Too many requests. Please try again later.");
|
||||
|
||||
sendVerificationRequest({
|
||||
identifier,
|
||||
url,
|
||||
from,
|
||||
token,
|
||||
});
|
||||
|
||||
await prisma.verificationToken.create({
|
||||
data: {
|
||||
identifier,
|
||||
token,
|
||||
expires: new Date(Date.now() + 24 * 3600 * 1000), // 1 day
|
||||
},
|
||||
});
|
||||
|
||||
throw Error("Email not verified. Verification email sent.");
|
||||
throw Error("Email not verified.");
|
||||
}
|
||||
|
||||
let passwordMatches: boolean = false;
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@ import Link from "next/link";
|
|||
import { useRouter } from "next/router";
|
||||
import { FormEvent, useState } from "react";
|
||||
import { toast } from "react-hot-toast";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
interface FormData {
|
||||
password: string;
|
||||
|
|
@ -12,8 +14,8 @@ interface FormData {
|
|||
}
|
||||
|
||||
export default function ResetPassword() {
|
||||
const { t } = useTranslation();
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const [form, setForm] = useState<FormData>({
|
||||
|
|
@ -34,7 +36,7 @@ export default function ResetPassword() {
|
|||
) {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Sending password recovery link...");
|
||||
const load = toast.loading(t("sending_password_recovery_link"));
|
||||
|
||||
const response = await fetch("/api/v1/auth/reset-password", {
|
||||
method: "POST",
|
||||
|
|
@ -46,6 +48,7 @@ export default function ResetPassword() {
|
|||
|
||||
const data = await response.json();
|
||||
|
||||
toast.dismiss(load);
|
||||
if (response.ok) {
|
||||
toast.success(data.response);
|
||||
setRequestSent(true);
|
||||
|
|
@ -53,11 +56,9 @@ export default function ResetPassword() {
|
|||
toast.error(data.response);
|
||||
}
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
setSubmitLoader(false);
|
||||
} else {
|
||||
toast.error("Please fill out all the fields.");
|
||||
toast.error(t("please_fill_all_fields"));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -66,22 +67,18 @@ export default function ResetPassword() {
|
|||
<form onSubmit={submit}>
|
||||
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
|
||||
<p className="text-3xl text-center font-extralight">
|
||||
{requestSent ? "Password Updated!" : "Reset Password"}
|
||||
{requestSent ? t("password_updated") : t("reset_password")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-0"></div>
|
||||
|
||||
{!requestSent ? (
|
||||
<>
|
||||
<p>{t("enter_email_for_new_password")}</p>
|
||||
<div>
|
||||
<p>
|
||||
Enter your email so we can send you a link to create a new
|
||||
password.
|
||||
<p className="text-sm w-fit font-semibold mb-1">
|
||||
{t("new_password")}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm w-fit font-semibold mb-1">New Password</p>
|
||||
|
||||
<TextInput
|
||||
autoFocus
|
||||
type="password"
|
||||
|
|
@ -93,7 +90,6 @@ export default function ResetPassword() {
|
|||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<AccentSubmitButton
|
||||
type="submit"
|
||||
intent="accent"
|
||||
|
|
@ -101,16 +97,15 @@ export default function ResetPassword() {
|
|||
size="full"
|
||||
loading={submitLoader}
|
||||
>
|
||||
Update Password
|
||||
{t("update_password")}
|
||||
</AccentSubmitButton>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<p>Your password has been successfully updated.</p>
|
||||
|
||||
<p>{t("password_successfully_updated")}</p>
|
||||
<div className="mx-auto w-fit mt-3">
|
||||
<Link className="font-semibold" href="/login">
|
||||
Back to Login
|
||||
{t("back_to_login")}
|
||||
</Link>
|
||||
</div>
|
||||
</>
|
||||
|
|
@ -120,3 +115,5 @@ export default function ResetPassword() {
|
|||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -2,11 +2,14 @@ import { signOut } from "next-auth/react";
|
|||
import { useRouter } from "next/router";
|
||||
import { useEffect } from "react";
|
||||
import toast from "react-hot-toast";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
const VerifyEmail = () => {
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
const { t } = useTranslation();
|
||||
const token = router.query.token;
|
||||
|
||||
if (!token || typeof token !== "string") {
|
||||
|
|
@ -19,12 +22,12 @@ const VerifyEmail = () => {
|
|||
method: "POST",
|
||||
}).then((res) => {
|
||||
if (res.ok) {
|
||||
toast.success("Email verified. Signing out..");
|
||||
toast.success(t("email_verified_signing_out"));
|
||||
setTimeout(() => {
|
||||
signOut();
|
||||
}, 3000);
|
||||
} else {
|
||||
toast.error("Invalid token.");
|
||||
toast.error(t("invalid_token"));
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -35,3 +38,5 @@ const VerifyEmail = () => {
|
|||
};
|
||||
|
||||
export default VerifyEmail;
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@ import { useRouter } from "next/router";
|
|||
import React, { useEffect, useState } from "react";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import ProfilePhoto from "@/components/ProfilePhoto";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import usePermissions from "@/hooks/usePermissions";
|
||||
import NoLinksFound from "@/components/NoLinksFound";
|
||||
|
|
@ -19,23 +18,22 @@ import getPublicUserData from "@/lib/client/getPublicUserData";
|
|||
import EditCollectionModal from "@/components/ModalContent/EditCollectionModal";
|
||||
import EditCollectionSharingModal from "@/components/ModalContent/EditCollectionSharingModal";
|
||||
import DeleteCollectionModal from "@/components/ModalContent/DeleteCollectionModal";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import { dropdownTriggerer } from "@/lib/client/utils";
|
||||
import NewCollectionModal from "@/components/ModalContent/NewCollectionModal";
|
||||
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
|
||||
import toast from "react-hot-toast";
|
||||
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
|
||||
export default function Index() {
|
||||
const { t } = useTranslation();
|
||||
const { settings } = useLocalSettingsStore();
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const { links, selectedLinks, setSelectedLinks, deleteLinksById } =
|
||||
useLinkStore();
|
||||
const { links } = useLinkStore();
|
||||
const { collections } = useCollectionStore();
|
||||
|
||||
const [sortBy, setSortBy] = useState<Sort>(Sort.DateNewestFirst);
|
||||
|
|
@ -84,9 +82,6 @@ export default function Index() {
|
|||
};
|
||||
|
||||
fetchOwner();
|
||||
|
||||
// When the collection changes, reset the selected links
|
||||
setSelectedLinks([]);
|
||||
}, [activeCollection]);
|
||||
|
||||
const [editCollectionModal, setEditCollectionModal] = useState(false);
|
||||
|
|
@ -94,8 +89,6 @@ export default function Index() {
|
|||
const [editCollectionSharingModal, setEditCollectionSharingModal] =
|
||||
useState(false);
|
||||
const [deleteCollectionModal, setDeleteCollectionModal] = useState(false);
|
||||
const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
|
||||
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
|
||||
const [editMode, setEditMode] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -115,35 +108,6 @@ export default function Index() {
|
|||
// @ts-ignore
|
||||
const LinkComponent = linkView[viewMode];
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(
|
||||
`Deleting ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}...`
|
||||
);
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
`Deleted ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}!`
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<MainLayout>
|
||||
<div
|
||||
|
|
@ -187,7 +151,7 @@ export default function Index() {
|
|||
setEditCollectionModal(true);
|
||||
}}
|
||||
>
|
||||
Edit Collection Info
|
||||
{t("edit_collection_info")}
|
||||
</div>
|
||||
</li>
|
||||
)}
|
||||
|
|
@ -201,8 +165,8 @@ export default function Index() {
|
|||
}}
|
||||
>
|
||||
{permissions === true
|
||||
? "Share and Collaborate"
|
||||
: "View Team"}
|
||||
? t("share_and_collaborate")
|
||||
: t("view_team")}
|
||||
</div>
|
||||
</li>
|
||||
{permissions === true && (
|
||||
|
|
@ -215,7 +179,7 @@ export default function Index() {
|
|||
setNewCollectionModal(true);
|
||||
}}
|
||||
>
|
||||
Create Sub-Collection
|
||||
{t("create_subcollection")}
|
||||
</div>
|
||||
</li>
|
||||
)}
|
||||
|
|
@ -229,8 +193,8 @@ export default function Index() {
|
|||
}}
|
||||
>
|
||||
{permissions === true
|
||||
? "Delete Collection"
|
||||
: "Leave Collection"}
|
||||
? t("delete_collection")
|
||||
: t("leave_collection")}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -272,11 +236,23 @@ export default function Index() {
|
|||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
<p className="text-neutral text-sm font-semibold">
|
||||
By {collectionOwner.name}
|
||||
|
||||
<p className="text-neutral text-sm">
|
||||
{activeCollection.members.length > 0 &&
|
||||
` and ${activeCollection.members.length} others`}
|
||||
.
|
||||
activeCollection.members.length === 1
|
||||
? 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,
|
||||
count: activeCollection.members.length,
|
||||
})
|
||||
: t("by_author", {
|
||||
author: collectionOwner.name,
|
||||
})}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -313,84 +289,37 @@ export default function Index() {
|
|||
|
||||
<div className="divider my-0"></div>
|
||||
|
||||
<div className="flex justify-between items-center gap-5">
|
||||
<p>Showing {activeCollection?._count?.links} results</p>
|
||||
<div className="flex items-center gap-2">
|
||||
{links.length > 0 &&
|
||||
(permissions === true ||
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
editMode={
|
||||
permissions === true ||
|
||||
permissions?.canUpdate ||
|
||||
permissions?.canDelete) && (
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
)}
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
permissions?.canDelete
|
||||
? editMode
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length}{" "}
|
||||
{selectedLinks.length === 1 ? "link" : "links"} selected
|
||||
</span>
|
||||
) : (
|
||||
<span>Nothing selected</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(permissions === true || permissions?.canUpdate)
|
||||
setEditMode={
|
||||
permissions === true ||
|
||||
permissions?.canUpdate ||
|
||||
permissions?.canDelete
|
||||
? setEditMode
|
||||
: undefined
|
||||
}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey
|
||||
? bulkDeleteLinks()
|
||||
: setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(permissions === true || permissions?.canDelete)
|
||||
}
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<p>
|
||||
{activeCollection?._count?.links === 1
|
||||
? t("showing_count_result", {
|
||||
count: activeCollection?._count?.links,
|
||||
})
|
||||
: t("showing_count_results", {
|
||||
count: activeCollection?._count?.links,
|
||||
})}
|
||||
</p>
|
||||
</LinkListOptions>
|
||||
|
||||
{links.some((e) => e.collectionId === Number(router.query.id)) ? (
|
||||
<LinkComponent
|
||||
|
|
@ -429,22 +358,10 @@ export default function Index() {
|
|||
activeCollection={activeCollection}
|
||||
/>
|
||||
)}
|
||||
{bulkDeleteLinksModal && (
|
||||
<BulkDeleteLinksModal
|
||||
onClose={() => {
|
||||
setBulkDeleteLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{bulkEditLinksModal && (
|
||||
<BulkEditLinksModal
|
||||
onClose={() => {
|
||||
setBulkEditLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -8,8 +8,11 @@ import { Sort } from "@/types/global";
|
|||
import useSort from "@/hooks/useSort";
|
||||
import NewCollectionModal from "@/components/ModalContent/NewCollectionModal";
|
||||
import PageHeader from "@/components/PageHeader";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
export default function Collections() {
|
||||
const { t } = useTranslation();
|
||||
const { collections } = useCollectionStore();
|
||||
const [sortBy, setSortBy] = useState<Sort>(Sort.DateNewestFirst);
|
||||
const [sortedCollections, setSortedCollections] = useState(collections);
|
||||
|
|
@ -26,13 +29,13 @@ export default function Collections() {
|
|||
<div className="flex justify-between">
|
||||
<PageHeader
|
||||
icon={"bi-folder"}
|
||||
title={"Collections"}
|
||||
description={"Collections you own"}
|
||||
title={t("collections")}
|
||||
description={t("collections_you_own")}
|
||||
/>
|
||||
|
||||
<div className="flex gap-3 justify-end">
|
||||
<div className="relative mt-2">
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} t={t} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -48,7 +51,9 @@ export default function Collections() {
|
|||
className="card card-compact shadow-md hover:shadow-none duration-200 border border-neutral-content p-5 bg-base-200 self-stretch min-h-[12rem] rounded-2xl cursor-pointer flex flex-col gap-4 justify-center items-center group btn"
|
||||
onClick={() => setNewCollectionModal(true)}
|
||||
>
|
||||
<p className="group-hover:opacity-0 duration-100">New Collection</p>
|
||||
<p className="group-hover:opacity-0 duration-100">
|
||||
{t("new_collection")}
|
||||
</p>
|
||||
<i className="bi-plus-lg text-5xl group-hover:text-7xl group-hover:-mt-6 text-primary drop-shadow duration-100"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -57,8 +62,8 @@ export default function Collections() {
|
|||
<>
|
||||
<PageHeader
|
||||
icon={"bi-folder"}
|
||||
title={"Other Collections"}
|
||||
description={"Shared collections you're a member of"}
|
||||
title={t("other_collections")}
|
||||
description={t("other_collections_desc")}
|
||||
/>
|
||||
|
||||
<div className="grid min-[1900px]:grid-cols-4 2xl:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-5">
|
||||
|
|
@ -77,3 +82,5 @@ export default function Collections() {
|
|||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,19 +1,25 @@
|
|||
import CenteredForm from "@/layouts/CenteredForm";
|
||||
import { signIn } from "next-auth/react";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import React, { useState } from "react";
|
||||
import toast from "react-hot-toast";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
export default function EmailConfirmaion() {
|
||||
const router = useRouter();
|
||||
|
||||
const { t } = useTranslation();
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const resend = async () => {
|
||||
if (submitLoader) return;
|
||||
else if (!router.query.email) return;
|
||||
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Authenticating...");
|
||||
const load = toast.loading(t("authenticating"));
|
||||
|
||||
const res = await signIn("email", {
|
||||
email: decodeURIComponent(router.query.email as string),
|
||||
|
|
@ -25,29 +31,28 @@ export default function EmailConfirmaion() {
|
|||
|
||||
setSubmitLoader(false);
|
||||
|
||||
toast.success("Verification email sent.");
|
||||
toast.success(t("verification_email_sent"));
|
||||
};
|
||||
|
||||
return (
|
||||
<CenteredForm>
|
||||
<div className="p-4 max-w-[30rem] min-w-80 w-full rounded-2xl shadow-md mx-auto border border-neutral-content bg-base-200">
|
||||
<p className="text-center text-2xl sm:text-3xl font-extralight mb-2 ">
|
||||
Please check your Email
|
||||
{t("check_your_email")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<p>
|
||||
A sign in link has been sent to your email address. If you don't see
|
||||
the email, check your spam folder.
|
||||
</p>
|
||||
<p>{t("verification_email_sent_desc")}</p>
|
||||
|
||||
<div className="mx-auto w-fit mt-3">
|
||||
<div className="btn btn-ghost btn-sm" onClick={resend}>
|
||||
Resend Email
|
||||
{t("resend_email")}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -17,8 +17,11 @@ import ListView from "@/components/LinkViews/Layouts/ListView";
|
|||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import { dropdownTriggerer } from "@/lib/client/utils";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
export default function Dashboard() {
|
||||
const { t } = useTranslation();
|
||||
const { collections } = useCollectionStore();
|
||||
const { links } = useLinkStore();
|
||||
const { tags } = useTagStore();
|
||||
|
|
@ -117,7 +120,7 @@ export default function Dashboard() {
|
|||
<PageHeader
|
||||
icon={"bi-house "}
|
||||
title={"Dashboard"}
|
||||
description={"A brief overview of your data"}
|
||||
description={t("dashboard_desc")}
|
||||
/>
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
|
|
@ -125,7 +128,7 @@ export default function Dashboard() {
|
|||
<div>
|
||||
<div className="flex justify-evenly flex-col xl:flex-row xl:items-center gap-2 xl:w-full h-full rounded-2xl p-8 border border-neutral-content bg-base-200">
|
||||
<DashboardItem
|
||||
name={numberOfLinks === 1 ? "Link" : "Links"}
|
||||
name={numberOfLinks === 1 ? t("link") : t("links")}
|
||||
value={numberOfLinks}
|
||||
icon={"bi-link-45deg"}
|
||||
/>
|
||||
|
|
@ -133,7 +136,9 @@ export default function Dashboard() {
|
|||
<div className="divider xl:divider-horizontal"></div>
|
||||
|
||||
<DashboardItem
|
||||
name={collections.length === 1 ? "Collection" : "Collections"}
|
||||
name={
|
||||
collections.length === 1 ? t("collection") : t("collections")
|
||||
}
|
||||
value={collections.length}
|
||||
icon={"bi-folder"}
|
||||
/>
|
||||
|
|
@ -141,7 +146,7 @@ export default function Dashboard() {
|
|||
<div className="divider xl:divider-horizontal"></div>
|
||||
|
||||
<DashboardItem
|
||||
name={tags.length === 1 ? "Tag" : "Tags"}
|
||||
name={tags.length === 1 ? t("tag") : t("tags")}
|
||||
value={tags.length}
|
||||
icon={"bi-hash"}
|
||||
/>
|
||||
|
|
@ -152,15 +157,15 @@ export default function Dashboard() {
|
|||
<div className="flex gap-2 items-center">
|
||||
<PageHeader
|
||||
icon={"bi-clock-history"}
|
||||
title={"Recent"}
|
||||
description={"Recently added Links"}
|
||||
title={t("recent")}
|
||||
description={t("recent_links_desc")}
|
||||
/>
|
||||
</div>
|
||||
<Link
|
||||
href="/links"
|
||||
className="flex items-center text-sm text-black/75 dark:text-white/75 gap-2 cursor-pointer"
|
||||
>
|
||||
View All
|
||||
{t("view_all")}
|
||||
<i className="bi-chevron-right text-sm"></i>
|
||||
</Link>
|
||||
</div>
|
||||
|
|
@ -176,11 +181,10 @@ export default function Dashboard() {
|
|||
) : (
|
||||
<div className="sky-shadow flex flex-col justify-center h-full border border-solid border-neutral-content w-full mx-auto p-10 rounded-2xl bg-base-200">
|
||||
<p className="text-center text-2xl">
|
||||
View Your Recently Added Links Here!
|
||||
{t("view_added_links_here")}
|
||||
</p>
|
||||
<p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
|
||||
This section will view your latest added Links across every
|
||||
Collections you have access to.
|
||||
{t("view_added_links_here_desc")}
|
||||
</p>
|
||||
|
||||
<div className="text-center w-full mt-4 flex flex-wrap gap-4 justify-center">
|
||||
|
|
@ -192,7 +196,7 @@ export default function Dashboard() {
|
|||
>
|
||||
<i className="bi-plus-lg text-xl"></i>
|
||||
<span className="group-hover:opacity-0 text-right">
|
||||
Add New Link
|
||||
{t("add_link")}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
|
@ -205,7 +209,7 @@ export default function Dashboard() {
|
|||
id="import-dropdown"
|
||||
>
|
||||
<i className="bi-cloud-upload text-xl duration-100"></i>
|
||||
<p>Import From</p>
|
||||
<p>{t("import_links")}</p>
|
||||
</div>
|
||||
<ul className="shadow menu dropdown-content z-[1] bg-base-200 border border-neutral-content rounded-box mt-1 w-60">
|
||||
<li>
|
||||
|
|
@ -213,9 +217,9 @@ export default function Dashboard() {
|
|||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-linkwarden-file"
|
||||
title="JSON File"
|
||||
title={t("from_linkwarden")}
|
||||
>
|
||||
From Linkwarden
|
||||
{t("from_linkwarden")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -233,9 +237,9 @@ export default function Dashboard() {
|
|||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-html-file"
|
||||
title="HTML File"
|
||||
title={t("from_html")}
|
||||
>
|
||||
From Bookmarks HTML file
|
||||
{t("from_html")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -248,6 +252,26 @@ export default function Dashboard() {
|
|||
/>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label
|
||||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-wallabag-file"
|
||||
title={t("from_wallabag")}
|
||||
>
|
||||
{t("from_wallabag")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
id="import-wallabag-file"
|
||||
accept=".json"
|
||||
className="hidden"
|
||||
onChange={(e) =>
|
||||
importBookmarks(e, MigrationFormat.wallabag)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -259,15 +283,15 @@ export default function Dashboard() {
|
|||
<div className="flex gap-2 items-center">
|
||||
<PageHeader
|
||||
icon={"bi-pin-angle"}
|
||||
title={"Pinned"}
|
||||
description={"Your pinned Links"}
|
||||
title={t("pinned")}
|
||||
description={t("pinned_links_desc")}
|
||||
/>
|
||||
</div>
|
||||
<Link
|
||||
href="/links/pinned"
|
||||
className="flex items-center text-sm text-black/75 dark:text-white/75 gap-2 cursor-pointer"
|
||||
>
|
||||
View All
|
||||
{t("view_all")}
|
||||
<i className="bi-chevron-right text-sm "></i>
|
||||
</Link>
|
||||
</div>
|
||||
|
|
@ -291,12 +315,10 @@ export default function Dashboard() {
|
|||
>
|
||||
<i className="bi-pin mx-auto text-6xl text-primary"></i>
|
||||
<p className="text-center text-2xl">
|
||||
Pin Your Favorite Links Here!
|
||||
{t("pin_favorite_links_here")}
|
||||
</p>
|
||||
<p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm">
|
||||
You can Pin your favorite Links by clicking on the three dots on
|
||||
each Link and clicking{" "}
|
||||
<span className="font-semibold">Pin to Dashboard</span>.
|
||||
{t("pin_favorite_links_here_desc")}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
|
@ -308,3 +330,5 @@ export default function Dashboard() {
|
|||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -4,12 +4,15 @@ import CenteredForm from "@/layouts/CenteredForm";
|
|||
import Link from "next/link";
|
||||
import { FormEvent, useState } from "react";
|
||||
import { toast } from "react-hot-toast";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
interface FormData {
|
||||
email: string;
|
||||
}
|
||||
|
||||
export default function Forgot() {
|
||||
const { t } = useTranslation();
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const [form, setForm] = useState<FormData>({
|
||||
|
|
@ -43,7 +46,7 @@ export default function Forgot() {
|
|||
if (form.email !== "") {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Sending password recovery link...");
|
||||
const load = toast.loading(t("sending_password_link"));
|
||||
|
||||
await submitRequest();
|
||||
|
||||
|
|
@ -51,7 +54,7 @@ export default function Forgot() {
|
|||
|
||||
setSubmitLoader(false);
|
||||
} else {
|
||||
toast.error("Please fill out all the fields.");
|
||||
toast.error(t("fill_all_fields"));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -60,7 +63,7 @@ export default function Forgot() {
|
|||
<form onSubmit={sendConfirmation}>
|
||||
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
|
||||
<p className="text-3xl text-center font-extralight">
|
||||
{isEmailSent ? "Email Sent!" : "Forgot Password?"}
|
||||
{isEmailSent ? t("email_sent") : t("forgot_password")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-0"></div>
|
||||
|
|
@ -68,13 +71,10 @@ export default function Forgot() {
|
|||
{!isEmailSent ? (
|
||||
<>
|
||||
<div>
|
||||
<p>
|
||||
Enter your email so we can send you a link to create a new
|
||||
password.
|
||||
</p>
|
||||
<p>{t("password_email_prompt")}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm w-fit font-semibold mb-1">Email</p>
|
||||
<p className="text-sm w-fit font-semibold mb-1">{t("email")}</p>
|
||||
|
||||
<TextInput
|
||||
autoFocus
|
||||
|
|
@ -93,19 +93,16 @@ export default function Forgot() {
|
|||
size="full"
|
||||
loading={submitLoader}
|
||||
>
|
||||
Send Login Link
|
||||
{t("send_reset_link")}
|
||||
</AccentSubmitButton>
|
||||
</>
|
||||
) : (
|
||||
<p>
|
||||
Check your email for a link to reset your password. If it doesn’t
|
||||
appear within a few minutes, check your spam folder.
|
||||
</p>
|
||||
<p>{t("reset_email_sent_desc")}</p>
|
||||
)}
|
||||
|
||||
<div className="mx-auto w-fit mt-2">
|
||||
<Link className="font-semibold" href="/login">
|
||||
Back to Login
|
||||
{t("back_to_login")}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -113,3 +110,5 @@ export default function Forgot() {
|
|||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,24 +1,21 @@
|
|||
import NoLinksFound from "@/components/NoLinksFound";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import useLinkStore from "@/store/links";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import PageHeader from "@/components/PageHeader";
|
||||
import { Member, Sort, ViewMode } from "@/types/global";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import { Sort, ViewMode } from "@/types/global";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import useCollectivePermissions from "@/hooks/useCollectivePermissions";
|
||||
import toast from "react-hot-toast";
|
||||
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
|
||||
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
|
||||
import { useRouter } from "next/router";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
export default function Links() {
|
||||
const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
|
||||
useLinkStore();
|
||||
const { t } = useTranslation();
|
||||
const { links } = useLinkStore();
|
||||
|
||||
const [viewMode, setViewMode] = useState<string>(
|
||||
localStorage.getItem("viewMode") || ViewMode.Card
|
||||
|
|
@ -27,49 +24,14 @@ export default function Links() {
|
|||
|
||||
const router = useRouter();
|
||||
|
||||
const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
|
||||
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
|
||||
const [editMode, setEditMode] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (editMode) return setEditMode(false);
|
||||
}, [router]);
|
||||
|
||||
const collectivePermissions = useCollectivePermissions(
|
||||
selectedLinks.map((link) => link.collectionId as number)
|
||||
);
|
||||
|
||||
useLinks({ sort: sortBy });
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(
|
||||
`Deleting ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}...`
|
||||
);
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
`Deleted ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}!`
|
||||
);
|
||||
};
|
||||
|
||||
const linkView = {
|
||||
[ViewMode.Card]: CardView,
|
||||
[ViewMode.List]: ListView,
|
||||
|
|
@ -82,113 +44,30 @@ export default function Links() {
|
|||
return (
|
||||
<MainLayout>
|
||||
<div className="p-5 flex flex-col gap-5 w-full h-full">
|
||||
<div className="flex justify-between">
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
editMode={editMode}
|
||||
setEditMode={setEditMode}
|
||||
>
|
||||
<PageHeader
|
||||
icon={"bi-link-45deg"}
|
||||
title={"All Links"}
|
||||
description={"Links from every Collections"}
|
||||
title={t("all_links")}
|
||||
description={t("all_links_desc")}
|
||||
/>
|
||||
|
||||
<div className="mt-2 flex items-center justify-end gap-2">
|
||||
{links.length > 0 && (
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
)}
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length}{" "}
|
||||
{selectedLinks.length === 1 ? "link" : "links"} selected
|
||||
</span>
|
||||
) : (
|
||||
<span>Nothing selected</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canUpdate
|
||||
)
|
||||
}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey
|
||||
? bulkDeleteLinks()
|
||||
: setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canDelete
|
||||
)
|
||||
}
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</LinkListOptions>
|
||||
|
||||
{links[0] ? (
|
||||
<LinkComponent editMode={editMode} links={links} />
|
||||
) : (
|
||||
<NoLinksFound text="You Haven't Created Any Links Yet" />
|
||||
<NoLinksFound text={t("you_have_not_added_any_links")} />
|
||||
)}
|
||||
</div>
|
||||
{bulkDeleteLinksModal && (
|
||||
<BulkDeleteLinksModal
|
||||
onClose={() => {
|
||||
setBulkDeleteLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{bulkEditLinksModal && (
|
||||
<BulkEditLinksModal
|
||||
onClose={() => {
|
||||
setBulkEditLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,23 +1,21 @@
|
|||
import SortDropdown from "@/components/SortDropdown";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import useLinkStore from "@/store/links";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import PageHeader from "@/components/PageHeader";
|
||||
import { Sort, ViewMode } from "@/types/global";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
|
||||
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
|
||||
import useCollectivePermissions from "@/hooks/useCollectivePermissions";
|
||||
import toast from "react-hot-toast";
|
||||
import { useRouter } from "next/router";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
|
||||
export default function PinnedLinks() {
|
||||
const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
|
||||
useLinkStore();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { links } = useLinkStore();
|
||||
|
||||
const [viewMode, setViewMode] = useState<string>(
|
||||
localStorage.getItem("viewMode") || ViewMode.Card
|
||||
|
|
@ -27,47 +25,12 @@ export default function PinnedLinks() {
|
|||
useLinks({ sort: sortBy, pinnedOnly: true });
|
||||
|
||||
const router = useRouter();
|
||||
const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
|
||||
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
|
||||
const [editMode, setEditMode] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (editMode) return setEditMode(false);
|
||||
}, [router]);
|
||||
|
||||
const collectivePermissions = useCollectivePermissions(
|
||||
selectedLinks.map((link) => link.collectionId as number)
|
||||
);
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(
|
||||
`Deleting ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}...`
|
||||
);
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
`Deleted ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}!`
|
||||
);
|
||||
};
|
||||
|
||||
const linkView = {
|
||||
[ViewMode.Card]: CardView,
|
||||
[ViewMode.List]: ListView,
|
||||
|
|
@ -80,91 +43,21 @@ export default function PinnedLinks() {
|
|||
return (
|
||||
<MainLayout>
|
||||
<div className="p-5 flex flex-col gap-5 w-full h-full">
|
||||
<div className="flex justify-between">
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
editMode={editMode}
|
||||
setEditMode={setEditMode}
|
||||
>
|
||||
<PageHeader
|
||||
icon={"bi-pin-angle"}
|
||||
title={"Pinned Links"}
|
||||
description={"Pinned Links from your Collections"}
|
||||
title={t("pinned")}
|
||||
description={t("pinned_links_desc")}
|
||||
/>
|
||||
<div className="mt-2 flex items-center justify-end gap-2">
|
||||
{!(links.length === 0) && (
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
)}
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length}{" "}
|
||||
{selectedLinks.length === 1 ? "link" : "links"} selected
|
||||
</span>
|
||||
) : (
|
||||
<span>Nothing selected</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canUpdate
|
||||
)
|
||||
}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey
|
||||
? bulkDeleteLinks()
|
||||
: setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canDelete
|
||||
)
|
||||
}
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</LinkListOptions>
|
||||
|
||||
{links.some((e) => e.pinnedBy && e.pinnedBy[0]) ? (
|
||||
<LinkComponent editMode={editMode} links={links} />
|
||||
|
|
@ -182,30 +75,16 @@ export default function PinnedLinks() {
|
|||
<path d="M4.146.146A.5.5 0 0 1 4.5 0h7a.5.5 0 0 1 .5.5c0 .68-.342 1.174-.646 1.479-.126.125-.25.224-.354.298v4.431l.078.048c.203.127.476.314.751.555C12.36 7.775 13 8.527 13 9.5a.5.5 0 0 1-.5.5h-4v4.5c0 .276-.224 1.5-.5 1.5s-.5-1.224-.5-1.5V10h-4a.5.5 0 0 1-.5-.5c0-.973.64-1.725 1.17-2.189A6 6 0 0 1 5 6.708V2.277a3 3 0 0 1-.354-.298C4.342 1.674 4 1.179 4 .5a.5.5 0 0 1 .146-.354m1.58 1.408-.002-.001zm-.002-.001.002.001A.5.5 0 0 1 6 2v5a.5.5 0 0 1-.276.447h-.002l-.012.007-.054.03a5 5 0 0 0-.827.58c-.318.278-.585.596-.725.936h7.792c-.14-.34-.407-.658-.725-.936a5 5 0 0 0-.881-.61l-.012-.006h-.002A.5.5 0 0 1 10 7V2a.5.5 0 0 1 .295-.458 1.8 1.8 0 0 0 .351-.271c.08-.08.155-.17.214-.271H5.14q.091.15.214.271a1.8 1.8 0 0 0 .37.282" />
|
||||
</svg>
|
||||
<p className="text-center text-2xl">
|
||||
Pin Your Favorite Links Here!
|
||||
{t("pin_favorite_links_here")}
|
||||
</p>
|
||||
<p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm">
|
||||
You can Pin your favorite Links by clicking on the three dots on
|
||||
each Link and clicking{" "}
|
||||
<span className="font-semibold">Pin to Dashboard</span>.
|
||||
{t("pin_favorite_links_here_desc")}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{bulkDeleteLinksModal && (
|
||||
<BulkDeleteLinksModal
|
||||
onClose={() => {
|
||||
setBulkDeleteLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{bulkEditLinksModal && (
|
||||
<BulkEditLinksModal
|
||||
onClose={() => {
|
||||
setBulkEditLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
120
pages/login.tsx
120
pages/login.tsx
|
|
@ -6,22 +6,27 @@ import Link from "next/link";
|
|||
import React, { useState, FormEvent } from "react";
|
||||
import { toast } from "react-hot-toast";
|
||||
import { getLogins } from "./api/v1/logins";
|
||||
import { InferGetServerSidePropsType } from "next";
|
||||
import { GetServerSideProps, InferGetServerSidePropsType } from "next";
|
||||
import InstallApp from "@/components/InstallApp";
|
||||
import { serverSideTranslations } from "next-i18next/serverSideTranslations";
|
||||
import { i18n } from "next-i18next.config";
|
||||
import { getToken } from "next-auth/jwt";
|
||||
import { prisma } from "@/lib/api/db";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
interface FormData {
|
||||
username: string;
|
||||
password: string;
|
||||
}
|
||||
|
||||
export const getServerSideProps = () => {
|
||||
const availableLogins = getLogins();
|
||||
return { props: { availableLogins } };
|
||||
};
|
||||
|
||||
export default function Login({
|
||||
availableLogins,
|
||||
}: InferGetServerSidePropsType<typeof getServerSideProps>) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const [form, setForm] = useState<FormData>({
|
||||
|
|
@ -35,7 +40,7 @@ export default function Login({
|
|||
if (form.username !== "" && form.password !== "") {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Authenticating...");
|
||||
const load = toast.loading(t("authenticating"));
|
||||
|
||||
const res = await signIn("credentials", {
|
||||
username: form.username,
|
||||
|
|
@ -48,17 +53,29 @@ export default function Login({
|
|||
setSubmitLoader(false);
|
||||
|
||||
if (!res?.ok) {
|
||||
toast.error(res?.error || "Invalid credentials.");
|
||||
toast.error(res?.error || t("invalid_credentials"));
|
||||
|
||||
if (res?.error === "Email not verified.") {
|
||||
await signIn("email", {
|
||||
email: form.username,
|
||||
callbackUrl: "/",
|
||||
redirect: false,
|
||||
});
|
||||
|
||||
router.push(
|
||||
`/confirmation?email=${encodeURIComponent(form.username)}`
|
||||
);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
toast.error("Please fill out all the fields.");
|
||||
toast.error(t("fill_all_fields"));
|
||||
}
|
||||
}
|
||||
|
||||
async function loginUserButton(method: string) {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Authenticating...");
|
||||
const load = toast.loading(t("authenticating"));
|
||||
|
||||
const res = await signIn(method, {});
|
||||
|
||||
|
|
@ -72,15 +89,14 @@ export default function Login({
|
|||
return (
|
||||
<>
|
||||
<p className="text-3xl text-black dark:text-white text-center font-extralight">
|
||||
Enter your credentials
|
||||
{t("enter_credentials")}
|
||||
</p>
|
||||
<hr className="border-1 border-sky-100 dark:border-neutral-700" />
|
||||
<div>
|
||||
<p className="text-sm text-black dark:text-white w-fit font-semibold mb-1">
|
||||
Username
|
||||
{availableLogins.emailEnabled === "true"
|
||||
? " or Email"
|
||||
: undefined}
|
||||
? t("username_or_email")
|
||||
: t("username")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
|
|
@ -94,7 +110,7 @@ export default function Login({
|
|||
</div>
|
||||
<div className="w-full">
|
||||
<p className="text-sm text-black dark:text-white w-fit font-semibold mb-1">
|
||||
Password
|
||||
{t("password")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
|
|
@ -112,7 +128,7 @@ export default function Login({
|
|||
className="text-neutral font-semibold"
|
||||
data-testid="forgot-password-link"
|
||||
>
|
||||
Forgot Password?
|
||||
{t("forgot_password")}
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
|
|
@ -124,11 +140,11 @@ export default function Login({
|
|||
data-testid="submit-login-button"
|
||||
loading={submitLoader}
|
||||
>
|
||||
Login
|
||||
{t("login")}
|
||||
</AccentSubmitButton>
|
||||
|
||||
{availableLogins.buttonAuths.length > 0 ? (
|
||||
<div className="divider my-1">Or continue with</div>
|
||||
<div className="divider my-1">{t("or_continue_with")}</div>
|
||||
) : undefined}
|
||||
</>
|
||||
);
|
||||
|
|
@ -137,11 +153,9 @@ export default function Login({
|
|||
|
||||
function displayLoginExternalButton() {
|
||||
const Buttons: any = [];
|
||||
availableLogins.buttonAuths.forEach((value, index) => {
|
||||
availableLogins.buttonAuths.forEach((value: any, index: any) => {
|
||||
Buttons.push(
|
||||
<React.Fragment key={index}>
|
||||
{index !== 0 ? <div className="divider my-1">Or</div> : undefined}
|
||||
|
||||
<AccentSubmitButton
|
||||
type="button"
|
||||
onClick={() => loginUserButton(value.method)}
|
||||
|
|
@ -165,13 +179,15 @@ export default function Login({
|
|||
if (availableLogins.registrationDisabled !== "true") {
|
||||
return (
|
||||
<div className="flex items-baseline gap-1 justify-center">
|
||||
<p className="w-fit text-gray-500 dark:text-gray-400">New here?</p>
|
||||
<p className="w-fit text-gray-500 dark:text-gray-400">
|
||||
{t("new_here")}
|
||||
</p>
|
||||
<Link
|
||||
href={"/register"}
|
||||
className="font-semibold"
|
||||
data-testid="register-link"
|
||||
>
|
||||
Sign Up
|
||||
{t("sign_up")}
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
|
|
@ -179,7 +195,7 @@ export default function Login({
|
|||
}
|
||||
|
||||
return (
|
||||
<CenteredForm text="Sign in to your account">
|
||||
<CenteredForm text={t("sign_in_to_your_account")}>
|
||||
<form onSubmit={loginUser}>
|
||||
<div
|
||||
className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-sky-100 dark:border-neutral-700"
|
||||
|
|
@ -194,3 +210,59 @@ export default function Login({
|
|||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
const getServerSideProps: GetServerSideProps = async (ctx) => {
|
||||
const availableLogins = getLogins();
|
||||
|
||||
const acceptLanguageHeader = ctx.req.headers["accept-language"];
|
||||
const availableLanguages = i18n.locales;
|
||||
|
||||
const token = await getToken({ req: ctx.req });
|
||||
|
||||
if (token) {
|
||||
const user = await prisma.user.findUnique({
|
||||
where: {
|
||||
id: token.id,
|
||||
},
|
||||
});
|
||||
|
||||
if (user) {
|
||||
return {
|
||||
props: {
|
||||
availableLogins,
|
||||
...(await serverSideTranslations(user.locale ?? "en", ["common"])),
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
const acceptedLanguages = acceptLanguageHeader
|
||||
?.split(",")
|
||||
.map((lang) => lang.split(";")[0]);
|
||||
|
||||
let bestMatch = acceptedLanguages?.find((lang) =>
|
||||
availableLanguages.includes(lang)
|
||||
);
|
||||
|
||||
if (!bestMatch) {
|
||||
acceptedLanguages?.some((acceptedLang) => {
|
||||
const partialMatch = availableLanguages.find((lang) =>
|
||||
lang.startsWith(acceptedLang)
|
||||
);
|
||||
if (partialMatch) {
|
||||
bestMatch = partialMatch;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
props: {
|
||||
availableLogins,
|
||||
...(await serverSideTranslations(bestMatch ?? "en", ["common"])),
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import {
|
|||
} from "@/types/global";
|
||||
import { useRouter } from "next/router";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { motion, Variants } from "framer-motion";
|
||||
import Head from "next/head";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import useLinkStore from "@/store/links";
|
||||
|
|
@ -16,35 +15,25 @@ import ToggleDarkMode from "@/components/ToggleDarkMode";
|
|||
import getPublicUserData from "@/lib/client/getPublicUserData";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import FilterSearchDropdown from "@/components/FilterSearchDropdown";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import useLocalSettingsStore from "@/store/localSettings";
|
||||
import SearchBar from "@/components/SearchBar";
|
||||
import EditCollectionSharingModal from "@/components/ModalContent/EditCollectionSharingModal";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
|
||||
const cardVariants: Variants = {
|
||||
offscreen: {
|
||||
y: 50,
|
||||
opacity: 0,
|
||||
},
|
||||
onscreen: {
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
transition: {
|
||||
duration: 0.4,
|
||||
},
|
||||
},
|
||||
};
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import useCollectionStore from "@/store/collections";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
|
||||
export default function PublicCollections() {
|
||||
const { t } = useTranslation();
|
||||
const { links } = useLinkStore();
|
||||
|
||||
const { settings } = useLocalSettingsStore();
|
||||
|
||||
const { collections } = useCollectionStore();
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const [collectionOwner, setCollectionOwner] = useState({
|
||||
|
|
@ -85,7 +74,7 @@ export default function PublicCollections() {
|
|||
if (router.query.id) {
|
||||
getPublicCollectionData(Number(router.query.id), setCollection);
|
||||
}
|
||||
}, []);
|
||||
}, [collections]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchOwner = async () => {
|
||||
|
|
@ -147,7 +136,7 @@ export default function PublicCollections() {
|
|||
width={551}
|
||||
height={551}
|
||||
alt="Linkwarden"
|
||||
title="Created with Linkwarden"
|
||||
title={t("list_created_with_linkwarden")}
|
||||
className="h-8 w-fit mx-auto rounded"
|
||||
/>
|
||||
</Link>
|
||||
|
|
@ -189,12 +178,22 @@ export default function PublicCollections() {
|
|||
) : null}
|
||||
</div>
|
||||
|
||||
<p className="text-neutral text-sm font-semibold">
|
||||
By {collectionOwner.name}
|
||||
{collection.members.length > 0
|
||||
? ` and ${collection.members.length} others`
|
||||
: undefined}
|
||||
.
|
||||
<p className="text-neutral text-sm">
|
||||
{collection.members.length > 0 &&
|
||||
collection.members.length === 1
|
||||
? 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,
|
||||
count: collection.members.length,
|
||||
})
|
||||
: t("by_author", {
|
||||
author: collectionOwner.name,
|
||||
})}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -205,22 +204,27 @@ export default function PublicCollections() {
|
|||
<div className="divider mt-5 mb-0"></div>
|
||||
|
||||
<div className="flex mb-5 mt-10 flex-col gap-5">
|
||||
<div className="flex justify-between gap-3">
|
||||
<SearchBar
|
||||
placeholder={`Search ${collection._count?.links} Links`}
|
||||
/>
|
||||
|
||||
<div className="flex gap-2 items-center w-fit">
|
||||
<FilterSearchDropdown
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
searchFilter={searchFilter}
|
||||
setSearchFilter={setSearchFilter}
|
||||
>
|
||||
<SearchBar
|
||||
placeholder={
|
||||
collection._count?.links === 1
|
||||
? t("search_count_link", {
|
||||
count: collection._count?.links,
|
||||
})
|
||||
: t("search_count_links", {
|
||||
count: collection._count?.links,
|
||||
})
|
||||
}
|
||||
/>
|
||||
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
</LinkListOptions>
|
||||
|
||||
{links[0] ? (
|
||||
<LinkComponent
|
||||
|
|
@ -235,7 +239,7 @@ export default function PublicCollections() {
|
|||
})}
|
||||
/>
|
||||
) : (
|
||||
<p>This collection is empty...</p>
|
||||
<p>{t("collection_is_empty")}</p>
|
||||
)}
|
||||
|
||||
{/* <p className="text-center text-neutral">
|
||||
|
|
@ -254,3 +258,5 @@ export default function PublicCollections() {
|
|||
<></>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -7,7 +7,12 @@ import CenteredForm from "@/layouts/CenteredForm";
|
|||
import TextInput from "@/components/TextInput";
|
||||
import AccentSubmitButton from "@/components/ui/Button";
|
||||
import { getLogins } from "./api/v1/logins";
|
||||
import { InferGetServerSidePropsType } from "next";
|
||||
import { GetServerSideProps, InferGetServerSidePropsType } from "next";
|
||||
import { getToken } from "next-auth/jwt";
|
||||
import { prisma } from "@/lib/api/db";
|
||||
import { serverSideTranslations } from "next-i18next/serverSideTranslations";
|
||||
import { i18n } from "next-i18next.config";
|
||||
import { Trans, useTranslation } from "next-i18next";
|
||||
|
||||
const emailEnabled = process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true";
|
||||
|
||||
|
|
@ -19,14 +24,10 @@ type FormData = {
|
|||
passwordConfirmation: string;
|
||||
};
|
||||
|
||||
export const getServerSideProps = () => {
|
||||
const availableLogins = getLogins();
|
||||
return { props: { availableLogins } };
|
||||
};
|
||||
|
||||
export default function Register({
|
||||
availableLogins,
|
||||
}: InferGetServerSidePropsType<typeof getServerSideProps>) {
|
||||
const { t } = useTranslation();
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
const router = useRouter();
|
||||
|
||||
|
|
@ -62,14 +63,14 @@ export default function Register({
|
|||
|
||||
if (checkFields()) {
|
||||
if (form.password !== form.passwordConfirmation)
|
||||
return toast.error("Passwords do not match.");
|
||||
return toast.error(t("passwords_mismatch"));
|
||||
else if (form.password.length < 8)
|
||||
return toast.error("Passwords must be at least 8 characters.");
|
||||
return toast.error(t("password_too_short"));
|
||||
const { passwordConfirmation, ...request } = form;
|
||||
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Creating Account...");
|
||||
const load = toast.loading(t("creating_account"));
|
||||
|
||||
const response = await fetch("/api/v1/users", {
|
||||
body: JSON.stringify(request),
|
||||
|
|
@ -97,12 +98,12 @@ export default function Register({
|
|||
);
|
||||
} else if (!emailEnabled) router.push("/login");
|
||||
|
||||
toast.success("User Created!");
|
||||
toast.success(t("account_created"));
|
||||
} else {
|
||||
toast.error(data.response);
|
||||
}
|
||||
} else {
|
||||
toast.error("Please fill out all the fields.");
|
||||
toast.error(t("fill_all_fields"));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -110,7 +111,7 @@ export default function Register({
|
|||
async function loginUserButton(method: string) {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Authenticating...");
|
||||
const load = toast.loading(t("authenticating"));
|
||||
|
||||
const res = await signIn(method, {});
|
||||
|
||||
|
|
@ -121,11 +122,9 @@ export default function Register({
|
|||
|
||||
function displayLoginExternalButton() {
|
||||
const Buttons: any = [];
|
||||
availableLogins.buttonAuths.forEach((value, index) => {
|
||||
availableLogins.buttonAuths.forEach((value: any, index: any) => {
|
||||
Buttons.push(
|
||||
<React.Fragment key={index}>
|
||||
{index !== 0 ? <div className="divider my-1">Or</div> : undefined}
|
||||
|
||||
<AccentSubmitButton
|
||||
type="button"
|
||||
onClick={() => loginUserButton(value.method)}
|
||||
|
|
@ -149,31 +148,30 @@ export default function Register({
|
|||
<CenteredForm
|
||||
text={
|
||||
process.env.NEXT_PUBLIC_STRIPE
|
||||
? `Unlock ${
|
||||
process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14
|
||||
} days of Premium Service at no cost!`
|
||||
: "Create a new account"
|
||||
? t("trial_offer_desc", {
|
||||
count: Number(process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14),
|
||||
})
|
||||
: t("register_desc")
|
||||
}
|
||||
data-testid="registration-form"
|
||||
>
|
||||
{process.env.NEXT_PUBLIC_DISABLE_REGISTRATION === "true" ? (
|
||||
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
|
||||
<p>
|
||||
Registration is disabled for this instance, please contact the admin
|
||||
in case of any issues.
|
||||
</p>
|
||||
<p>{t("registration_disabled")}</p>
|
||||
</div>
|
||||
) : (
|
||||
<form onSubmit={registerUser}>
|
||||
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full mx-auto bg-base-200 rounded-2xl shadow-md border border-neutral-content">
|
||||
<p className="text-3xl text-center font-extralight">
|
||||
Enter your details
|
||||
{t("enter_details")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-0"></div>
|
||||
|
||||
<div>
|
||||
<p className="text-sm w-fit font-semibold mb-1">Display Name</p>
|
||||
<p className="text-sm w-fit font-semibold mb-1">
|
||||
{t("display_name")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
autoFocus={true}
|
||||
|
|
@ -187,7 +185,9 @@ export default function Register({
|
|||
|
||||
{emailEnabled ? undefined : (
|
||||
<div>
|
||||
<p className="text-sm w-fit font-semibold mb-1">Username</p>
|
||||
<p className="text-sm w-fit font-semibold mb-1">
|
||||
{t("username")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
placeholder="john"
|
||||
|
|
@ -203,7 +203,7 @@ export default function Register({
|
|||
|
||||
{emailEnabled ? (
|
||||
<div>
|
||||
<p className="text-sm w-fit font-semibold mb-1">Email</p>
|
||||
<p className="text-sm w-fit font-semibold mb-1">{t("email")}</p>
|
||||
|
||||
<TextInput
|
||||
type="email"
|
||||
|
|
@ -217,7 +217,9 @@ export default function Register({
|
|||
) : undefined}
|
||||
|
||||
<div className="w-full">
|
||||
<p className="text-sm w-fit font-semibold mb-1">Password</p>
|
||||
<p className="text-sm w-fit font-semibold mb-1">
|
||||
{t("password")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
type="password"
|
||||
|
|
@ -231,7 +233,7 @@ export default function Register({
|
|||
|
||||
<div className="w-full">
|
||||
<p className="text-sm w-fit font-semibold mb-1">
|
||||
Confirm Password
|
||||
{t("confirm_password")}
|
||||
</p>
|
||||
|
||||
<TextInput
|
||||
|
|
@ -247,36 +249,27 @@ export default function Register({
|
|||
</div>
|
||||
|
||||
{process.env.NEXT_PUBLIC_STRIPE ? (
|
||||
<div>
|
||||
<p className="text-xs text-neutral">
|
||||
By signing up, you agree to our{" "}
|
||||
<div className="text-xs text-neutral mb-3">
|
||||
<p>
|
||||
<Trans
|
||||
i18nKey="sign_up_agreement"
|
||||
components={[
|
||||
<Link
|
||||
href="https://linkwarden.app/tos"
|
||||
className="font-semibold underline"
|
||||
className="font-semibold"
|
||||
data-testid="terms-of-service-link"
|
||||
>
|
||||
Terms of Service
|
||||
</Link>{" "}
|
||||
and{" "}
|
||||
Terms of Services
|
||||
</Link>,
|
||||
<Link
|
||||
href="https://linkwarden.app/privacy-policy"
|
||||
className="font-semibold underline"
|
||||
className="font-semibold"
|
||||
data-testid="privacy-policy-link"
|
||||
>
|
||||
Privacy Policy
|
||||
</Link>
|
||||
.
|
||||
</p>
|
||||
<p className="text-xs text-neutral">
|
||||
Need help?{" "}
|
||||
<Link
|
||||
href="mailto:support@linkwarden.app"
|
||||
className="font-semibold underline"
|
||||
data-testid="support-link"
|
||||
>
|
||||
Get in touch
|
||||
</Link>
|
||||
.
|
||||
</Link>,
|
||||
]}
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
) : undefined}
|
||||
|
|
@ -288,27 +281,97 @@ export default function Register({
|
|||
size="full"
|
||||
data-testid="register-button"
|
||||
>
|
||||
Sign Up
|
||||
{t("sign_up")}
|
||||
</AccentSubmitButton>
|
||||
|
||||
{availableLogins.buttonAuths.length > 0 ? (
|
||||
<div className="divider my-1">Or continue with</div>
|
||||
<div className="divider my-1">{t("or_continue_with")}</div>
|
||||
) : undefined}
|
||||
|
||||
{displayLoginExternalButton()}
|
||||
<div className="flex items-baseline gap-1 justify-center">
|
||||
<p className="w-fit text-neutral">Already have an account?</p>
|
||||
<div>
|
||||
<div className="text-neutral text-center flex items-baseline gap-1 justify-center">
|
||||
<p className="w-fit text-neutral">{t("already_registered")}</p>
|
||||
<Link
|
||||
href={"/login"}
|
||||
className="block font-bold"
|
||||
className="font-bold text-base-content"
|
||||
data-testid="login-link"
|
||||
>
|
||||
Login
|
||||
{t("login")}
|
||||
</Link>
|
||||
</div>
|
||||
{process.env.NEXT_PUBLIC_STRIPE ? (
|
||||
<div className="text-neutral text-center flex items-baseline gap-1 justify-center">
|
||||
<p>{t("need_help")}</p>
|
||||
<Link
|
||||
href="mailto:support@linkwarden.app"
|
||||
className="font-bold text-base-content"
|
||||
data-testid="support-link"
|
||||
>
|
||||
{t("get_in_touch")}
|
||||
</Link>
|
||||
</div>
|
||||
) : undefined}
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
)}
|
||||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
const getServerSideProps: GetServerSideProps = async (ctx) => {
|
||||
const availableLogins = getLogins();
|
||||
|
||||
const acceptLanguageHeader = ctx.req.headers["accept-language"];
|
||||
const availableLanguages = i18n.locales;
|
||||
|
||||
const token = await getToken({ req: ctx.req });
|
||||
|
||||
if (token) {
|
||||
const user = await prisma.user.findUnique({
|
||||
where: {
|
||||
id: token.id,
|
||||
},
|
||||
});
|
||||
|
||||
if (user) {
|
||||
return {
|
||||
props: {
|
||||
availableLogins,
|
||||
...(await serverSideTranslations(user.locale ?? "en", ["common"])),
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
const acceptedLanguages = acceptLanguageHeader
|
||||
?.split(",")
|
||||
.map((lang) => lang.split(";")[0]);
|
||||
|
||||
let bestMatch = acceptedLanguages?.find((lang) =>
|
||||
availableLanguages.includes(lang)
|
||||
);
|
||||
|
||||
if (!bestMatch) {
|
||||
acceptedLanguages?.some((acceptedLang) => {
|
||||
const partialMatch = availableLanguages.find((lang) =>
|
||||
lang.startsWith(acceptedLang)
|
||||
);
|
||||
if (partialMatch) {
|
||||
bestMatch = partialMatch;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
props: {
|
||||
availableLogins,
|
||||
...(await serverSideTranslations(bestMatch ?? "en", ["common"])),
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
172
pages/search.tsx
172
pages/search.tsx
|
|
@ -1,25 +1,22 @@
|
|||
import FilterSearchDropdown from "@/components/FilterSearchDropdown";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import useLinkStore from "@/store/links";
|
||||
import { Sort, ViewMode } from "@/types/global";
|
||||
import { useRouter } from "next/router";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import PageHeader from "@/components/PageHeader";
|
||||
import { GridLoader } from "react-spinners";
|
||||
import useCollectivePermissions from "@/hooks/useCollectivePermissions";
|
||||
import toast from "react-hot-toast";
|
||||
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
|
||||
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
export default function Search() {
|
||||
const { links, selectedLinks, setSelectedLinks, deleteLinksById } =
|
||||
useLinkStore();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { links } = useLinkStore();
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
@ -37,47 +34,12 @@ export default function Search() {
|
|||
|
||||
const [sortBy, setSortBy] = useState<Sort>(Sort.DateNewestFirst);
|
||||
|
||||
const [bulkDeleteLinksModal, setBulkDeleteLinksModal] = useState(false);
|
||||
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
|
||||
const [editMode, setEditMode] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (editMode) return setEditMode(false);
|
||||
}, [router]);
|
||||
|
||||
const collectivePermissions = useCollectivePermissions(
|
||||
selectedLinks.map((link) => link.collectionId as number)
|
||||
);
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(
|
||||
`Deleting ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}...`
|
||||
);
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
`Deleted ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}!`
|
||||
);
|
||||
};
|
||||
|
||||
const { isLoading } = useLinks({
|
||||
sort: sortBy,
|
||||
searchQueryString: decodeURIComponent(router.query.q as string),
|
||||
|
|
@ -88,10 +50,6 @@ export default function Search() {
|
|||
searchByTags: searchFilter.tags,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
console.log("isLoading", isLoading);
|
||||
}, [isLoading]);
|
||||
|
||||
const linkView = {
|
||||
[ViewMode.Card]: CardView,
|
||||
[ViewMode.List]: ListView,
|
||||
|
|
@ -104,102 +62,22 @@ export default function Search() {
|
|||
return (
|
||||
<MainLayout>
|
||||
<div className="p-5 flex flex-col gap-5 w-full h-full">
|
||||
<div className="flex justify-between">
|
||||
<PageHeader icon={"bi-search"} title={"Search Results"} />
|
||||
|
||||
<div className="flex gap-3 items-center justify-end">
|
||||
<div className="flex gap-2 items-center mt-2">
|
||||
{links.length > 0 && (
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
)}
|
||||
<FilterSearchDropdown
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
searchFilter={searchFilter}
|
||||
setSearchFilter={setSearchFilter}
|
||||
/>
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length}{" "}
|
||||
{selectedLinks.length === 1 ? "link" : "links"} selected
|
||||
</span>
|
||||
) : (
|
||||
<span>Nothing selected</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canUpdate
|
||||
)
|
||||
}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
editMode={editMode}
|
||||
setEditMode={setEditMode}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey
|
||||
? bulkDeleteLinks()
|
||||
: setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canDelete
|
||||
)
|
||||
}
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<PageHeader icon={"bi-search"} title={"Search Results"} />
|
||||
</LinkListOptions>
|
||||
|
||||
{!isLoading && !links[0] ? (
|
||||
<p>
|
||||
Nothing found.{" "}
|
||||
<span className="font-bold text-xl" title="Shruggie">
|
||||
¯\_(ツ)_/¯
|
||||
</span>
|
||||
</p>
|
||||
<p>{t("nothing_found")}</p>
|
||||
) : links[0] ? (
|
||||
<LinkComponent
|
||||
editMode={editMode}
|
||||
|
|
@ -217,20 +95,8 @@ export default function Search() {
|
|||
)
|
||||
)}
|
||||
</div>
|
||||
{bulkDeleteLinksModal && (
|
||||
<BulkDeleteLinksModal
|
||||
onClose={() => {
|
||||
setBulkDeleteLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{bulkEditLinksModal && (
|
||||
<BulkEditLinksModal
|
||||
onClose={() => {
|
||||
setBulkEditLinksModal(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -4,11 +4,14 @@ import NewTokenModal from "@/components/ModalContent/NewTokenModal";
|
|||
import RevokeTokenModal from "@/components/ModalContent/RevokeTokenModal";
|
||||
import { AccessToken } from "@prisma/client";
|
||||
import useTokenStore from "@/store/tokens";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
export default function AccessTokens() {
|
||||
const [newTokenModal, setNewTokenModal] = useState(false);
|
||||
const [revokeTokenModal, setRevokeTokenModal] = useState(false);
|
||||
const [selectedToken, setSelectedToken] = useState<AccessToken | null>(null);
|
||||
const { t } = useTranslation();
|
||||
|
||||
const openRevokeModal = (token: AccessToken) => {
|
||||
setSelectedToken(token);
|
||||
|
|
@ -27,15 +30,14 @@ export default function AccessTokens() {
|
|||
|
||||
return (
|
||||
<SettingsLayout>
|
||||
<p className="capitalize text-3xl font-thin inline">Access Tokens</p>
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
{t("access_tokens")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<div className="flex flex-col gap-3">
|
||||
<p>
|
||||
Access Tokens can be used to access Linkwarden from other apps and
|
||||
services without giving away your Username and Password.
|
||||
</p>
|
||||
<p>{t("access_tokens_description")}</p>
|
||||
|
||||
<button
|
||||
className={`btn ml-auto btn-accent dark:border-violet-400 text-white tracking-wider w-fit flex items-center gap-2`}
|
||||
|
|
@ -43,7 +45,7 @@ export default function AccessTokens() {
|
|||
setNewTokenModal(true);
|
||||
}}
|
||||
>
|
||||
New Access Token
|
||||
{t("new_token")}
|
||||
</button>
|
||||
|
||||
{tokens.length > 0 ? (
|
||||
|
|
@ -51,13 +53,12 @@ export default function AccessTokens() {
|
|||
<div className="divider my-0"></div>
|
||||
|
||||
<table className="table">
|
||||
{/* head */}
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Name</th>
|
||||
<th>Created</th>
|
||||
<th>Expires</th>
|
||||
<th>{t("name")}</th>
|
||||
<th>{t("created")}</th>
|
||||
<th>{t("expires")}</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -105,3 +106,5 @@ export default function AccessTokens() {
|
|||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -15,17 +15,16 @@ import { dropdownTriggerer } from "@/lib/client/utils";
|
|||
import EmailChangeVerificationModal from "@/components/ModalContent/EmailChangeVerificationModal";
|
||||
import Button from "@/components/ui/Button";
|
||||
import { i18n } from "next-i18next.config";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
const emailEnabled = process.env.NEXT_PUBLIC_EMAIL_PROVIDER;
|
||||
|
||||
export default function Account() {
|
||||
const [emailChangeVerificationModal, setEmailChangeVerificationModal] =
|
||||
useState(false);
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const { account, updateAccount } = useAccountStore();
|
||||
|
||||
const [user, setUser] = useState<AccountSettings>(
|
||||
!objectIsEmpty(account)
|
||||
? account
|
||||
|
|
@ -45,6 +44,8 @@ export default function Account() {
|
|||
} as unknown as AccountSettings)
|
||||
);
|
||||
|
||||
const { t } = useTranslation();
|
||||
|
||||
function objectIsEmpty(obj: object) {
|
||||
return Object.keys(obj).length === 0;
|
||||
}
|
||||
|
|
@ -68,17 +69,16 @@ export default function Account() {
|
|||
};
|
||||
reader.readAsDataURL(resizedFile);
|
||||
} else {
|
||||
toast.error("Please select a PNG or JPEG file thats less than 1MB.");
|
||||
toast.error(t("image_upload_size_error"));
|
||||
}
|
||||
} else {
|
||||
toast.error("Invalid file format.");
|
||||
toast.error(t("image_upload_format_error"));
|
||||
}
|
||||
};
|
||||
|
||||
const submit = async (password?: string) => {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Applying...");
|
||||
const load = toast.loading(t("applying_settings"));
|
||||
|
||||
const response = await updateAccount({
|
||||
...user,
|
||||
|
|
@ -91,56 +91,44 @@ export default function Account() {
|
|||
if (response.ok) {
|
||||
const emailChanged = account.email !== user.email;
|
||||
|
||||
toast.success(t("settings_applied"));
|
||||
if (emailChanged) {
|
||||
toast.success("Settings Applied!");
|
||||
toast.success(
|
||||
"Email change request sent. Please verify the new email address."
|
||||
);
|
||||
toast.success(t("email_change_request"));
|
||||
setEmailChangeVerificationModal(false);
|
||||
} else toast.success("Settings Applied!");
|
||||
}
|
||||
} else toast.error(response.data as string);
|
||||
setSubmitLoader(false);
|
||||
};
|
||||
|
||||
const importBookmarks = async (e: any, format: MigrationFormat) => {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const file: File = e.target.files[0];
|
||||
|
||||
if (file) {
|
||||
var reader = new FileReader();
|
||||
reader.readAsText(file, "UTF-8");
|
||||
reader.onload = async function (e) {
|
||||
const load = toast.loading("Importing...");
|
||||
|
||||
const load = toast.loading(t("importing_bookmarks"));
|
||||
const request: string = e.target?.result as string;
|
||||
|
||||
const body: MigrationRequest = {
|
||||
format,
|
||||
data: request,
|
||||
};
|
||||
|
||||
const body: MigrationRequest = { format, data: request };
|
||||
const response = await fetch("/api/v1/migration", {
|
||||
method: "POST",
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
if (response.ok) {
|
||||
toast.success("Imported the Bookmarks! Reloading the page...");
|
||||
toast.success(t("import_success"));
|
||||
setTimeout(() => {
|
||||
location.reload();
|
||||
}, 2000);
|
||||
} else toast.error(data.response as string);
|
||||
} else {
|
||||
toast.error(data.response as string);
|
||||
}
|
||||
};
|
||||
reader.onerror = function (e) {
|
||||
console.log("Error:", e);
|
||||
};
|
||||
}
|
||||
|
||||
setSubmitLoader(false);
|
||||
};
|
||||
|
||||
|
|
@ -158,16 +146,14 @@ export default function Account() {
|
|||
}, [whitelistedUsersTextbox]);
|
||||
|
||||
const stringToArray = (str: string) => {
|
||||
const stringWithoutSpaces = str?.replace(/\s+/g, "");
|
||||
|
||||
const wordsArray = stringWithoutSpaces?.split(",");
|
||||
|
||||
return wordsArray;
|
||||
return str?.replace(/\s+/g, "").split(",");
|
||||
};
|
||||
|
||||
return (
|
||||
<SettingsLayout>
|
||||
<p className="capitalize text-3xl font-thin inline">Account Settings</p>
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
{t("accountSettings")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
|
|
@ -175,7 +161,7 @@ export default function Account() {
|
|||
<div className="grid sm:grid-cols-2 gap-3 auto-rows-auto">
|
||||
<div className="flex flex-col gap-3">
|
||||
<div>
|
||||
<p className="mb-2">Display Name</p>
|
||||
<p className="mb-2">{t("display_name")}</p>
|
||||
<TextInput
|
||||
value={user.name || ""}
|
||||
className="bg-base-200"
|
||||
|
|
@ -183,17 +169,16 @@ export default function Account() {
|
|||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p className="mb-2">Username</p>
|
||||
<p className="mb-2">{t("username")}</p>
|
||||
<TextInput
|
||||
value={user.username || ""}
|
||||
className="bg-base-200"
|
||||
onChange={(e) => setUser({ ...user, username: e.target.value })}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{emailEnabled ? (
|
||||
<div>
|
||||
<p className="mb-2">Email</p>
|
||||
<p className="mb-2">{t("email")}</p>
|
||||
<TextInput
|
||||
value={user.email || ""}
|
||||
className="bg-base-200"
|
||||
|
|
@ -201,9 +186,8 @@ export default function Account() {
|
|||
/>
|
||||
</div>
|
||||
) : undefined}
|
||||
|
||||
<div>
|
||||
<p className="mb-2">Language</p>
|
||||
<p className="mb-2">{t("language")}</p>
|
||||
<select
|
||||
onChange={(e) => {
|
||||
setUser({ ...user, locale: e.target.value });
|
||||
|
|
@ -221,12 +205,13 @@ export default function Account() {
|
|||
) || ""}
|
||||
</option>
|
||||
))}
|
||||
<option disabled>{t("more_coming_soon")}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="sm:row-span-2 sm:justify-self-center my-3">
|
||||
<p className="mb-2 sm:text-center">Profile Photo</p>
|
||||
<p className="mb-2 sm:text-center">{t("profile_photo")}</p>
|
||||
<div className="w-28 h-28 flex gap-3 sm:flex-col items-center">
|
||||
<ProfilePhoto
|
||||
priority={true}
|
||||
|
|
@ -244,12 +229,12 @@ export default function Account() {
|
|||
className="text-sm"
|
||||
>
|
||||
<i className="bi-pencil-square text-md duration-100"></i>
|
||||
Edit
|
||||
{t("edit")}
|
||||
</Button>
|
||||
<ul className="shadow menu dropdown-content z-[1] bg-base-200 border border-neutral-content rounded-box mt-1 w-60">
|
||||
<li>
|
||||
<label tabIndex={0} role="button">
|
||||
Upload a new photo...
|
||||
{t("upload_new_photo")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -272,7 +257,7 @@ export default function Account() {
|
|||
})
|
||||
}
|
||||
>
|
||||
Remove Photo
|
||||
{t("remove_photo")}
|
||||
</div>
|
||||
</li>
|
||||
)}
|
||||
|
|
@ -284,25 +269,22 @@ export default function Account() {
|
|||
|
||||
<div className="sm:-mt-3">
|
||||
<Checkbox
|
||||
label="Make profile private"
|
||||
label={t("make_profile_private")}
|
||||
state={user.isPrivate}
|
||||
onClick={() => setUser({ ...user, isPrivate: !user.isPrivate })}
|
||||
/>
|
||||
|
||||
<p className="text-neutral text-sm">
|
||||
This will limit who can find and add you to new Collections.
|
||||
</p>
|
||||
<p className="text-neutral text-sm">{t("profile_privacy_info")}</p>
|
||||
|
||||
{user.isPrivate && (
|
||||
<div className="pl-5">
|
||||
<p className="mt-2">Whitelisted Users</p>
|
||||
<p className="mt-2">{t("whitelisted_users")}</p>
|
||||
<p className="text-neutral text-sm mb-3">
|
||||
Please provide the Username of the users you wish to grant
|
||||
visibility to your profile. Separated by comma.
|
||||
{t("whitelisted_users_info")}
|
||||
</p>
|
||||
<textarea
|
||||
className="w-full resize-none border rounded-md duration-100 bg-base-200 p-2 outline-none border-neutral-content focus:border-primary"
|
||||
placeholder="Your profile is hidden from everyone right now..."
|
||||
placeholder={t("whitelisted_users_placeholder")}
|
||||
value={whitelistedUsersTextbox}
|
||||
onChange={(e) => setWhiteListedUsersTextbox(e.target.value)}
|
||||
/>
|
||||
|
|
@ -319,14 +301,14 @@ export default function Account() {
|
|||
}
|
||||
}}
|
||||
loading={submitLoader}
|
||||
label="Save Changes"
|
||||
label={t("save_changes")}
|
||||
className="mt-2 w-full sm:w-fit"
|
||||
/>
|
||||
|
||||
<div>
|
||||
<div className="flex items-center gap-2 w-full rounded-md h-8">
|
||||
<p className="truncate w-full pr-7 text-3xl font-thin">
|
||||
Import & Export
|
||||
{t("import_export")}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -334,7 +316,7 @@ export default function Account() {
|
|||
|
||||
<div className="flex gap-3 flex-col">
|
||||
<div>
|
||||
<p className="mb-2">Import your data from other platforms.</p>
|
||||
<p className="mb-2">{t("import_data")}</p>
|
||||
<div className="dropdown dropdown-bottom">
|
||||
<Button
|
||||
tabIndex={0}
|
||||
|
|
@ -345,7 +327,7 @@ export default function Account() {
|
|||
id="import-dropdown"
|
||||
>
|
||||
<i className="bi-cloud-upload text-xl duration-100"></i>
|
||||
Import From
|
||||
{t("import_links")}
|
||||
</Button>
|
||||
|
||||
<ul className="shadow menu dropdown-content z-[1] bg-base-200 border border-neutral-content rounded-box mt-1 w-60">
|
||||
|
|
@ -354,9 +336,9 @@ export default function Account() {
|
|||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-linkwarden-file"
|
||||
title="JSON File"
|
||||
title={t("from_linkwarden")}
|
||||
>
|
||||
From Linkwarden
|
||||
{t("from_linkwarden")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -374,9 +356,9 @@ export default function Account() {
|
|||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-html-file"
|
||||
title="HTML File"
|
||||
title={t("from_html")}
|
||||
>
|
||||
From Bookmarks HTML file
|
||||
{t("from_html")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -394,9 +376,9 @@ export default function Account() {
|
|||
tabIndex={0}
|
||||
role="button"
|
||||
htmlFor="import-wallabag-file"
|
||||
title="Wallabag File"
|
||||
title={t("from_wallabag")}
|
||||
>
|
||||
From Wallabag (JSON file)
|
||||
{t("from_wallabag")}
|
||||
<input
|
||||
type="file"
|
||||
name="photo"
|
||||
|
|
@ -414,11 +396,11 @@ export default function Account() {
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<p className="mb-2">Download your data instantly.</p>
|
||||
<p className="mb-2">{t("download_data")}</p>
|
||||
<Link className="w-fit" href="/api/v1/migration">
|
||||
<div className="select-none relative duration-200 rounded-lg text-sm text-center w-fit flex justify-center items-center gap-2 disabled:pointer-events-none disabled:opacity-50 bg-neutral-content text-secondary-foreground hover:bg-neutral-content/80 border border-neutral/30 h-10 px-4 py-2">
|
||||
<i className="bi-cloud-download text-xl duration-100"></i>
|
||||
<p>Export Data</p>
|
||||
<p>{t("export_data")}</p>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
|
|
@ -428,23 +410,22 @@ export default function Account() {
|
|||
<div>
|
||||
<div className="flex items-center gap-2 w-full rounded-md h-8">
|
||||
<p className="text-red-500 dark:text-red-500 truncate w-full pr-7 text-3xl font-thin">
|
||||
Delete Account
|
||||
{t("delete_account")}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<p>
|
||||
This will permanently delete ALL the Links, Collections, Tags, and
|
||||
archived data you own.{" "}
|
||||
{t("delete_account_warning")}
|
||||
{process.env.NEXT_PUBLIC_STRIPE
|
||||
? "It will also cancel your subscription. "
|
||||
? " " + t("cancel_subscription_notice")
|
||||
: undefined}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<Link href="/settings/delete" className="underline">
|
||||
Account deletion page
|
||||
{t("account_deletion_page")}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
|
|
@ -459,3 +440,5 @@ export default function Account() {
|
|||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,9 +1,12 @@
|
|||
import SettingsLayout from "@/layouts/SettingsLayout";
|
||||
import { useRouter } from "next/router";
|
||||
import { useEffect } from "react";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
export default function Billing() {
|
||||
const router = useRouter();
|
||||
const { t } = useTranslation();
|
||||
|
||||
useEffect(() => {
|
||||
if (!process.env.NEXT_PUBLIC_STRIPE) router.push("/settings/profile");
|
||||
|
|
@ -11,26 +14,27 @@ export default function Billing() {
|
|||
|
||||
return (
|
||||
<SettingsLayout>
|
||||
<p className="capitalize text-3xl font-thin inline">Billing Settings</p>
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
{t("billing_settings")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<div className="w-full mx-auto flex flex-col gap-3 justify-between">
|
||||
<p className="text-md">
|
||||
To manage/cancel your subscription, visit the{" "}
|
||||
{t("manage_subscription_intro")}{" "}
|
||||
<a
|
||||
href={process.env.NEXT_PUBLIC_STRIPE_BILLING_PORTAL_URL}
|
||||
className="underline"
|
||||
target="_blank"
|
||||
>
|
||||
Billing Portal
|
||||
{t("billing_portal")}
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
|
||||
<p className="text-md">
|
||||
If you still need help or encountered any issues, feel free to reach
|
||||
out to us at:{" "}
|
||||
{t("help_contact_intro")}{" "}
|
||||
<a className="font-semibold" href="mailto:support@linkwarden.app">
|
||||
support@linkwarden.app
|
||||
</a>
|
||||
|
|
@ -39,3 +43,5 @@ export default function Billing() {
|
|||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -5,18 +5,16 @@ import CenteredForm from "@/layouts/CenteredForm";
|
|||
import { signOut, useSession } from "next-auth/react";
|
||||
import Link from "next/link";
|
||||
import Button from "@/components/ui/Button";
|
||||
|
||||
const keycloakEnabled = process.env.NEXT_PUBLIC_KEYCLOAK_ENABLED === "true";
|
||||
const authentikEnabled = process.env.NEXT_PUBLIC_AUTHENTIK_ENABLED === "true";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
export default function Delete() {
|
||||
const [password, setPassword] = useState("");
|
||||
const [comment, setComment] = useState<string>();
|
||||
const [feedback, setFeedback] = useState<string>();
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const { data } = useSession();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const submit = async () => {
|
||||
const body = {
|
||||
|
|
@ -27,13 +25,12 @@ export default function Delete() {
|
|||
},
|
||||
};
|
||||
|
||||
if (!keycloakEnabled && !authentikEnabled && password == "") {
|
||||
return toast.error("Please fill the required fields.");
|
||||
if (password === "") {
|
||||
return toast.error(t("fill_required_fields"));
|
||||
}
|
||||
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Deleting everything, please wait...");
|
||||
const load = toast.loading(t("deleting_message"));
|
||||
|
||||
const response = await fetch(`/api/v1/users/${data?.user.id}`, {
|
||||
method: "DELETE",
|
||||
|
|
@ -49,7 +46,9 @@ export default function Delete() {
|
|||
|
||||
if (response.ok) {
|
||||
signOut();
|
||||
} else toast.error(message);
|
||||
} else {
|
||||
toast.error(message);
|
||||
}
|
||||
|
||||
setSubmitLoader(false);
|
||||
};
|
||||
|
|
@ -65,25 +64,16 @@ export default function Delete() {
|
|||
</Link>
|
||||
<div className="flex items-center gap-2 w-full rounded-md h-8">
|
||||
<p className="text-red-500 dark:text-red-500 truncate w-full text-3xl text-center">
|
||||
Delete Account
|
||||
{t("delete_account")}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="divider my-0"></div>
|
||||
|
||||
<p>
|
||||
This will permanently delete all the Links, Collections, Tags, and
|
||||
archived data you own. It will also log you out
|
||||
{process.env.NEXT_PUBLIC_STRIPE
|
||||
? " and cancel your subscription"
|
||||
: undefined}
|
||||
. This action is irreversible!
|
||||
</p>
|
||||
<p>{t("delete_warning")}</p>
|
||||
|
||||
{process.env.NEXT_PUBLIC_KEYCLOAK_ENABLED !== "true" ? (
|
||||
<div>
|
||||
<p className="mb-2">Confirm Your Password</p>
|
||||
|
||||
<p className="mb-2">{t("confirm_password")}</p>
|
||||
<TextInput
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
|
|
@ -92,44 +82,43 @@ export default function Delete() {
|
|||
type="password"
|
||||
/>
|
||||
</div>
|
||||
) : undefined}
|
||||
|
||||
{process.env.NEXT_PUBLIC_STRIPE ? (
|
||||
<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">
|
||||
<b>Optional</b>{" "}
|
||||
<i className="min-[390px]:text-sm text-xs">
|
||||
(but it really helps us improve!)
|
||||
</i>
|
||||
<b>{t("optional")}</b> <i>{t("feedback_help")}</i>
|
||||
</legend>
|
||||
<label className="w-full flex min-[430px]:items-center items-start gap-2 mb-3 min-[430px]:flex-row flex-col">
|
||||
<p className="text-sm">Reason for cancellation:</p>
|
||||
<p className="text-sm">{t("reason_for_cancellation")}:</p>
|
||||
<select
|
||||
className="rounded-md p-1 outline-none"
|
||||
value={feedback}
|
||||
onChange={(e) => setFeedback(e.target.value)}
|
||||
>
|
||||
<option value={undefined}>Please specify</option>
|
||||
<option value="customer_service">Customer Service</option>
|
||||
<option value="low_quality">Low Quality</option>
|
||||
<option value="missing_features">Missing Features</option>
|
||||
<option value="switched_service">Switched Service</option>
|
||||
<option value="too_complex">Too Complex</option>
|
||||
<option value="too_expensive">Too Expensive</option>
|
||||
<option value="unused">Unused</option>
|
||||
<option value="other">Other</option>
|
||||
<option value={undefined}>{t("please_specify")}</option>
|
||||
<option value="customer_service">
|
||||
{t("customer_service")}
|
||||
</option>
|
||||
<option value="low_quality">{t("low_quality")}</option>
|
||||
<option value="missing_features">
|
||||
{t("missing_features")}
|
||||
</option>
|
||||
<option value="switched_service">
|
||||
{t("switched_service")}
|
||||
</option>
|
||||
<option value="too_complex">{t("too_complex")}</option>
|
||||
<option value="too_expensive">{t("too_expensive")}</option>
|
||||
<option value="unused">{t("unused")}</option>
|
||||
<option value="other">{t("other")}</option>
|
||||
</select>
|
||||
</label>
|
||||
<div>
|
||||
<p className="text-sm mb-2">
|
||||
More information (the more details, the more helpful it'd
|
||||
be)
|
||||
</p>
|
||||
<p className="text-sm mb-2">{t("more_information")}</p>
|
||||
|
||||
<textarea
|
||||
value={comment}
|
||||
onChange={(e) => setComment(e.target.value)}
|
||||
placeholder="e.g. I needed a feature that..."
|
||||
placeholder={t("feedback_placeholder")}
|
||||
className="resize-none w-full rounded-md p-2 border-neutral-content bg-base-100 focus:border-sky-300 dark:focus:border-sky-600 border-solid border outline-none duration-100"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -142,9 +131,11 @@ export default function Delete() {
|
|||
loading={submitLoader}
|
||||
onClick={submit}
|
||||
>
|
||||
<p className="text-center w-full">Delete Your Account</p>
|
||||
<p className="text-center w-full">{t("delete_your_account")}</p>
|
||||
</Button>
|
||||
</div>
|
||||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -4,25 +4,26 @@ import useAccountStore from "@/store/account";
|
|||
import SubmitButton from "@/components/SubmitButton";
|
||||
import { toast } from "react-hot-toast";
|
||||
import TextInput from "@/components/TextInput";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
|
||||
export default function Password() {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const [oldPassword, setOldPassword] = useState("");
|
||||
const [newPassword, setNewPassword] = useState("");
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
|
||||
const { account, updateAccount } = useAccountStore();
|
||||
|
||||
const submit = async () => {
|
||||
if (newPassword == "" || oldPassword == "") {
|
||||
return toast.error("Please fill all the fields.");
|
||||
if (newPassword === "" || oldPassword === "") {
|
||||
return toast.error(t("fill_all_fields"));
|
||||
}
|
||||
if (newPassword.length < 8)
|
||||
return toast.error("Passwords must be at least 8 characters.");
|
||||
if (newPassword.length < 8) return toast.error(t("password_length_error"));
|
||||
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Applying...");
|
||||
const load = toast.loading(t("applying_changes"));
|
||||
|
||||
const response = await updateAccount({
|
||||
...account,
|
||||
|
|
@ -33,26 +34,27 @@ export default function Password() {
|
|||
toast.dismiss(load);
|
||||
|
||||
if (response.ok) {
|
||||
toast.success("Settings Applied!");
|
||||
toast.success(t("settings_applied"));
|
||||
setNewPassword("");
|
||||
setOldPassword("");
|
||||
} else toast.error(response.data as string);
|
||||
} else {
|
||||
toast.error(response.data as string);
|
||||
}
|
||||
|
||||
setSubmitLoader(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<SettingsLayout>
|
||||
<p className="capitalize text-3xl font-thin inline">Change Password</p>
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
{t("change_password")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<p className="mb-3">
|
||||
To change your password, please fill out the following. Your password
|
||||
should be at least 8 characters.
|
||||
</p>
|
||||
<p className="mb-3">{t("password_change_instructions")}</p>
|
||||
<div className="w-full flex flex-col gap-2 justify-between">
|
||||
<p>Old Password</p>
|
||||
<p>{t("old_password")}</p>
|
||||
|
||||
<TextInput
|
||||
value={oldPassword}
|
||||
|
|
@ -62,7 +64,7 @@ export default function Password() {
|
|||
type="password"
|
||||
/>
|
||||
|
||||
<p className="mt-3">New Password</p>
|
||||
<p className="mt-3">{t("new_password")}</p>
|
||||
|
||||
<TextInput
|
||||
value={newPassword}
|
||||
|
|
@ -75,10 +77,12 @@ export default function Password() {
|
|||
<SubmitButton
|
||||
onClick={submit}
|
||||
loading={submitLoader}
|
||||
label="Save Changes"
|
||||
label={t("save_changes")}
|
||||
className="mt-3 w-full sm:w-fit"
|
||||
/>
|
||||
</div>
|
||||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,31 +1,33 @@
|
|||
import SettingsLayout from "@/layouts/SettingsLayout";
|
||||
import { useState, useEffect } from "react";
|
||||
import useAccountStore from "@/store/account";
|
||||
import { AccountSettings } from "@/types/global";
|
||||
import { toast } from "react-hot-toast";
|
||||
import React from "react";
|
||||
import useLocalSettingsStore from "@/store/localSettings";
|
||||
import Checkbox from "@/components/Checkbox";
|
||||
import SubmitButton from "@/components/SubmitButton";
|
||||
import { toast } from "react-hot-toast";
|
||||
import Checkbox from "@/components/Checkbox";
|
||||
import useLocalSettingsStore from "@/store/localSettings";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps"; // Import getServerSideProps for server-side data fetching
|
||||
import { LinksRouteTo } from "@prisma/client";
|
||||
|
||||
export default function Appearance() {
|
||||
const { t } = useTranslation();
|
||||
const { updateSettings } = useLocalSettingsStore();
|
||||
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
const { account, updateAccount } = useAccountStore();
|
||||
const [user, setUser] = useState<AccountSettings>(account);
|
||||
const [user, setUser] = useState(account);
|
||||
|
||||
const [preventDuplicateLinks, setPreventDuplicateLinks] =
|
||||
useState<boolean>(false);
|
||||
const [archiveAsScreenshot, setArchiveAsScreenshot] =
|
||||
useState<boolean>(false);
|
||||
const [archiveAsPDF, setArchiveAsPDF] = useState<boolean>(false);
|
||||
const [archiveAsWaybackMachine, setArchiveAsWaybackMachine] =
|
||||
useState<boolean>(false);
|
||||
const [linksRouteTo, setLinksRouteTo] = useState<LinksRouteTo>(
|
||||
user.linksRouteTo
|
||||
const [preventDuplicateLinks, setPreventDuplicateLinks] = useState<boolean>(
|
||||
account.preventDuplicateLinks
|
||||
);
|
||||
const [archiveAsScreenshot, setArchiveAsScreenshot] = useState<boolean>(
|
||||
account.archiveAsScreenshot
|
||||
);
|
||||
const [archiveAsPDF, setArchiveAsPDF] = useState<boolean>(
|
||||
account.archiveAsPDF
|
||||
);
|
||||
const [archiveAsWaybackMachine, setArchiveAsWaybackMachine] =
|
||||
useState<boolean>(account.archiveAsWaybackMachine);
|
||||
const [linksRouteTo, setLinksRouteTo] = useState(account.linksRouteTo);
|
||||
|
||||
useEffect(() => {
|
||||
setUser({
|
||||
|
|
@ -62,29 +64,29 @@ export default function Appearance() {
|
|||
const submit = async () => {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Applying...");
|
||||
const load = toast.loading(t("applying_changes"));
|
||||
|
||||
const response = await updateAccount({
|
||||
...user,
|
||||
});
|
||||
const response = await updateAccount({ ...user });
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
if (response.ok) {
|
||||
toast.success("Settings Applied!");
|
||||
} else toast.error(response.data as string);
|
||||
toast.success(t("settings_applied"));
|
||||
} else {
|
||||
toast.error(response.data as string);
|
||||
}
|
||||
setSubmitLoader(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<SettingsLayout>
|
||||
<p className="capitalize text-3xl font-thin inline">Preference</p>
|
||||
<p className="capitalize text-3xl font-thin inline">{t("preference")}</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<div className="flex flex-col gap-5">
|
||||
<div>
|
||||
<p className="mb-3">Select Theme</p>
|
||||
<p className="mb-3">{t("select_theme")}</p>
|
||||
<div className="flex gap-3 w-full">
|
||||
<div
|
||||
className={`w-full text-center outline-solid outline-neutral-content outline dark:outline-neutral-700 h-36 duration-100 rounded-md flex items-center justify-center cursor-pointer select-none bg-black ${
|
||||
|
|
@ -95,9 +97,7 @@ export default function Appearance() {
|
|||
onClick={() => updateSettings({ theme: "dark" })}
|
||||
>
|
||||
<i className="bi-moon-fill text-6xl"></i>
|
||||
<p className="ml-2 text-2xl">Dark</p>
|
||||
|
||||
{/* <hr className="my-3 outline-1 outline-neutral-content dark:outline-neutral-700" /> */}
|
||||
<p className="ml-2 text-2xl">{t("dark")}</p>
|
||||
</div>
|
||||
<div
|
||||
className={`w-full text-center outline-solid outline-neutral-content outline dark:outline-neutral-700 h-36 duration-100 rounded-md flex items-center justify-center cursor-pointer select-none bg-white ${
|
||||
|
|
@ -108,35 +108,30 @@ export default function Appearance() {
|
|||
onClick={() => updateSettings({ theme: "light" })}
|
||||
>
|
||||
<i className="bi-sun-fill text-6xl"></i>
|
||||
<p className="ml-2 text-2xl">Light</p>
|
||||
{/* <hr className="my-3 outline-1 outline-neutral-content dark:outline-neutral-700" /> */}
|
||||
<p className="ml-2 text-2xl">{t("light")}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
Archive Settings
|
||||
{t("archive_settings")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-3"></div>
|
||||
|
||||
<p>Formats to Archive/Preserve webpages:</p>
|
||||
<p>{t("formats_to_archive")}</p>
|
||||
<div className="p-3">
|
||||
<Checkbox
|
||||
label="Screenshot"
|
||||
label={t("screenshot")}
|
||||
state={archiveAsScreenshot}
|
||||
onClick={() => setArchiveAsScreenshot(!archiveAsScreenshot)}
|
||||
/>
|
||||
|
||||
<Checkbox
|
||||
label="PDF"
|
||||
label={t("pdf")}
|
||||
state={archiveAsPDF}
|
||||
onClick={() => setArchiveAsPDF(!archiveAsPDF)}
|
||||
/>
|
||||
|
||||
<Checkbox
|
||||
label="Archive.org Snapshot"
|
||||
label={t("archive_org_snapshot")}
|
||||
state={archiveAsWaybackMachine}
|
||||
onClick={() =>
|
||||
setArchiveAsWaybackMachine(!archiveAsWaybackMachine)
|
||||
|
|
@ -146,18 +141,18 @@ export default function Appearance() {
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<p className="capitalize text-3xl font-thin inline">Link Settings</p>
|
||||
|
||||
<p className="capitalize text-3xl font-thin inline">
|
||||
{t("link_settings")}
|
||||
</p>
|
||||
<div className="divider my-3"></div>
|
||||
<div className="mb-3">
|
||||
<Checkbox
|
||||
label="Prevent duplicate links"
|
||||
label={t("prevent_duplicate_links")}
|
||||
state={preventDuplicateLinks}
|
||||
onClick={() => setPreventDuplicateLinks(!preventDuplicateLinks)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<p>Clicking on Links should:</p>
|
||||
<p>{t("clicking_on_links_should")}</p>
|
||||
<div className="p-3">
|
||||
<label
|
||||
className="label cursor-pointer flex gap-2 justify-start w-fit"
|
||||
|
|
@ -172,7 +167,7 @@ export default function Appearance() {
|
|||
checked={linksRouteTo === LinksRouteTo.ORIGINAL}
|
||||
onChange={() => setLinksRouteTo(LinksRouteTo.ORIGINAL)}
|
||||
/>
|
||||
<span className="label-text">Open the original content</span>
|
||||
<span className="label-text">{t("open_original_content")}</span>
|
||||
</label>
|
||||
|
||||
<label
|
||||
|
|
@ -188,7 +183,7 @@ export default function Appearance() {
|
|||
checked={linksRouteTo === LinksRouteTo.PDF}
|
||||
onChange={() => setLinksRouteTo(LinksRouteTo.PDF)}
|
||||
/>
|
||||
<span className="label-text">Open PDF, if available</span>
|
||||
<span className="label-text">{t("open_pdf_if_available")}</span>
|
||||
</label>
|
||||
|
||||
<label
|
||||
|
|
@ -204,7 +199,9 @@ export default function Appearance() {
|
|||
checked={linksRouteTo === LinksRouteTo.READABLE}
|
||||
onChange={() => setLinksRouteTo(LinksRouteTo.READABLE)}
|
||||
/>
|
||||
<span className="label-text">Open Readable, if available</span>
|
||||
<span className="label-text">
|
||||
{t("open_readable_if_available")}
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<label
|
||||
|
|
@ -220,7 +217,9 @@ export default function Appearance() {
|
|||
checked={linksRouteTo === LinksRouteTo.SCREENSHOT}
|
||||
onChange={() => setLinksRouteTo(LinksRouteTo.SCREENSHOT)}
|
||||
/>
|
||||
<span className="label-text">Open Screenshot, if available</span>
|
||||
<span className="label-text">
|
||||
{t("open_screenshot_if_available")}
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -228,10 +227,12 @@ export default function Appearance() {
|
|||
<SubmitButton
|
||||
onClick={submit}
|
||||
loading={submitLoader}
|
||||
label="Save Changes"
|
||||
label={t("save_changes")}
|
||||
className="mt-2 w-full sm:w-fit"
|
||||
/>
|
||||
</div>
|
||||
</SettingsLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,12 +1,18 @@
|
|||
import { signOut, useSession } from "next-auth/react";
|
||||
import { useState } from "react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { toast } from "react-hot-toast";
|
||||
import { useRouter } from "next/router";
|
||||
import CenteredForm from "@/layouts/CenteredForm";
|
||||
import { Plan } from "@/types/global";
|
||||
import AccentSubmitButton from "@/components/ui/Button";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import { Trans, useTranslation } from "next-i18next";
|
||||
import useAccountStore from "@/store/account";
|
||||
|
||||
const stripeEnabled = process.env.NEXT_PUBLIC_STRIPE === "true";
|
||||
|
||||
export default function Subscribe() {
|
||||
const { t } = useTranslation();
|
||||
const [submitLoader, setSubmitLoader] = useState(false);
|
||||
const session = useSession();
|
||||
|
||||
|
|
@ -14,10 +20,21 @@ export default function Subscribe() {
|
|||
|
||||
const router = useRouter();
|
||||
|
||||
const { account } = useAccountStore();
|
||||
|
||||
useEffect(() => {
|
||||
const hasInactiveSubscription =
|
||||
account.id && !account.subscription?.active && stripeEnabled;
|
||||
|
||||
if (session.status === "authenticated" && !hasInactiveSubscription) {
|
||||
router.push("/dashboard");
|
||||
}
|
||||
}, [session.status]);
|
||||
|
||||
async function submit() {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const redirectionToast = toast.loading("Redirecting to Stripe...");
|
||||
const redirectionToast = toast.loading(t("redirecting_to_stripe"));
|
||||
|
||||
const res = await fetch("/api/v1/payment?plan=" + plan);
|
||||
const data = await res.json();
|
||||
|
|
@ -33,18 +50,24 @@ export default function Subscribe() {
|
|||
>
|
||||
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
|
||||
<p className="sm:text-3xl text-2xl text-center font-extralight">
|
||||
Subscribe to Linkwarden!
|
||||
{t("subscribe_title")}
|
||||
</p>
|
||||
|
||||
<div className="divider my-0"></div>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
You will be redirected to Stripe, feel free to reach out to us at{" "}
|
||||
<a className="font-semibold" href="mailto:support@linkwarden.app">
|
||||
<Trans
|
||||
i18nKey="subscribe_desc"
|
||||
components={[
|
||||
<a
|
||||
className="font-semibold"
|
||||
href="mailto:support@linkwarden.app"
|
||||
>
|
||||
support@linkwarden.app
|
||||
</a>{" "}
|
||||
in case of any issue.
|
||||
</a>,
|
||||
]}
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -57,7 +80,7 @@ export default function Subscribe() {
|
|||
: "hover:opacity-80"
|
||||
}`}
|
||||
>
|
||||
<p>Monthly</p>
|
||||
<p>{t("monthly")}</p>
|
||||
</button>
|
||||
|
||||
<button
|
||||
|
|
@ -68,10 +91,12 @@ export default function Subscribe() {
|
|||
: "hover:opacity-80"
|
||||
}`}
|
||||
>
|
||||
<p>Yearly</p>
|
||||
<p>{t("yearly")}</p>
|
||||
</button>
|
||||
<div className="absolute -top-3 -right-4 px-1 bg-red-600 text-sm text-white rounded-md rotate-[22deg]">
|
||||
25% Off
|
||||
{t("discount_percent", {
|
||||
percent: 25,
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -81,18 +106,25 @@ export default function Subscribe() {
|
|||
<span className="text-base text-neutral">/mo</span>
|
||||
</p>
|
||||
<p className="font-semibold">
|
||||
Billed {plan === Plan.monthly ? "Monthly" : "Yearly"}
|
||||
{plan === Plan.monthly ? t("billed_monthly") : t("billed_yearly")}
|
||||
</p>
|
||||
<fieldset className="w-full flex-col flex justify-evenly px-4 pb-4 pt-1 rounded-md border border-neutral-content">
|
||||
<legend className="w-fit font-extralight px-2 border border-neutral-content rounded-md text-xl">
|
||||
Total
|
||||
{t("total")}
|
||||
</legend>
|
||||
|
||||
<p className="text-sm">
|
||||
{process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS}-day free trial, then $
|
||||
{plan === Plan.monthly ? "4 per month" : "36 annually"}
|
||||
{plan === Plan.monthly
|
||||
? t("total_monthly_desc", {
|
||||
count: Number(process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS),
|
||||
monthlyPrice: "4",
|
||||
})
|
||||
: t("total_annual_desc", {
|
||||
count: Number(process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS),
|
||||
annualPrice: "36",
|
||||
})}
|
||||
</p>
|
||||
<p className="text-sm">+ VAT if applicable</p>
|
||||
<p className="text-sm">{t("plus_tax")}</p>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
|
|
@ -103,16 +135,18 @@ export default function Subscribe() {
|
|||
onClick={submit}
|
||||
loading={submitLoader}
|
||||
>
|
||||
Complete Subscription!
|
||||
{t("complete_subscription")}
|
||||
</AccentSubmitButton>
|
||||
|
||||
<div
|
||||
onClick={() => signOut()}
|
||||
className="w-fit mx-auto cursor-pointer text-neutral font-semibold "
|
||||
>
|
||||
Sign Out
|
||||
{t("sign_out")}
|
||||
</div>
|
||||
</div>
|
||||
</CenteredForm>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,26 +1,26 @@
|
|||
import useLinkStore from "@/store/links";
|
||||
import { useRouter } from "next/router";
|
||||
import { FormEvent, use, useEffect, useState } from "react";
|
||||
import { FormEvent, useEffect, useState } from "react";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import useTagStore from "@/store/tags";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import { Sort, TagIncludingLinkCount, ViewMode } from "@/types/global";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import { toast } from "react-hot-toast";
|
||||
import ViewDropdown from "@/components/ViewDropdown";
|
||||
import CardView from "@/components/LinkViews/Layouts/CardView";
|
||||
import ListView from "@/components/LinkViews/Layouts/ListView";
|
||||
import { dropdownTriggerer } from "@/lib/client/utils";
|
||||
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
|
||||
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
|
||||
import useCollectivePermissions from "@/hooks/useCollectivePermissions";
|
||||
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import getServerSideProps from "@/lib/client/getServerSideProps";
|
||||
import LinkListOptions from "@/components/LinkListOptions";
|
||||
|
||||
export default function Index() {
|
||||
const { t } = useTranslation();
|
||||
const router = useRouter();
|
||||
|
||||
const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
|
||||
useLinkStore();
|
||||
const { links } = useLinkStore();
|
||||
const { tags, updateTag, removeTag } = useTagStore();
|
||||
|
||||
const [sortBy, setSortBy] = useState<Sort>(Sort.DateNewestFirst);
|
||||
|
|
@ -38,10 +38,6 @@ export default function Index() {
|
|||
if (editMode) return setEditMode(false);
|
||||
}, [router]);
|
||||
|
||||
const collectivePermissions = useCollectivePermissions(
|
||||
selectedLinks.map((link) => link.collectionId as number)
|
||||
);
|
||||
|
||||
useLinks({ tagId: Number(router.query.id), sort: sortBy });
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -76,7 +72,7 @@ export default function Index() {
|
|||
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Applying...");
|
||||
const load = toast.loading(t("applying_changes"));
|
||||
|
||||
let response;
|
||||
|
||||
|
|
@ -89,7 +85,7 @@ export default function Index() {
|
|||
toast.dismiss(load);
|
||||
|
||||
if (response?.ok) {
|
||||
toast.success("Tag Renamed!");
|
||||
toast.success(t("tag_renamed"));
|
||||
} else toast.error(response?.data as string);
|
||||
setSubmitLoader(false);
|
||||
setRenameTag(false);
|
||||
|
|
@ -98,7 +94,7 @@ export default function Index() {
|
|||
const remove = async () => {
|
||||
setSubmitLoader(true);
|
||||
|
||||
const load = toast.loading("Applying...");
|
||||
const load = toast.loading(t("applying_changes"));
|
||||
|
||||
let response;
|
||||
|
||||
|
|
@ -107,42 +103,13 @@ export default function Index() {
|
|||
toast.dismiss(load);
|
||||
|
||||
if (response?.ok) {
|
||||
toast.success("Tag Removed.");
|
||||
toast.success(t("tag_deleted"));
|
||||
router.push("/links");
|
||||
} else toast.error(response?.data as string);
|
||||
setSubmitLoader(false);
|
||||
setRenameTag(false);
|
||||
};
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedLinks.length === links.length) {
|
||||
setSelectedLinks([]);
|
||||
} else {
|
||||
setSelectedLinks(links.map((link) => link));
|
||||
}
|
||||
};
|
||||
|
||||
const bulkDeleteLinks = async () => {
|
||||
const load = toast.loading(
|
||||
`Deleting ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}...`
|
||||
);
|
||||
|
||||
const response = await deleteLinksById(
|
||||
selectedLinks.map((link) => link.id as number)
|
||||
);
|
||||
|
||||
toast.dismiss(load);
|
||||
|
||||
response.ok &&
|
||||
toast.success(
|
||||
`Deleted ${selectedLinks.length} Link${
|
||||
selectedLinks.length > 1 ? "s" : ""
|
||||
}!`
|
||||
);
|
||||
};
|
||||
|
||||
const [viewMode, setViewMode] = useState<string>(
|
||||
localStorage.getItem("viewMode") || ViewMode.Card
|
||||
);
|
||||
|
|
@ -159,7 +126,15 @@ export default function Index() {
|
|||
return (
|
||||
<MainLayout>
|
||||
<div className="p-5 flex flex-col gap-5 w-full">
|
||||
<div className="flex gap-3 items-center justify-between">
|
||||
<LinkListOptions
|
||||
t={t}
|
||||
viewMode={viewMode}
|
||||
setViewMode={setViewMode}
|
||||
sortBy={sortBy}
|
||||
setSortBy={setSortBy}
|
||||
editMode={editMode}
|
||||
setEditMode={setEditMode}
|
||||
>
|
||||
<div className="flex gap-3 items-center">
|
||||
<div className="flex gap-2 items-center font-thin">
|
||||
<i className={"bi-hash text-primary text-3xl"} />
|
||||
|
|
@ -223,7 +198,7 @@ export default function Index() {
|
|||
setRenameTag(true);
|
||||
}}
|
||||
>
|
||||
Rename Tag
|
||||
{t("rename_tag")}
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
|
|
@ -235,7 +210,7 @@ export default function Index() {
|
|||
remove();
|
||||
}}
|
||||
>
|
||||
Remove Tag
|
||||
{t("delete_tag")}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -245,83 +220,8 @@ export default function Index() {
|
|||
)}
|
||||
</div>
|
||||
</div>
|
||||
</LinkListOptions>
|
||||
|
||||
<div className="flex gap-2 items-center mt-2">
|
||||
<div
|
||||
role="button"
|
||||
onClick={() => {
|
||||
setEditMode(!editMode);
|
||||
setSelectedLinks([]);
|
||||
}}
|
||||
className={`btn btn-square btn-sm btn-ghost ${
|
||||
editMode
|
||||
? "bg-primary/20 hover:bg-primary/20"
|
||||
: "hover:bg-neutral/20"
|
||||
}`}
|
||||
>
|
||||
<i className="bi-pencil-fill text-neutral text-xl"></i>
|
||||
</div>
|
||||
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
|
||||
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
|
||||
</div>
|
||||
</div>
|
||||
{editMode && links.length > 0 && (
|
||||
<div className="w-full flex justify-between items-center min-h-[32px]">
|
||||
{links.length > 0 && (
|
||||
<div className="flex gap-3 ml-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
onChange={() => handleSelectAll()}
|
||||
checked={
|
||||
selectedLinks.length === links.length && links.length > 0
|
||||
}
|
||||
/>
|
||||
{selectedLinks.length > 0 ? (
|
||||
<span>
|
||||
{selectedLinks.length}{" "}
|
||||
{selectedLinks.length === 1 ? "link" : "links"} selected
|
||||
</span>
|
||||
) : (
|
||||
<span>Nothing selected</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => setBulkEditLinksModal(true)}
|
||||
className="btn btn-sm btn-accent text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canUpdate
|
||||
)
|
||||
}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
onClick={(e) => {
|
||||
(document?.activeElement as HTMLElement)?.blur();
|
||||
e.shiftKey
|
||||
? bulkDeleteLinks()
|
||||
: setBulkDeleteLinksModal(true);
|
||||
}}
|
||||
className="btn btn-sm bg-red-500 hover:bg-red-400 text-white w-fit ml-auto"
|
||||
disabled={
|
||||
selectedLinks.length === 0 ||
|
||||
!(
|
||||
collectivePermissions === true ||
|
||||
collectivePermissions?.canDelete
|
||||
)
|
||||
}
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<LinkComponent
|
||||
editMode={editMode}
|
||||
links={links.filter((e) =>
|
||||
|
|
@ -346,3 +246,5 @@ export default function Index() {
|
|||
</MainLayout>
|
||||
);
|
||||
}
|
||||
|
||||
export { getServerSideProps };
|
||||
|
|
|
|||
|
|
@ -1,3 +1,211 @@
|
|||
{
|
||||
"user_administration": "User Administration"
|
||||
"user_administration": "User Administration",
|
||||
"search_users": "Search for Users",
|
||||
"no_users_found": "No users found.",
|
||||
"no_user_found_in_search": "No users found with the given search query.",
|
||||
"username": "Username",
|
||||
"email": "Email",
|
||||
"subscribed": "Subscribed",
|
||||
"created_at": "Created At",
|
||||
"not_available": "N/A",
|
||||
"check_your_email": "Please check your Email",
|
||||
"authenticating": "Authenticating...",
|
||||
"verification_email_sent": "Verification email sent.",
|
||||
"verification_email_sent_desc": "A sign in link has been sent to your email address. If you don't see the email, check your spam folder.",
|
||||
"resend_email": "Resend Email",
|
||||
"invalid_credentials": "Invalid credentials.",
|
||||
"fill_all_fields": "Please fill out all the fields.",
|
||||
"enter_credentials": "Enter your credentials",
|
||||
"username_or_email": "Username or Email",
|
||||
"password": "Password",
|
||||
"confirm_password": "Confirm Password",
|
||||
"forgot_password": "Forgot Password?",
|
||||
"login": "Login",
|
||||
"or_continue_with": "Or continue with",
|
||||
"new_here": "New here?",
|
||||
"sign_up": "Sign Up",
|
||||
"sign_in_to_your_account": "Sign in to your account",
|
||||
"dashboard_desc": "A brief overview of your data",
|
||||
"link": "Link",
|
||||
"links": "Links",
|
||||
"collection": "Collection",
|
||||
"collections": "Collections",
|
||||
"tag": "Tag",
|
||||
"tags": "Tags",
|
||||
"recent": "Recent",
|
||||
"recent_links_desc": "Recently added Links",
|
||||
"view_all": "View All",
|
||||
"view_added_links_here": "View Your Recently Added Links Here!",
|
||||
"view_added_links_here_desc": "This section will view your latest added Links across every Collections you have access to.",
|
||||
"add_link": "Add New Link",
|
||||
"import_links": "Import Links",
|
||||
"from_linkwarden": "From Linkwarden",
|
||||
"from_html": "From Bookmarks HTML file",
|
||||
"from_wallabag": "From Wallabag (JSON file)",
|
||||
"pinned": "Pinned",
|
||||
"pinned_links_desc": "Your pinned Links",
|
||||
"pin_favorite_links_here": "Pin Your Favorite Links Here!",
|
||||
"pin_favorite_links_here_desc": "You can Pin your favorite Links by clicking on the three dots on each Link and clicking Pin to Dashboard.",
|
||||
"sending_password_link": "Sending password recovery link...",
|
||||
"password_email_prompt": "Enter your email so we can send you a link to create a new password.",
|
||||
"send_reset_link": "Send Reset Link",
|
||||
"reset_email_sent_desc": "Check your email for a link to reset your password. If it doesn’t appear within a few minutes, check your spam folder.",
|
||||
"back_to_login": "Back to Login",
|
||||
"email_sent": "Email Sent!",
|
||||
"passwords_mismatch": "Passwords do not match.",
|
||||
"password_too_short": "Passwords must be at least 8 characters.",
|
||||
"creating_account": "Creating Account...",
|
||||
"account_created": "Account Created!",
|
||||
"trial_offer_desc": "Unlock {{count}} days of Premium Service at no cost!",
|
||||
"register_desc": "Create a new account",
|
||||
"registration_disabled_desc": "Registration is disabled for this instance, please contact the admin in case of any issues.",
|
||||
"enter_details": "Enter your details",
|
||||
"display_name": "Display Name",
|
||||
"sign_up_agreement": "By signing up, you agree to our <0>Terms of Service</0> and <1>Privacy Policy</1>.",
|
||||
"need_help": "Need help?",
|
||||
"get_in_touch": "Get in touch",
|
||||
"already_registered": "Already have an account?",
|
||||
"deleting_selections": "Deleting selections...",
|
||||
"links_deleted": "{{count}} Links deleted.",
|
||||
"link_deleted": "1 Link deleted.",
|
||||
"links_selected": "{{count}} Links selected",
|
||||
"link_selected": "1 Link selected",
|
||||
"nothing_selected": "Nothing selected",
|
||||
"edit": "Edit",
|
||||
"delete": "Delete",
|
||||
"nothing_found": "Nothing found.",
|
||||
"redirecting_to_stripe": "Redirecting to Stripe...",
|
||||
"subscribe_title": "Subscribe to Linkwarden!",
|
||||
"subscribe_desc": "You will be redirected to Stripe, feel free to reach out to us at <0/> in case of any issue.",
|
||||
"monthly": "Monthly",
|
||||
"yearly": "Yearly",
|
||||
"discount_percent": "{{percent}}% Off",
|
||||
"billed_monthly": "Billed Monthly",
|
||||
"billed_yearly": "Billed Yearly",
|
||||
"total": "Total",
|
||||
"total_annual_desc": "{{count}}-day free trial, then ${{annualPrice}} annually",
|
||||
"total_monthly_desc": "{{count}}-day free trial, then ${{monthlyPrice}} per month",
|
||||
"plus_tax": "+ VAT if applicable",
|
||||
"complete_subscription": "Complete Subscription",
|
||||
"sign_out": "Sign Out",
|
||||
"access_tokens": "Access Tokens",
|
||||
"access_tokens_description": "Access Tokens can be used to access Linkwarden from other apps and services without giving away your Username and Password.",
|
||||
"new_token": "New Access Token",
|
||||
"name": "Name",
|
||||
"created": "Created",
|
||||
"expires": "Expires",
|
||||
"accountSettings": "Account Settings",
|
||||
"language": "Language",
|
||||
"profile_photo": "Profile Photo",
|
||||
"upload_new_photo": "Upload a new photo...",
|
||||
"remove_photo": "Remove Photo",
|
||||
"make_profile_private": "Make profile private",
|
||||
"profile_privacy_info": "This will limit who can find and add you to new Collections.",
|
||||
"whitelisted_users": "Whitelisted Users",
|
||||
"whitelisted_users_info": "Please provide the Username of the users you wish to grant visibility to your profile. Separated by comma.",
|
||||
"whitelisted_users_placeholder": "Your profile is hidden from everyone right now...",
|
||||
"save_changes": "Save Changes",
|
||||
"import_export": "Import & Export",
|
||||
"import_data": "Import your data from other platforms.",
|
||||
"download_data": "Download your data instantly.",
|
||||
"export_data": "Export Data",
|
||||
"delete_account": "Delete Account",
|
||||
"delete_account_warning": "This will permanently delete ALL the Links, Collections, Tags, and archived data you own.",
|
||||
"cancel_subscription_notice": "It will also cancel your subscription.",
|
||||
"account_deletion_page": "Account deletion page",
|
||||
"applying_settings": "Applying settings...",
|
||||
"settings_applied": "Settings Applied!",
|
||||
"email_change_request": "Email change request sent. Please verify the new email address.",
|
||||
"image_upload_size_error": "Please select a PNG or JPEG file that's less than 1MB.",
|
||||
"image_upload_format_error": "Invalid file format.",
|
||||
"importing_bookmarks": "Importing bookmarks...",
|
||||
"import_success": "Imported the bookmarks! Reloading the page...",
|
||||
"more_coming_soon": "More coming soon!",
|
||||
"billing_settings": "Billing Settings",
|
||||
"manage_subscription_intro": "To manage/cancel your subscription, visit the",
|
||||
"billing_portal": "Billing Portal",
|
||||
"help_contact_intro": "If you still need help or encountered any issues, feel free to reach out to us at:",
|
||||
"fill_required_fields": "Please fill the required fields.",
|
||||
"deleting_message": "Deleting everything, please wait...",
|
||||
"delete_warning": "This will permanently delete all the Links, Collections, Tags, and archived data you own. It will also log you out. This action is irreversible!",
|
||||
"optional": "Optional",
|
||||
"feedback_help": "(but it really helps us improve!)",
|
||||
"reason_for_cancellation": "Reason for cancellation",
|
||||
"please_specify": "Please specify",
|
||||
"customer_service": "Customer Service",
|
||||
"low_quality": "Low Quality",
|
||||
"missing_features": "Missing Features",
|
||||
"switched_service": "Switched Service",
|
||||
"too_complex": "Too Complex",
|
||||
"too_expensive": "Too Expensive",
|
||||
"unused": "Unused",
|
||||
"other": "Other",
|
||||
"more_information": "More information (the more details, the more helpful it'd be)",
|
||||
"feedback_placeholder": "e.g. I needed a feature that...",
|
||||
"delete_your_account": "Delete Your Account",
|
||||
"change_password": "Change Password",
|
||||
"password_length_error": "Passwords must be at least 8 characters.",
|
||||
"applying_changes": "Applying...",
|
||||
"password_change_instructions": "To change your password, please fill out the following. Your password should be at least 8 characters.",
|
||||
"old_password": "Old Password",
|
||||
"new_password": "New Password",
|
||||
"preference": "Preference",
|
||||
"select_theme": "Select Theme",
|
||||
"dark": "Dark",
|
||||
"light": "Light",
|
||||
"archive_settings": "Archive Settings",
|
||||
"formats_to_archive": "Formats to Archive/Preserve webpages:",
|
||||
"screenshot": "Screenshot",
|
||||
"pdf": "PDF",
|
||||
"archive_org_snapshot": "Archive.org Snapshot",
|
||||
"link_settings": "Link Settings",
|
||||
"prevent_duplicate_links": "Prevent duplicate links",
|
||||
"clicking_on_links_should": "Clicking on Links should:",
|
||||
"open_original_content": "Open the original content",
|
||||
"open_pdf_if_available": "Open PDF, if available",
|
||||
"open_readable_if_available": "Open Readable, if available",
|
||||
"open_screenshot_if_available": "Open Screenshot, if available",
|
||||
"tag_renamed": "Tag renamed!",
|
||||
"tag_deleted": "Tag deleted!",
|
||||
"rename_tag": "Rename Tag",
|
||||
"delete_tag": "Delete Tag",
|
||||
"list_created_with_linkwarden": "List created with Linkwarden",
|
||||
"by_author": "By {{author}}.",
|
||||
"by_author_and_other": "By {{author}} and {{count}} other.",
|
||||
"by_author_and_others": "By {{author}} and {{count}} others.",
|
||||
"search_count_link": "Search {{count}} Link",
|
||||
"search_count_links": "Search {{count}} Links",
|
||||
"collection_is_empty": "This Collection is empty...",
|
||||
"all_links": "All Links",
|
||||
"all_links_desc": "Links from every Collection",
|
||||
"you_have_not_added_any_links": "You Haven't Created Any Links Yet",
|
||||
"collections_you_own": "Collections you own",
|
||||
"new_collection": "New Collection",
|
||||
"other_collections": "Other Collections",
|
||||
"other_collections_desc": "Shared collections you're a member of",
|
||||
"showing_count_results": "Showing {{count}} results",
|
||||
"showing_count_result": "Showing {{count}} result",
|
||||
"edit_collection_info": "Edit Collection Info",
|
||||
"share_and_collaborate": "Share and Collaborate",
|
||||
"view_team": "View Team",
|
||||
"create_subcollection": "Create Sub-Collection",
|
||||
"delete_collection": "Delete Collection",
|
||||
"leave_collection": "Leave Collection",
|
||||
"email_verified_signing_out": "Email verified. Signing out...",
|
||||
"invalid_token": "Invalid token.",
|
||||
"sending_password_recovery_link": "Sending password recovery link...",
|
||||
"please_fill_all_fields": "Please fill out all the fields.",
|
||||
"password_updated": "Password Updated!",
|
||||
"reset_password": "Reset Password",
|
||||
"enter_email_for_new_password": "Enter your email so we can send you a link to create a new password.",
|
||||
"update_password": "Update Password",
|
||||
"password_successfully_updated": "Your password has been successfully updated.",
|
||||
"user_already_member": "User already exists.",
|
||||
"you_are_already_collection_owner": "You are already the collection owner.",
|
||||
"date_newest_first": "Date (Newest First)",
|
||||
"date_oldest_first": "Date (Oldest First)",
|
||||
"name_az": "Name (A-Z)",
|
||||
"name_za": "Name (Z-A)",
|
||||
"description_az": "Description (A-Z)",
|
||||
"description_za": "Description (Z-A)"
|
||||
}
|
||||
Ŝarĝante…
Reference in New Issue