borders/components/borderPreview.js

47 lines
1.1 KiB
JavaScript

import BorderImage from "./borderImage";
import styles from "../styles/Components.module.css";
import { useSession } from "next-auth/react";
export default function Preview(props) {
const { data: session } = useSession();
const { data, current, selected, apply } = props;
const currentItem = data?.filter(
(item) => parseInt(item.id) === (current != null ? parseInt(current) : 0)
)?.[0];
const selectedItem = data?.filter(
(item) => parseInt(item.id) === parseInt(selected)
)?.[0];
// console.log(currentItem, selectedItem, session);
return (
<div className={styles.preview}>
current
<br />
{currentItem && (
<BorderImage
border={currentItem}
selected={-1}
size={256}
customImage={session?.user?.image}
/>
)}
<br />
new
<br />
{selectedItem && (
<BorderImage
border={selectedItem}
selected={-1}
size={256}
customImage={session?.user?.image}
/>
)}
<br />
<button onClick={apply}>Apply</button>
</div>
);
}