proxyraye-nextjs/src/components/Layout/Header/Menu/Settings/Modal/Orientation/index.tsx

63 lines
1.8 KiB
TypeScript

'use client'
import { Cookies, Platforms, XVideosOrientations, PornHubOrientations, YouPornOrientations, RedTubeOrientations } from '@/meta/settings';
import css from './Orientation.module.scss'
import React from 'react';
import { setCookie } from '@/utils/cookies/write';
import { useCookies } from 'react-cookie';
interface Props {
handleClose(): void
labels: {
title: string,
}
}
const getOrientations = (platform: Platforms):Object => {
if ([Platforms.xnxx, Platforms.xvideos].includes(platform)) {
return XVideosOrientations
}
if([Platforms.youporn].includes(platform)) {
return YouPornOrientations
}
if([Platforms.redtube].includes(platform)) {
return RedTubeOrientations
}
return PornHubOrientations
}
const Orientation: React.FC<Props> = (props) => {
const { labels, handleClose } = props
const [cookies] = useCookies([Cookies.orientation, Cookies.platform]);
const orientationsList = cookies.platform ? getOrientations(cookies.platform ) : XVideosOrientations
const handleChange = async (event: React.ChangeEvent<HTMLSelectElement>) => {
const value = event.target.value;
await setCookie(Cookies.orientation, value)
handleClose()
}
return (
<div className={css.container}>
<div className={css.title}>{labels.title}</div>
<select defaultValue={ cookies.orientation ?? XVideosOrientations.etero } onChange={handleChange} name={'orientation'} aria-label={labels.title}>
{Object.keys(orientationsList).map((elem, key) => {
return <option className={css.option} key={key} value={elem}>{elem.toUpperCase()}</option>
})}
</select>
</div>
);
};
export default Orientation;