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

Added Masonry View

This commit is contained in:
Isaac Wise 2024-04-23 20:48:15 -05:00
parent f37a4b9c9e
commit 2b04bcb1df
13 changed files with 134 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
components/LinkViews/Layouts/MasonryView.tsx Normal file
View File

@ -0,0 +1,40 @@
import LinkCard from "@/components/LinkViews/LinkCard";
import { LinkIncludingShortenedCollectionAndTags } from "@/types/global";
import { GridLoader } from "react-spinners";
import Masonry from 'react-masonry-css'
export default function MasonryView({
links,
editMode,
isLoading,
}: {
links: LinkIncludingShortenedCollectionAndTags[];
editMode?: boolean;
isLoading?: boolean;
}) {
return (
<Masonry breakpointCols={4} columnClassName="!w-full flex flex-col gap-5" className="grid min-[1900px]:grid-cols-4 xl:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-5">
{links.map((e, i) => {
return (
<LinkCard
key={i}
link={e}
count={i}
flipDropdown={i === links.length - 1}
editMode={editMode}
/>
);
})}
{isLoading && links.length > 0 && (
<GridLoader
color="oklch(var(--p))"
loading={true}
size={20}
className="fixed top-5 right-5 opacity-50 z-30"
/>
)}
</Masonry>
);
}

61
components/LinkViews/LinkCard.tsx
View File

