better component naming + folder structure

This commit is contained in:
daniel31x13 2023-12-21 05:08:56 -05:00
parent b7387b1e08
commit cb5e6de8b8
12 changed files with 38 additions and 36 deletions

View File

@ -1,4 +1,4 @@
import LinkCard from "@/components/LinkViews/LinkComponents/LinkCard"; import LinkCard from "@/components/LinkViews/LinkCard";
import { LinkIncludingShortenedCollectionAndTags } from "@/types/global"; import { LinkIncludingShortenedCollectionAndTags } from "@/types/global";
export default function DefaultGridView({ export default function DefaultGridView({

View File

@ -1,5 +1,5 @@
import LinkCardGrid from "@/components/LinkViews/LinkComponents/LinkCardGrid"; import LinkGrid from "@/components/LinkViews/LinkGrid";
import {LinkIncludingShortenedCollectionAndTags} from "@/types/global"; import { LinkIncludingShortenedCollectionAndTags } from "@/types/global";
export default function CompactGridView({ export default function CompactGridView({
links, links,
@ -11,7 +11,7 @@ export default function CompactGridView({
{links.map((e, i) => { {links.map((e, i) => {
return ( return (
<div key={i} className="break-inside-avoid mb-5"> <div key={i} className="break-inside-avoid mb-5">
<LinkCardGrid link={e} count={i}/> <LinkGrid link={e} count={i} />
</div> </div>
); );
})} })}

View File

@ -1,4 +1,4 @@
import LinkRow from "@/components/LinkViews/LinkComponents/LinkRow"; import LinkList from "@/components/LinkViews/LinkList";
import { LinkIncludingShortenedCollectionAndTags } from "@/types/global"; import { LinkIncludingShortenedCollectionAndTags } from "@/types/global";
export default function ListView({ export default function ListView({
@ -9,7 +9,7 @@ export default function ListView({
return ( return (
<div className="flex flex-col"> <div className="flex flex-col">
{links.map((e, i) => { {links.map((e, i) => {
return <LinkRow key={i} link={e} count={i} />; return <LinkList key={i} link={e} count={i} />;
})} })}
</div> </div>
); );

View File

@ -18,7 +18,7 @@ type Props = {
className?: string; className?: string;
}; };
export default function LinkCardGrid({ link, count, className }: Props) { export default function LinkGrid({ link, count, className }: Props) {
const { collections } = useCollectionStore(); const { collections } = useCollectionStore();
const { links } = useLinkStore(); const { links } = useLinkStore();

View File

@ -1,4 +1,4 @@
import LinkCard from "@/components/LinkViews/LinkComponents/LinkCard"; import LinkCard from "@/components/LinkViews/LinkCard";
import useCollectionStore from "@/store/collections"; import useCollectionStore from "@/store/collections";
import useLinkStore from "@/store/links"; import useLinkStore from "@/store/links";
import { import {
@ -21,9 +21,9 @@ import EditCollectionModal from "@/components/ModalContent/EditCollectionModal";
import EditCollectionSharingModal from "@/components/ModalContent/EditCollectionSharingModal"; import EditCollectionSharingModal from "@/components/ModalContent/EditCollectionSharingModal";
import DeleteCollectionModal from "@/components/ModalContent/DeleteCollectionModal"; import DeleteCollectionModal from "@/components/ModalContent/DeleteCollectionModal";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import DefaultView from "@/components/LinkViews/DefaultView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import GridView from "@/components/LinkViews/GridView"; import GridView from "@/components/LinkViews/Layouts/GridView";
import ListView from "@/components/LinkViews/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
export default function Index() { export default function Index() {
const { settings } = useLocalSettingsStore(); const { settings } = useLocalSettingsStore();
@ -91,7 +91,7 @@ export default function Index() {
); );
const linkView = { const linkView = {
[ViewMode.Default]: DefaultView, [ViewMode.Default]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
}; };

View File

@ -2,7 +2,7 @@ import useLinkStore from "@/store/links";
import useCollectionStore from "@/store/collections"; import useCollectionStore from "@/store/collections";
import useTagStore from "@/store/tags"; import useTagStore from "@/store/tags";
import MainLayout from "@/layouts/MainLayout"; import MainLayout from "@/layouts/MainLayout";
import LinkCard from "@/components/LinkViews/LinkComponents/LinkCard"; import LinkCard from "@/components/LinkViews/LinkCard";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import useLinks from "@/hooks/useLinks"; import useLinks from "@/hooks/useLinks";
import Link from "next/link"; import Link from "next/link";

View File

@ -7,8 +7,8 @@ import React, { useState } from "react";
import PageHeader from "@/components/PageHeader"; import PageHeader from "@/components/PageHeader";
import { Sort, ViewMode } from "@/types/global"; import { Sort, ViewMode } from "@/types/global";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import DefaultView from "@/components/LinkViews/DefaultView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import ListView from "@/components/LinkViews/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
export default function Links() { export default function Links() {
const { links } = useLinkStore(); const { links } = useLinkStore();
@ -21,7 +21,7 @@ export default function Links() {
useLinks({ sort: sortBy }); useLinks({ sort: sortBy });
const linkView = { const linkView = {
[ViewMode.Default]: DefaultView, [ViewMode.Default]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
}; };

View File

@ -6,8 +6,8 @@ import React, { useState } from "react";
import PageHeader from "@/components/PageHeader"; import PageHeader from "@/components/PageHeader";
import { Sort, ViewMode } from "@/types/global"; import { Sort, ViewMode } from "@/types/global";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import DefaultView from "@/components/LinkViews/DefaultView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import ListView from "@/components/LinkViews/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
export default function PinnedLinks() { export default function PinnedLinks() {
const { links } = useLinkStore(); const { links } = useLinkStore();
@ -20,7 +20,7 @@ export default function PinnedLinks() {
useLinks({ sort: sortBy, pinnedOnly: true }); useLinks({ sort: sortBy, pinnedOnly: true });
const linkView = { const linkView = {
[ViewMode.Default]: DefaultView, [ViewMode.Default]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
}; };

View File

@ -7,9 +7,9 @@ import { Sort, ViewMode } from "@/types/global";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import React, { useState } from "react"; import React, { useState } from "react";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import DefaultView from "@/components/LinkViews/DefaultView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import GridView from "@/components/LinkViews/GridView"; import GridView from "@/components/LinkViews/Layouts/GridView";
import ListView from "@/components/LinkViews/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
import PageHeader from "@/components/PageHeader"; import PageHeader from "@/components/PageHeader";
export default function Search() { export default function Search() {
@ -43,7 +43,7 @@ export default function Search() {
}); });
const linkView = { const linkView = {
[ViewMode.Default]: DefaultView, [ViewMode.Default]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
}; };

View File

@ -8,9 +8,9 @@ import { Sort, TagIncludingLinkCount, ViewMode } from "@/types/global";
import useLinks from "@/hooks/useLinks"; import useLinks from "@/hooks/useLinks";
import { toast } from "react-hot-toast"; import { toast } from "react-hot-toast";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import DefaultView from "@/components/LinkViews/DefaultView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import GridView from "@/components/LinkViews/GridView"; import GridView from "@/components/LinkViews/Layouts/GridView";
import ListView from "@/components/LinkViews/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
export default function Index() { export default function Index() {
const router = useRouter(); const router = useRouter();
@ -95,7 +95,7 @@ export default function Index() {
); );
const linkView = { const linkView = {
[ViewMode.Default]: DefaultView, [ViewMode.Default]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
}; };
@ -109,7 +109,7 @@ export default function Index() {
<div className="flex gap-3 items-center justify-between"> <div className="flex gap-3 items-center justify-between">
<div className="flex gap-3 items-center"> <div className="flex gap-3 items-center">
<div className="flex gap-2 items-center font-thin"> <div className="flex gap-2 items-center font-thin">
<i className={'bi-hash text-primary text-3xl'}/> <i className={"bi-hash text-primary text-3xl"} />
{renameTag ? ( {renameTag ? (
<> <>
@ -129,16 +129,16 @@ export default function Index() {
<i className={"bi-check text-neutral text-2xl"}></i> <i className={"bi-check text-neutral text-2xl"}></i>
</div> </div>
<div <div
onClick={() => cancelUpdateTag()} onClick={() => cancelUpdateTag()}
id="expand-dropdown" id="expand-dropdown"
className="btn btn-ghost btn-square btn-sm" className="btn btn-ghost btn-square btn-sm"
> >
<i className={"bi-x text-neutral text-2xl"}></i> <i className={"bi-x text-neutral text-2xl"}></i>
</div> </div>
</form> </form>
</> </>
) : ( ) : (
<> <>
<p className="sm:text-4xl text-3xl capitalize"> <p className="sm:text-4xl text-3xl capitalize">
{activeTag?.name} {activeTag?.name}
</p> </p>
@ -151,11 +151,13 @@ export default function Index() {
}`} }`}
> >
<div <div
tabIndex={0} tabIndex={0}
role="button" role="button"
className="btn btn-ghost btn-sm btn-square text-neutral" className="btn btn-ghost btn-sm btn-square text-neutral"
> >
<i className={"bi-three-dots text-neutral text-2xl"}></i> <i
className={"bi-three-dots text-neutral text-2xl"}
></i>
</div> </div>
<ul className="dropdown-content z-[30] menu shadow bg-base-200 border border-neutral-content rounded-box w-36 mt-1"> <ul className="dropdown-content z-[30] menu shadow bg-base-200 border border-neutral-content rounded-box w-36 mt-1">
<li> <li>