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

final polishing

Browse Source
This commit is contained in:
daniel31x13
2024-02-13 05:54:18 -05:00
parent a3c487d074
commit 155c77cbc4
8 changed files with 239 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/collections/[id].tsx
+48 -45
View File
@@ -121,7 +121,8 @@ export default function Index() {
const bulkDeleteLinks = async () => {
const load = toast.loading(
`Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleting ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}...`
);
@@ -133,7 +134,8 @@ export default function Index() {
response.ok &&
toast.success(
`Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleted ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}!`
);
};
@@ -143,8 +145,9 @@ export default function Index() {
<div
className="h-[60rem] p-5 flex gap-3 flex-col"
style={{
backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${settings.theme === "dark" ? "#262626" : "#f3f4f6"
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${
settings.theme === "dark" ? "#262626" : "#f3f4f6"
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
}}
>
{activeCollection && (
@@ -309,21 +312,25 @@ export default function Index() {
<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 || 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"
{links.length > 0 &&
(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>
)}
>
<i className="bi-pencil-fill text-neutral text-xl"></i>
</div>
)}
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
</div>
@@ -352,31 +359,29 @@ export default function Index() {
</div>
)}
<div className="flex gap-3">
{(permissions === true ||
permissions?.canUpdate) && (
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
{(permissions === true ||
permissions?.canDelete) && (
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
{(permissions === true || permissions?.canUpdate) && (
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
{(permissions === true || permissions?.canDelete) && (
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
</div>
</div>
)}
@@ -422,7 +427,6 @@ export default function Index() {
<BulkDeleteLinksModal
onClose={() => {
setBulkDeleteLinksModal(false);
setEditMode(false);
}}
/>
)}
@@ -430,7 +434,6 @@ export default function Index() {
<BulkEditLinksModal
onClose={() => {
setBulkEditLinksModal(false);
setEditMode(false);
}}
/>
)}
pages/links/index.tsx
+33 -32
View File
@@ -28,7 +28,7 @@ export default function Links() {
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
const [editMode, setEditMode] = useState(false);
const collectivePermissions = useCollectivePermissions(
links.map((link) => link.collectionId as number)
selectedLinks.map((link) => link.collectionId as number)
);
useLinks({ sort: sortBy });
@@ -43,7 +43,8 @@ export default function Links() {
const bulkDeleteLinks = async () => {
const load = toast.loading(
`Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleting ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}...`
);
@@ -55,7 +56,8 @@ export default function Links() {
response.ok &&
toast.success(
`Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleted ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}!`
);
};
@@ -69,7 +71,7 @@ export default function Links() {
// @ts-ignore
const LinkComponent = linkView[viewMode];
console.log(collectivePermissions)
console.log(collectivePermissions);
return (
<MainLayout>
<div className="p-5 flex flex-col gap-5 w-full h-full">
@@ -81,17 +83,18 @@ export default function Links() {
/>
<div className="mt-2 flex items-center justify-end gap-2">
{links.length > 0 && (collectivePermissions === true || collectivePermissions?.canUpdate || collectivePermissions?.canDelete) && (
{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"
}`}
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>
@@ -126,29 +129,29 @@ export default function Links() {
<div className="flex gap-3">
{(collectivePermissions === true ||
collectivePermissions?.canUpdate) && (
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
{(collectivePermissions === true ||
collectivePermissions?.canDelete) && (
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
</div>
</div>
)}
@@ -163,7 +166,6 @@ export default function Links() {
<BulkDeleteLinksModal
onClose={() => {
setBulkDeleteLinksModal(false);
setEditMode(false);
}}
/>
)}
@@ -171,7 +173,6 @@ export default function Links() {
<BulkEditLinksModal
onClose={() => {
setBulkEditLinksModal(false);
setEditMode(false);
}}
/>
)}
pages/links/pinned.tsx
+32 -33
View File
@@ -29,11 +29,9 @@ export default function PinnedLinks() {
const [bulkEditLinksModal, setBulkEditLinksModal] = useState(false);
const [editMode, setEditMode] = useState(false);
const collectivePermissions = useCollectivePermissions(
links.map((link) => link.collectionId as number)
selectedLinks.map((link) => link.collectionId as number)
);
useLinks({ sort: sortBy });
const handleSelectAll = () => {
if (selectedLinks.length === links.length) {
setSelectedLinks([]);
@@ -44,7 +42,8 @@ export default function PinnedLinks() {
const bulkDeleteLinks = async () => {
const load = toast.loading(
`Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleting ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}...`
);
@@ -56,7 +55,8 @@ export default function PinnedLinks() {
response.ok &&
toast.success(
`Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleted ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}!`
);
};
@@ -80,17 +80,18 @@ export default function PinnedLinks() {
description={"Pinned Links from your Collections"}
/>
<div className="mt-2 flex items-center justify-end gap-2">
{links.length > 0 && (collectivePermissions === true || collectivePermissions?.canUpdate || collectivePermissions?.canDelete) && (
{!(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"
}`}
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>
@@ -125,29 +126,29 @@ export default function PinnedLinks() {
<div className="flex gap-3">
{(collectivePermissions === true ||
collectivePermissions?.canUpdate) && (
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
{(collectivePermissions === true ||
collectivePermissions?.canDelete) && (
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
</div>
</div>
)}
@@ -174,7 +175,6 @@ export default function PinnedLinks() {
<BulkDeleteLinksModal
onClose={() => {
setBulkDeleteLinksModal(false);
setEditMode(false);
}}
/>
)}
@@ -182,7 +182,6 @@ export default function PinnedLinks() {
<BulkEditLinksModal
onClose={() => {
setBulkEditLinksModal(false);
setEditMode(false);
}}
/>
)}
pages/tags/[id].tsx
+42 -42
View File
@@ -119,7 +119,8 @@ export default function Index() {
const bulkDeleteLinks = async () => {
const load = toast.loading(
`Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleting ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}...`
);
@@ -131,7 +132,8 @@ export default function Index() {
response.ok &&
toast.success(
`Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
`Deleted ${selectedLinks.length} Link${
selectedLinks.length > 1 ? "s" : ""
}!`
);
};
@@ -190,10 +192,11 @@ export default function Index() {
</p>
<div className="relative">
<div
className={`dropdown dropdown-bottom font-normal ${activeTag?.name.length && activeTag?.name.length > 8
? "dropdown-end"
: ""
}`}
className={`dropdown dropdown-bottom font-normal ${
activeTag?.name.length && activeTag?.name.length > 8
? "dropdown-end"
: ""
}`}
>
<div
tabIndex={0}
@@ -239,21 +242,20 @@ export default function Index() {
</div>
<div className="flex gap-2 items-center mt-2">
{links.length > 0 && (collectivePermissions === true || collectivePermissions?.canUpdate || collectivePermissions?.canDelete) && (
<div
role="button"
onClick={() => {
setEditMode(!editMode);
setSelectedLinks([]);
}}
className={`btn btn-square btn-sm btn-ghost ${editMode
<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>
)}
}`}
>
<i className="bi-pencil-fill text-neutral text-xl"></i>
</div>
<SortDropdown sortBy={sortBy} setSort={setSortBy} />
<ViewDropdown viewMode={viewMode} setViewMode={setViewMode} />
</div>
@@ -283,29 +285,29 @@ export default function Index() {
<div className="flex gap-3">
{(collectivePermissions === true ||
collectivePermissions?.canUpdate) && (
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
<button
onClick={() => setBulkEditLinksModal(true)}
className="btn btn-sm btn-accent text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Edit
</button>
)}
{(collectivePermissions === true ||
collectivePermissions?.canDelete) && (
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
<button
onClick={(e) => {
(document?.activeElement as HTMLElement)?.blur();
e.shiftKey
? bulkDeleteLinks()
: setBulkDeleteLinksModal(true);
}}
className="btn btn-sm bg-red-400 border-red-400 hover:border-red-500 hover:bg-red-500 text-white w-fit ml-auto"
disabled={selectedLinks.length === 0}
>
Delete
</button>
)}
</div>
</div>
)}
@@ -320,7 +322,6 @@ export default function Index() {
<BulkDeleteLinksModal
onClose={() => {
setBulkDeleteLinksModal(false);
setEditMode(false);
}}
/>
)}
@@ -328,7 +329,6 @@ export default function Index() {
<BulkEditLinksModal
onClose={() => {
setBulkEditLinksModal(false);
setEditMode(false);
}}
/>
)}