@ -30,6 +30,7 @@ type Props = {
}; };
export default function LinkCard({ link, flipDropdown, editMode }: Props) { export default function LinkCard({ link, flipDropdown, editMode }: Props) {
const viewMode = localStorage.getItem("viewMode") || "card";
const { collections } = useCollectionStore(); const { collections } = useCollectionStore();
const { account } = useAccountStore(); const { account } = useAccountStore();
@ -121,8 +122,8 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
? handleCheckboxClick(link) ? handleCheckboxClick(link)
: editMode : editMode
? toast.error( ? toast.error(
"You don't have permission to edit or delete this item." "You don't have permission to edit or delete this item."
) )
: undefined : undefined
} }
> >
@ -132,32 +133,36 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
!editMode && window.open(generateLinkHref(link, account), "_blank") !editMode && window.open(generateLinkHref(link, account), "_blank")
} }
> >
<div className="relative rounded-t-2xl h-40 overflow-hidden"> {viewMode === 'masonry' && !(previewAvailable(link)) ? null : (
{previewAvailable(link) ? ( <>
<Image <div className="relative rounded-t-2xl h-40 overflow-hidden">
src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.jpeg}&preview=true`} {previewAvailable(link) ? (
width={1280} <Image
height={720} src={`/api/v1/archives/${link.id}?format=${ArchivedFormat.jpeg}&preview=true`}
alt="" width={1280}
className="rounded-t-2xl select-none object-cover z-10 h-40 w-full shadow opacity-80 scale-105" height={720}
style={{ filter: "blur(2px)" }} alt=""
draggable="false" className="rounded-t-2xl select-none object-cover z-10 h-40 w-full shadow opacity-80 scale-105"
onError={(e) => { style={{ filter: "blur(2px)" }}
const target = e.target as HTMLElement; draggable="false"
target.style.display = "none"; onError={(e) => {
}} const target = e.target as HTMLElement;
/> target.style.display = "none";
) : link.preview === "unavailable" ? ( }}
<div className="bg-gray-50 duration-100 h-40 bg-opacity-80"></div> />
) : ( ) : link.preview === "unavailable" ? (
<div className="duration-100 h-40 bg-opacity-80 skeleton rounded-none"></div> <div className="bg-gray-50 duration-100 h-40 bg-opacity-80"></div>
)} ) : (
<div className="absolute top-0 left-0 right-0 bottom-0 rounded-t-2xl flex items-center justify-center shadow rounded-md"> <div className="duration-100 h-40 bg-opacity-80 skeleton rounded-none"></div>
<LinkIcon link={link} /> )}
</div> <div className="absolute top-0 left-0 right-0 bottom-0 rounded-t-2xl flex items-center justify-center shadow rounded-md">
</div> <LinkIcon link={link} />
</div>
</div>
<hr className="divider my-0 last:hidden border-t border-neutral-content h-[1px]" /> <hr className="divider my-0 last:hidden border-t border-neutral-content h-[1px]" />
</>
)}
<div className="p-3 mt-1"> <div className="p-3 mt-1">
<p className="truncate w-full pr-8 text-primary"> <p className="truncate w-full pr-8 text-primary">
@ -229,7 +234,7 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
<LinkActions <LinkActions
link={link} link={link}
collection={collection} collection={collection}
position="top-[10.75rem] right-3" position={!(previewAvailable(link)) && viewMode === 'masonry' ? "top-[.75rem] right-3" : "top-[10.75rem] right-3"}
toggleShowInfo={() => setShowInfo(!showInfo)} toggleShowInfo={() => setShowInfo(!showInfo)}
linkInfo={showInfo} linkInfo={showInfo}
flipDropdown={flipDropdown} flipDropdown={flipDropdown}

28
components/ViewDropdown.tsx
View File

@ -26,22 +26,30 @@ export default function ViewDropdown({ viewMode, setViewMode }: Props) {
<div className="p-1 flex flex-row gap-1 border border-neutral-content rounded-[0.625rem]"> <div className="p-1 flex flex-row gap-1 border border-neutral-content rounded-[0.625rem]">
<button <button
onClick={(e) => onChangeViewMode(e, ViewMode.Card)} onClick={(e) => onChangeViewMode(e, ViewMode.Card)}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${viewMode == ViewMode.Card
viewMode == ViewMode.Card ? "bg-primary/20 hover:bg-primary/20"
? "bg-primary/20 hover:bg-primary/20" : "hover:bg-neutral/20"
: "hover:bg-neutral/20" }`}
}`}
> >
<i className="bi-grid w-4 h-4 text-neutral"></i> <i className="bi-grid w-4 h-4 text-neutral"></i>
</button> </button>
<button
onClick={(e) => onChangeViewMode(e, ViewMode.Masonry)}
className={`btn btn-square btn-sm btn-ghost ${viewMode == ViewMode.Masonry
? "bg-primary/20 hover:bg-primary/20"
: "hover:bg-neutral/20"
}`}
>
<i className="bi bi-columns-gap w-4 h-4 text-neutral"></i>
</button>
<button <button
onClick={(e) => onChangeViewMode(e, ViewMode.List)} onClick={(e) => onChangeViewMode(e, ViewMode.List)}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${viewMode == ViewMode.List
viewMode == ViewMode.List ? "bg-primary/20 hover:bg-primary/20"
? "bg-primary/20 hover:bg-primary/20" : "hover:bg-neutral/20"
: "hover:bg-neutral/20" }`}
}`}
> >
<i className="bi bi-view-stacked w-4 h-4 text-neutral"></i> <i className="bi bi-view-stacked w-4 h-4 text-neutral"></i>
</button> </button>

1
package.json
View File

@ -60,6 +60,7 @@
"react-dom": "18.2.0", "react-dom": "18.2.0",
"react-hot-toast": "^2.4.1", "react-hot-toast": "^2.4.1",
"react-image-file-resizer": "^0.4.8", "react-image-file-resizer": "^0.4.8",
"react-masonry-css": "^1.0.16",
"react-select": "^5.7.4", "react-select": "^5.7.4",
"react-spinners": "^0.13.8", "react-spinners": "^0.13.8",
"socks-proxy-agent": "^8.0.2", "socks-proxy-agent": "^8.0.2",

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

@ -28,6 +28,7 @@ import NewCollectionModal from "@/components/ModalContent/NewCollectionModal";
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal"; import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
import toast from "react-hot-toast"; import toast from "react-hot-toast";
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal"; import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
export default function Index() { export default function Index() {
const { settings } = useLocalSettingsStore(); const { settings } = useLocalSettingsStore();
@ -110,6 +111,7 @@ export default function Index() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore
@ -125,8 +127,7 @@ export default function Index() {
const bulkDeleteLinks = async () => { const bulkDeleteLinks = async () => {
const load = toast.loading( const load = toast.loading(
`Deleting ${selectedLinks.length} Link${ `Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}...` }...`
); );
@ -138,8 +139,7 @@ export default function Index() {
response.ok && response.ok &&
toast.success( toast.success(
`Deleted ${selectedLinks.length} Link${ `Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}!` }!`
); );
}; };
@ -149,9 +149,8 @@ export default function Index() {
<div <div
className="h-[60rem] p-5 flex gap-3 flex-col" className="h-[60rem] p-5 flex gap-3 flex-col"
style={{ style={{
backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${ backgroundImage: `linear-gradient(${activeCollection?.color}20 10%, ${settings.theme === "dark" ? "#262626" : "#f3f4f6"
settings.theme === "dark" ? "#262626" : "#f3f4f6" } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
}} }}
> >
{activeCollection && ( {activeCollection && (
@ -326,11 +325,10 @@ export default function Index() {
setEditMode(!editMode); setEditMode(!editMode);
setSelectedLinks([]); setSelectedLinks([]);
}} }}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${editMode
editMode
? "bg-primary/20 hover:bg-primary/20" ? "bg-primary/20 hover:bg-primary/20"
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
}`} }`}
> >
<i className="bi-pencil-fill text-neutral text-xl"></i> <i className="bi-pencil-fill text-neutral text-xl"></i>
</div> </div>

