mirror of
https://github.com/Radiquum/AniX.git
synced 2025-04-06 00:04:39 +00:00
feat: add watch dynamic graph
This commit is contained in:
parent
6e8f03e7b6
commit
7dac3c072e
GPG key ID:
858E8EE696525EED
7 changed files with 133 additions and 334 deletions
|
|
@ -119,12 +119,11 @@ const months = [
|
||||||
"дек.",
|
"дек.",
|
||||||
];
|
];
|
||||||
|
|
||||||
export function unixToDate(unix: number, type: string = "short") {
|
export function unixToDate(
|
||||||
|
unix: number,
|
||||||
|
type: "full" | "dayMonth" | "dayMonthYear"
|
||||||
|
) {
|
||||||
const date = new Date(unix * 1000);
|
const date = new Date(unix * 1000);
|
||||||
if (type === "short")
|
|
||||||
return (
|
|
||||||
date.getDate() + " " + months[date.getMonth()] + " " + date.getFullYear()
|
|
||||||
);
|
|
||||||
if (type === "full")
|
if (type === "full")
|
||||||
return (
|
return (
|
||||||
date.getDate() +
|
date.getDate() +
|
||||||
|
|
@ -137,6 +136,12 @@ export function unixToDate(unix: number, type: string = "short") {
|
||||||
":" +
|
":" +
|
||||||
date.getMinutes()
|
date.getMinutes()
|
||||||
);
|
);
|
||||||
|
if (type === "dayMonth")
|
||||||
|
return date.getDate() + " " + months[date.getMonth()];
|
||||||
|
if (type === "dayMonthYear")
|
||||||
|
return (
|
||||||
|
date.getDate() + " " + months[date.getMonth()] + " " + date.getFullYear()
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getSeasonFromUnix = (unix: number) => {
|
export const getSeasonFromUnix = (unix: number) => {
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,3 @@
|
||||||
import { unixToDate } from "#/api/utils";
|
|
||||||
|
|
||||||
export const ProfilePrivacyBanner = (props: { is_privacy: boolean }) => {
|
export const ProfilePrivacyBanner = (props: { is_privacy: boolean }) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
|
||||||
102
app/components/Profile/Profile.WatchDynamic.tsx
Normal file
102
app/components/Profile/Profile.WatchDynamic.tsx
Normal file
|
|
@ -0,0 +1,102 @@
|
||||||
|
import { Card } from "flowbite-react";
|
||||||
|
import ApexCharts, { ApexOptions } from "apexcharts";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
import { unixToDate } from "#/api/utils";
|
||||||
|
export const ProfileWatchDynamic = (props: { watchDynamic: Array<any> }) => {
|
||||||
|
const lastTenDays = props.watchDynamic.slice(
|
||||||
|
Math.max(props.watchDynamic.length - 10, 0)
|
||||||
|
);
|
||||||
|
const data = {
|
||||||
|
ids: lastTenDays.map((item) => item.id),
|
||||||
|
counts: lastTenDays.map((item) => item.count),
|
||||||
|
timestamps: lastTenDays.map((item) =>
|
||||||
|
unixToDate(item.timestamp, "dayMonth")
|
||||||
|
),
|
||||||
|
};
|
||||||
|
|
||||||
|
const options: ApexOptions = {
|
||||||
|
chart: {
|
||||||
|
height: "100%",
|
||||||
|
type: "area",
|
||||||
|
fontFamily: "Inter, sans-serif",
|
||||||
|
dropShadow: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
toolbar: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
enabled: true,
|
||||||
|
x: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
type: "gradient",
|
||||||
|
gradient: {
|
||||||
|
opacityFrom: 0.55,
|
||||||
|
opacityTo: 0,
|
||||||
|
shade: "#1C64F2",
|
||||||
|
gradientToColors: ["#1C64F2"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
dataLabels: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
stroke: {
|
||||||
|
width: 6,
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
show: true,
|
||||||
|
strokeDashArray: 4,
|
||||||
|
padding: {
|
||||||
|
left: 2,
|
||||||
|
right: 2,
|
||||||
|
top: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: "Серий",
|
||||||
|
data: data.counts,
|
||||||
|
color: "#1C64F2",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
xaxis: {
|
||||||
|
categories: data.timestamps,
|
||||||
|
labels: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisBorder: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisTicks: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yaxis: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (
|
||||||
|
document.getElementById("area-chart") &&
|
||||||
|
typeof ApexCharts !== "undefined"
|
||||||
|
) {
|
||||||
|
const chart = new ApexCharts(
|
||||||
|
document.getElementById("area-chart"),
|
||||||
|
options
|
||||||
|
);
|
||||||
|
chart.render();
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Card>
|
||||||
|
<h1 className="text-2xl font-bold">Динамика просмотра серий</h1>
|
||||||
|
<div id="area-chart"></div>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
@ -15,7 +15,7 @@ export const ProfileBannedBanner = (props: {
|
||||||
{props.is_perm_banned
|
{props.is_perm_banned
|
||||||
? "Пользователь был заблокирован администрацией навсегда"
|
? "Пользователь был заблокирован администрацией навсегда"
|
||||||
: `Пользователь был заблокирован администрацией до
|
: `Пользователь был заблокирован администрацией до
|
||||||
${unixToDate(props.ban_expires)}`}
|
${unixToDate(props.ban_expires, "full")}`}
|
||||||
</h2>
|
</h2>
|
||||||
<p className="flex items-center text-sm font-normal text-gray-500 dark:text-gray-200">
|
<p className="flex items-center text-sm font-normal text-gray-500 dark:text-gray-200">
|
||||||
{props.ban_reason}
|
{props.ban_reason}
|
||||||
|
|
|
||||||
|
|
@ -133,7 +133,7 @@ export const ReleaseInfoInfo = (props: {
|
||||||
</Table.Cell>
|
</Table.Cell>
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
||||||
{props.aired_on_date != 0 ? (
|
{props.aired_on_date != 0 ? (
|
||||||
unixToDate(props.aired_on_date)
|
unixToDate(props.aired_on_date, "full")
|
||||||
) : props.year ? (
|
) : props.year ? (
|
||||||
<>
|
<>
|
||||||
{props.season && props.season != 0
|
{props.season && props.season != 0
|
||||||
|
|
|
||||||
|
|
@ -1,312 +0,0 @@
|
||||||
"use client";
|
|
||||||
import { useUserStore } from "#/store/auth";
|
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
import { Spinner } from "../components/Spinner/Spinner";
|
|
||||||
import { Avatar, Card, Button, Table } from "flowbite-react";
|
|
||||||
import { Chip } from "../components/Chip/Chip";
|
|
||||||
import { fetchDataViaGet, unixToDate, minutesToTime } from "../api/utils";
|
|
||||||
import { ReleaseCourusel } from "#/components/ReleaseCourusel/ReleaseCourusel";
|
|
||||||
import { ENDPOINTS } from "#/api/config";
|
|
||||||
|
|
||||||
export const ProfilePage = (props: any) => {
|
|
||||||
const authUser = useUserStore((state) => state);
|
|
||||||
const [user, setUser] = useState(null);
|
|
||||||
const [isMyProfile, setIsMyProfile] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
async function _getData() {
|
|
||||||
let url = `${ENDPOINTS.user.profile}/${props.id}`;
|
|
||||||
if (authUser.token) {
|
|
||||||
url += `?token=${authUser.token}`;
|
|
||||||
}
|
|
||||||
const data = await fetchDataViaGet(url);
|
|
||||||
setUser(data.profile);
|
|
||||||
setIsMyProfile(data.is_my_profile);
|
|
||||||
}
|
|
||||||
_getData();
|
|
||||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
||||||
}, [authUser]);
|
|
||||||
|
|
||||||
if (!user) {
|
|
||||||
return (
|
|
||||||
<main className="flex items-center justify-center min-h-screen">
|
|
||||||
<Spinner />
|
|
||||||
</main>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const hasSocials =
|
|
||||||
user.vk_page != "" ||
|
|
||||||
user.tg_page != "" ||
|
|
||||||
user.tt_page != "" ||
|
|
||||||
user.inst_page != "" ||
|
|
||||||
user.discord_page != "" ||
|
|
||||||
false;
|
|
||||||
const socials = [
|
|
||||||
{
|
|
||||||
name: "vk",
|
|
||||||
nickname: user.vk_page,
|
|
||||||
icon: "fa6-brands--vk",
|
|
||||||
urlPrefix: "https://vk.com",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "telegram",
|
|
||||||
nickname: user.tg_page,
|
|
||||||
icon: "fa6-brands--telegram",
|
|
||||||
urlPrefix: "https://t.me",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "discord",
|
|
||||||
nickname: user.discord_page,
|
|
||||||
icon: "fa6-brands--discord",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "tiktok",
|
|
||||||
nickname: user.tt_page,
|
|
||||||
icon: "fa6-brands--tiktok",
|
|
||||||
urlPrefix: "https://tiktok.com",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "instagram",
|
|
||||||
nickname: user.inst_page,
|
|
||||||
icon: "fa6-brands--instagram",
|
|
||||||
urlPrefix: "https://instagram.com",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const hasChips = user.is_verified || user.is_blocked || isMyProfile;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<main className="container flex flex-col gap-4 px-4 pt-4 pb-32 mx-auto overflow-hidden sm:pb-4">
|
|
||||||
{(user.is_banned || user.is_perm_banned) && (
|
|
||||||
<div className="flex flex-col justify-between w-full p-4 border border-red-200 rounded-md md:flex-row bg-red-50 dark:bg-red-700 dark:border-red-600">
|
|
||||||
<div className="mb-4 md:mb-0 md:me-4">
|
|
||||||
<h2 className="mb-1 text-base font-semibold text-gray-900 dark:text-white">
|
|
||||||
{user.is_perm_banned
|
|
||||||
? "Пользователь был заблокирован администрацией навсегда"
|
|
||||||
: `Пользователь был заблокирован администрацией до
|
|
||||||
${unixToDate(user.ban_expires)}`}
|
|
||||||
</h2>
|
|
||||||
<p className="flex items-center text-sm font-normal text-gray-500 dark:text-gray-200">
|
|
||||||
{user.ban_reason}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
<Card className="max-w-full">
|
|
||||||
{hasChips && (
|
|
||||||
<div className="flex gap-2 overflow-x-auto scrollbar-thin">
|
|
||||||
{isMyProfile && (
|
|
||||||
<Chip bg_color="bg-blue-500" name="Мой профиль" />
|
|
||||||
)}
|
|
||||||
{user.is_blocked && (
|
|
||||||
<Chip bg_color="bg-red-500" name="Заблокирован вами" />
|
|
||||||
)}
|
|
||||||
{user.is_verified && (
|
|
||||||
<Chip bg_color="bg-green-500" name="Подтверждён" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<Avatar
|
|
||||||
img={user.avatar}
|
|
||||||
rounded={true}
|
|
||||||
bordered={true}
|
|
||||||
size="lg"
|
|
||||||
className="flex-col justify-start space-x-0 sm:flex-row sm:space-x-4"
|
|
||||||
>
|
|
||||||
<div className="mt-2 space-y-1 font-medium sm:mt-0 dark:text-white">
|
|
||||||
<div className="text-xl">{user.login}</div>
|
|
||||||
<p className="max-w-full text-sm text-gray-500 whitespace-pre-wrap dark:text-gray-400 sm:max-w-96">
|
|
||||||
{user.status}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</Avatar>
|
|
||||||
{hasSocials && (
|
|
||||||
<div className="flex gap-1 overflow-x-auto scrollbar-thin">
|
|
||||||
{socials
|
|
||||||
.filter((social: any) => {
|
|
||||||
if (social.nickname == "") {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
})
|
|
||||||
.map((social: any) => {
|
|
||||||
if (social.name == "discord" && social.nickname != "")
|
|
||||||
return (
|
|
||||||
<Button color="light" key={social.name} as="a">
|
|
||||||
<div className="flex items-center justify-center gap-2">
|
|
||||||
<span
|
|
||||||
className={`iconify h-4 w-4 sm:h-6 sm:w-6 ${social.icon} dark:fill-white`}
|
|
||||||
></span>
|
|
||||||
{social.nickname}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
return (
|
|
||||||
<Button
|
|
||||||
color="light"
|
|
||||||
key={social.name}
|
|
||||||
href={`${social.urlPrefix}/${social.nickname}`}
|
|
||||||
className="[&:is(a)]:hover:bg-gray-100"
|
|
||||||
>
|
|
||||||
<div className="flex items-center justify-center gap-2">
|
|
||||||
<span
|
|
||||||
className={`iconify h-4 w-4 sm:h-6 sm:w-6 ${social.icon} dark:fill-white`}
|
|
||||||
></span>
|
|
||||||
{social.nickname}
|
|
||||||
</div>
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</Card>
|
|
||||||
<div className="flex flex-wrap gap-4">
|
|
||||||
<Card className="flex-1 max-w-full">
|
|
||||||
<h1>Активность</h1>
|
|
||||||
<Table>
|
|
||||||
<Table.Body className="divide-y">
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
Регистрация
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{unixToDate(user.register_date)}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
Был(а) в сети
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{unixToDate(user.last_activity_time)}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
Комментарий
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.comment_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
друзей
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.friend_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
видео
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.video_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
коллекций
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.collection_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
</Table.Body>
|
|
||||||
</Table>
|
|
||||||
</Card>
|
|
||||||
<Card className="flex-1 max-w-full">
|
|
||||||
<h1>Статистика</h1>
|
|
||||||
<Table>
|
|
||||||
<Table.Body className="divide-y">
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--123 "></span>
|
|
||||||
Просмотрено серий
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.watched_episode_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row className="hidden sm:table-row">
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--clock "></span>
|
|
||||||
Время просмотра
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-pre sm:whitespace-nowrap dark:text-white">
|
|
||||||
{minutesToTime(user.watched_time) ||
|
|
||||||
"Нет просмотренных серий."}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row className="table-row sm:hidden">
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-pre sm:whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--clock "></span>
|
|
||||||
{minutesToTime(user.watched_time) ||
|
|
||||||
"Нет просмотренных серий."}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--play "></span>
|
|
||||||
Смотрю
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.watching_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--note-multiple "></span>
|
|
||||||
В Планах
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.plan_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--tick "></span>
|
|
||||||
Просмотрено
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.completed_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--question-mark "></span>
|
|
||||||
Отложено
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.hold_on_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
<Table.Row>
|
|
||||||
<Table.Cell className="flex items-center px-0 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
<span className="w-4 h-4 mr-2 iconify mdi--erase "></span>
|
|
||||||
Брошено
|
|
||||||
</Table.Cell>
|
|
||||||
<Table.Cell className="font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{user.dropped_count}
|
|
||||||
</Table.Cell>
|
|
||||||
</Table.Row>
|
|
||||||
</Table.Body>
|
|
||||||
</Table>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{user.history.length > 0 && (
|
|
||||||
<div className="px-4 py-2 bg-white border border-gray-200 rounded-lg shadow-md dark:border-gray-700 dark:bg-gray-800">
|
|
||||||
<ReleaseCourusel
|
|
||||||
sectionTitle="Недавно просмотренные"
|
|
||||||
content={user.history}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</main>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
@ -10,6 +10,7 @@ import { ProfileBannedBanner } from "#/components/Profile/ProfileBannedBanner";
|
||||||
import { ProfilePrivacyBanner } from "#/components/Profile/Profile.PrivacyBanner";
|
import { ProfilePrivacyBanner } from "#/components/Profile/Profile.PrivacyBanner";
|
||||||
import { ProfileActivity } from "#/components/Profile/Profile.Activity";
|
import { ProfileActivity } from "#/components/Profile/Profile.Activity";
|
||||||
import { ProfileStats } from "#/components/Profile/Profile.Stats";
|
import { ProfileStats } from "#/components/Profile/Profile.Stats";
|
||||||
|
import { ProfileWatchDynamic } from "#/components/Profile/Profile.WatchDynamic";
|
||||||
|
|
||||||
export const ProfilePage = (props: any) => {
|
export const ProfilePage = (props: any) => {
|
||||||
const authUser = useUserStore((state) => state);
|
const authUser = useUserStore((state) => state);
|
||||||
|
|
@ -135,19 +136,24 @@ export const ProfilePage = (props: any) => {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{!user.is_stats_hidden && (
|
{!user.is_stats_hidden && (
|
||||||
<div className="[grid-column:1] xl:[grid-column:2] xl:[grid-row:span_2]">
|
<>
|
||||||
<ProfileStats
|
<div className="[grid-column:1] xl:[grid-column:2] xl:[grid-row:span_2]">
|
||||||
lists={[
|
<ProfileStats
|
||||||
user.watching_count,
|
lists={[
|
||||||
user.plan_count,
|
user.watching_count,
|
||||||
user.completed_count,
|
user.plan_count,
|
||||||
user.hold_on_count,
|
user.completed_count,
|
||||||
user.dropped_count,
|
user.hold_on_count,
|
||||||
]}
|
user.dropped_count,
|
||||||
watched_count={user.watched_episode_count}
|
]}
|
||||||
watched_time={user.watched_time}
|
watched_count={user.watched_episode_count}
|
||||||
/>
|
watched_time={user.watched_time}
|
||||||
</div>
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="[grid-column:1] xl:[grid-column:2] xl:[grid-row:span_2]">
|
||||||
|
<ProfileWatchDynamic watchDynamic={user.watch_dynamics || []} />
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue