2022-04-24 02:58:54 +00:00
|
|
|
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];
|
|
|
|
|
2022-04-24 03:20:03 +00:00
|
|
|
// console.log(currentItem, selectedItem, session);
|
2022-04-24 02:58:54 +00:00
|
|
|
|
|
|
|
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>
|
|
|
|
);
|
|
|
|
}
|