2
pages/dashboard.tsx
View File

@ -16,6 +16,7 @@ import CardView from "@/components/LinkViews/Layouts/CardView";
import ListView from "@/components/LinkViews/Layouts/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import { dropdownTriggerer } from "@/lib/client/utils"; import { dropdownTriggerer } from "@/lib/client/utils";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
// import GridView from "@/components/LinkViews/Layouts/GridView"; // import GridView from "@/components/LinkViews/Layouts/GridView";
export default function Dashboard() { export default function Dashboard() {
@ -102,6 +103,7 @@ export default function Dashboard() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore

13
pages/links/index.tsx
View File

@ -15,6 +15,7 @@ import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal"; import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
// import GridView from "@/components/LinkViews/Layouts/GridView"; // import GridView from "@/components/LinkViews/Layouts/GridView";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
export default function Links() { export default function Links() {
const { links, selectedLinks, deleteLinksById, setSelectedLinks } = const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
@ -51,8 +52,7 @@ export default function Links() {
const bulkDeleteLinks = async () => { const bulkDeleteLinks = async () => {
const load = toast.loading( const load = toast.loading(
`Deleting ${selectedLinks.length} Link${ `Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}...` }...`
); );
@ -64,8 +64,7 @@ export default function Links() {
response.ok && response.ok &&
toast.success( toast.success(
`Deleted ${selectedLinks.length} Link${ `Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}!` }!`
); );
}; };
@ -74,6 +73,7 @@ export default function Links() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore
@ -97,11 +97,10 @@ export default function Links() {
setEditMode(!editMode); setEditMode(!editMode);
setSelectedLinks([]); setSelectedLinks([]);
}} }}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${editMode
editMode
? "bg-primary/20 hover:bg-primary/20" ? "bg-primary/20 hover:bg-primary/20"
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
}`} }`}
> >
<i className="bi-pencil-fill text-neutral text-xl"></i> <i className="bi-pencil-fill text-neutral text-xl"></i>
</div> </div>

13
pages/links/pinned.tsx
View File

@ -14,6 +14,7 @@ import useCollectivePermissions from "@/hooks/useCollectivePermissions";
import toast from "react-hot-toast"; import toast from "react-hot-toast";
// import GridView from "@/components/LinkViews/Layouts/GridView"; // import GridView from "@/components/LinkViews/Layouts/GridView";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
export default function PinnedLinks() { export default function PinnedLinks() {
const { links, selectedLinks, deleteLinksById, setSelectedLinks } = const { links, selectedLinks, deleteLinksById, setSelectedLinks } =
@ -49,8 +50,7 @@ export default function PinnedLinks() {
const bulkDeleteLinks = async () => { const bulkDeleteLinks = async () => {
const load = toast.loading( const load = toast.loading(
`Deleting ${selectedLinks.length} Link${ `Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}...` }...`
); );
@ -62,8 +62,7 @@ export default function PinnedLinks() {
response.ok && response.ok &&
toast.success( toast.success(
`Deleted ${selectedLinks.length} Link${ `Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}!` }!`
); );
}; };
@ -72,6 +71,7 @@ export default function PinnedLinks() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore
@ -94,11 +94,10 @@ export default function PinnedLinks() {
setEditMode(!editMode); setEditMode(!editMode);
setSelectedLinks([]); setSelectedLinks([]);
}} }}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${editMode
editMode
? "bg-primary/20 hover:bg-primary/20" ? "bg-primary/20 hover:bg-primary/20"
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
}`} }`}
> >
<i className="bi-pencil-fill text-neutral text-xl"></i> <i className="bi-pencil-fill text-neutral text-xl"></i>
</div> </div>

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

@ -24,6 +24,7 @@ import EditCollectionSharingModal from "@/components/ModalContent/EditCollection
import ViewDropdown from "@/components/ViewDropdown"; import ViewDropdown from "@/components/ViewDropdown";
import CardView from "@/components/LinkViews/Layouts/CardView"; import CardView from "@/components/LinkViews/Layouts/CardView";
import ListView from "@/components/LinkViews/Layouts/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
// import GridView from "@/components/LinkViews/Layouts/GridView"; // import GridView from "@/components/LinkViews/Layouts/GridView";
const cardVariants: Variants = { const cardVariants: Variants = {
@ -109,6 +110,7 @@ export default function PublicCollections() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore
@ -118,9 +120,8 @@ export default function PublicCollections() {
<div <div
className="h-96" className="h-96"
style={{ style={{
backgroundImage: `linear-gradient(${collection?.color}30 10%, ${ backgroundImage: `linear-gradient(${collection?.color}30 10%, ${settings.theme === "dark" ? "#262626" : "#f3f4f6"
settings.theme === "dark" ? "#262626" : "#f3f4f6" } 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
} 13rem, ${settings.theme === "dark" ? "#171717" : "#ffffff"} 100%)`,
}} }}
> >
{collection ? ( {collection ? (

2
pages/search.tsx
View File

@ -12,6 +12,7 @@ import CardView from "@/components/LinkViews/Layouts/CardView";
import ListView from "@/components/LinkViews/Layouts/ListView"; import ListView from "@/components/LinkViews/Layouts/ListView";
import PageHeader from "@/components/PageHeader"; import PageHeader from "@/components/PageHeader";
import { GridLoader, PropagateLoader } from "react-spinners"; import { GridLoader, PropagateLoader } from "react-spinners";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
export default function Search() { export default function Search() {
const { links } = useLinkStore(); const { links } = useLinkStore();
@ -49,6 +50,7 @@ export default function Search() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore

18
pages/tags/[id].tsx
View File

@ -15,6 +15,7 @@ import { dropdownTriggerer } from "@/lib/client/utils";
import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal"; import BulkDeleteLinksModal from "@/components/ModalContent/BulkDeleteLinksModal";
import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal"; import BulkEditLinksModal from "@/components/ModalContent/BulkEditLinksModal";
import useCollectivePermissions from "@/hooks/useCollectivePermissions"; import useCollectivePermissions from "@/hooks/useCollectivePermissions";
import MasonryView from "@/components/LinkViews/Layouts/MasonryView";
export default function Index() { export default function Index() {
const router = useRouter(); const router = useRouter();
@ -124,8 +125,7 @@ export default function Index() {
const bulkDeleteLinks = async () => { const bulkDeleteLinks = async () => {
const load = toast.loading( const load = toast.loading(
`Deleting ${selectedLinks.length} Link${ `Deleting ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}...` }...`
); );
@ -137,8 +137,7 @@ export default function Index() {
response.ok && response.ok &&
toast.success( toast.success(
`Deleted ${selectedLinks.length} Link${ `Deleted ${selectedLinks.length} Link${selectedLinks.length > 1 ? "s" : ""
selectedLinks.length > 1 ? "s" : ""
}!` }!`
); );
}; };
@ -151,6 +150,7 @@ export default function Index() {
[ViewMode.Card]: CardView, [ViewMode.Card]: CardView,
// [ViewMode.Grid]: GridView, // [ViewMode.Grid]: GridView,
[ViewMode.List]: ListView, [ViewMode.List]: ListView,
[ViewMode.Masonry]: MasonryView,
}; };
// @ts-ignore // @ts-ignore
@ -197,11 +197,10 @@ export default function Index() {
</p> </p>
<div className="relative"> <div className="relative">
<div <div
className={`dropdown dropdown-bottom font-normal ${ className={`dropdown dropdown-bottom font-normal ${activeTag?.name.length && activeTag?.name.length > 8
activeTag?.name.length && activeTag?.name.length > 8
? "dropdown-end" ? "dropdown-end"
: "" : ""
}`} }`}
> >
<div <div
tabIndex={0} tabIndex={0}
@ -253,11 +252,10 @@ export default function Index() {
setEditMode(!editMode); setEditMode(!editMode);
setSelectedLinks([]); setSelectedLinks([]);
}} }}
className={`btn btn-square btn-sm btn-ghost ${ className={`btn btn-square btn-sm btn-ghost ${editMode
editMode
? "bg-primary/20 hover:bg-primary/20" ? "bg-primary/20 hover:bg-primary/20"
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
}`} }`}
> >
<i className="bi-pencil-fill text-neutral text-xl"></i> <i className="bi-pencil-fill text-neutral text-xl"></i>
</div> </div>

1
types/global.ts
View File

@ -68,6 +68,7 @@ export enum ViewMode {
Card = "card", Card = "card",
Grid = "grid", Grid = "grid",
List = "list", List = "list",
Masonry = "masonry",
} }
export enum Sort { export enum Sort {

5
yarn.lock
View File

@ -5165,6 +5165,11 @@ react-is@^17.0.2:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0" resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w== integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
react-masonry-css@^1.0.16:
version "1.0.16"
resolved "https://registry.yarnpkg.com/react-masonry-css/-/react-masonry-css-1.0.16.tgz#72b28b4ae3484e250534700860597553a10f1a2c"
integrity sha512-KSW0hR2VQmltt/qAa3eXOctQDyOu7+ZBevtKgpNDSzT7k5LA/0XntNa9z9HKCdz3QlxmJHglTZ18e4sX4V8zZQ==
react-redux@^7.0.3: react-redux@^7.0.3:
version "7.2.9" version "7.2.9"
resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.2.9.tgz#09488fbb9416a4efe3735b7235055442b042481d" resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.2.9.tgz#09488fbb9416a4efe3735b7235055442b042481d"