Skip to content

Commit

Permalink
Merge pull request #91 from xi-effect/staging
Browse files Browse the repository at this point in the history
Staging
  • Loading branch information
unknownproperty authored Jul 14, 2024
2 parents 78ebf85 + f37ca3e commit 5375fe3
Show file tree
Hide file tree
Showing 141 changed files with 8,258 additions and 4,135 deletions.
2 changes: 1 addition & 1 deletion apps/xi.front/.env
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
NEXT_PUBLIC_SERVER_URL_BACKEND=https://api.xieffect.ru
NEXT_PUBLIC_SERVER_URL_AUTH=https://auth.xieffect.ru
NEXT_PUBLIC_SERVER_URL_LIVE=https://live-test.xieffect.ru
NEXT_PUBLIC_SERVER_URL_LIVE=https://live-test.xieffect.ru
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ const InviteCard = ({ invite, iid }: InviteCardT) => {
const onSubmit = () => {
setIsLoading(true);

console.log('onSubmit', invite);
// console.log('onSubmit', invite);
socket.emit(
'join-community',
{
Expand Down
54 changes: 54 additions & 0 deletions apps/xi.front/app/(common)/invite/[iid]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import React from 'react';
import { Metadata } from 'next';
// import { get } from 'pkg.utils';
import InvitePage from './invitePage';

// type ResponseBodyT = {
// community: {
// id: number;
// name: string;
// description: string;
// };
// is_authorized: boolean;
// has_already_joined: boolean;
// };

type PageParamsT = {
params: {
iid: string;
};
};

export async function generateMetadata({ params }: PageParamsT): Promise<Metadata> {
// const { status, datas } = await get<ResponseBodyT>({
// service: 'backend',
// path: `/api/public/community-service/invitations/by-code/${params.iid}/community/`,
// config: {
// headers: {
// 'Content-Type': 'application/json',
// },
// },
// });

// если использю get из pkg.utils то появляется ошибка:
// импорт компонентов без пометки 'use client'
const data = await fetch(
`${process.env.NEXT_PUBLIC_SERVER_URL_BACKEND}/api/public/community-service/invitations/by-code/${params.iid}/community/`,
).then((res) => res.json());

return {
title: `Приглашение в сообщество ${data.community.name}`,
description: `Вы были приглашены в сообщество «${data.community.name}».
Перейдите по этой ссылке-приглашению, чтобы принять приглашение`,
openGraph: {
title: `Приглашение в сообщество ${data.community.name}`,
description: `Вы были приглашены в сообщество «${data.community.name}».
Перейдите по этой ссылке-приглашению, чтобы принять приглашение`,
images: [`https://api.xieffect.ru/files/communities/${data.community.id}/avatar.webp`],
},
};
}

const Invite = ({ params }: PageParamsT) => <InvitePage params={params} />;

export default Invite;
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
'use client';

import React from 'react';

export default function Chats() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,13 @@
import React from 'react';
import dynamic from 'next/dynamic';

const Announce = dynamic(() =>
const Post = dynamic(() =>
import('pkg.module.announces/components/AnnouncePost').then((mod) => mod.default),
);

export default function AnnouncePostPage() {
export default function PostPage() {
return (
<Announce
<Post
postTitle="Победа на чемпионате"
postText={undefined}
date="4 мая 2022"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
import React from 'react';
import dynamic from 'next/dynamic';

const Announces = dynamic(() => import('pkg.module.announces').then((mod) => mod.Announces));
const Posts = dynamic(() => import('pkg.module.announces').then((mod) => mod.Announces));

export default function AnnouncesPage() {
return <Announces />;
return <Posts />;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
'use client';

import React from 'react';
import dynamic from 'next/dynamic';

const Tasks = dynamic(() => import('pkg.module.tasks').then((mod) => mod.Tasks));

export default function TasksPage() {
return <Tasks />;
}
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,9 @@ const Header = () => {

return (
<header className=" max-xs:pb-4 pb-8 w-full max-w-[1570px]">
<div className="font-semibold text-[32px] max-xs:text-2xl leading-10 xl:text-[40px] xl:leading-[48px] xl:flex text-gray-100">
<h2>Добро пожаловать в сообщество</h2>
<div className="flex items-center max-xl:mt-3 max-xs:mt-0 xl:ml-6">
<div className="font-semibold text-[32px] max-xs:text-2xl leading-10 xl:text-[40px] xl:leading-[48px] flex gap-3 flex-wrap text-gray-100">
<h2 className="mr-3">Добро пожаловать в сообщество</h2>
<div className="flex items-center">
{!id ? (
<div className="bg-gray-10 size-[48px] animate-pulse rounded-[24px]" />
) : (
Expand All @@ -45,7 +45,9 @@ const Header = () => {
{!communityName ? (
<div className="ml-2 xl:ml-4 animate-pulse bg-gray-10 h-[32px] w-[156px] rounded-[8px]" />
) : (
<p className="ml-2 xl:ml-4">{communityName}</p>
<p className="ml-2 xl:ml-4 supports-[overflow-wrap:anywhere]:[overflow-wrap:anywhere] supports-[not(overflow-wrap:anywhere)]:[word-break:normal]">
{communityName}
</p>
)}
</div>
</div>
Expand Down Expand Up @@ -136,9 +138,12 @@ const SupportBox = () => (
<Button
variant="secondary"
className="text-sm h-8 xl:h-12 xl:text-base border-[1px] xl:border-2 font-medium"
asChild
>
Посмотреть руководства
<span className="bg-[url('/assets/community-home-page/manual-icon.svg')] bg-no-repeat bg-center bg-contain ml-[6px] xl:ml-2 w-4 h-4 xl:w-6 xl:h-6" />
<Link href="https://support.xieffect.ru/">
Посмотреть руководства
<span className="bg-[url('/assets/community-home-page/manual-icon.svg')] bg-no-repeat bg-center bg-contain ml-[6px] xl:ml-2 w-4 h-4 xl:w-6 xl:h-6" />
</Link>
</Button>
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,14 +1,10 @@
'use client';

import { useMainSt } from 'pkg.stores';

import dynamic from 'next/dynamic';
import { ReactNode } from 'react';

const Navigation = dynamic(() => import('pkg.navigation').then((mod) => mod.Navigation));

export default function CommunityLayout({ children }: { children: ReactNode }) {
const onSignOut = useMainSt((state) => state.onSignOut);

return <Navigation onExit={onSignOut}>{children}</Navigation>;
return <Navigation>{children}</Navigation>;
}
175 changes: 175 additions & 0 deletions apps/xi.front/app/(protected)/communities/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,175 @@
'use client';

import { redirect, useRouter } from 'next/navigation';
import { Logo } from 'pkg.logo';
import { useMainSt } from 'pkg.stores';
import { useEffect } from 'react';
import { toast } from 'sonner';

export default function CommunitiesLoading() {
const isLogin = useMainSt((state) => state.isLogin);
const initSocket = useMainSt((state) => state.initSocket);
const socket = useMainSt((state) => state.socket);
const updateCommunityMeta = useMainSt((state) => state.updateCommunityMeta);
const communityMeta = useMainSt((state) => state.communityMeta);
const onboardingStage = useMainSt((state) => state.user.onboardingStage);

const router = useRouter();

// Тоже костыль
useEffect(() => {
const toastTimerId = setTimeout(() => {
toast('Упс, проблемы с загрузкой');
initSocket();
}, 10000);

const redirectTimerId = setTimeout(() => {
redirect('/communities');
}, 11000);

return () => {
clearTimeout(toastTimerId);
clearTimeout(redirectTimerId);
};
}, []);

// Если вдруг что-то пошло не так, ещё раз иницируем соединение сокета
// В initSocket есть предотвращение инициализации нескольких соединений
useEffect(() => {
console.log('initSocket');
initSocket();
}, []);

useEffect(() => {
if (isLogin === false) {
redirect('/signin');
}
}, [isLogin]);

useEffect(() => {
console.log('onconnect', socket);
if (onboardingStage === 'completed') {
socket?.on('connect', () => {
socket.emit(
'retrieve-any-community',
(stats: number, { community, participant }: { community: any; participant: any }) => {
if (stats === 200) {
updateCommunityMeta({
id: community.id,
isOwner: participant.is_owner,
name: community.name,
description: community.description,
});
}

if (community.id) router.push(`/communities/${community.id}/home`);
},
);
});
}

if (socket?.connected === true && communityMeta.id === null) {
socket.emit(
'retrieve-any-community',
(stats: number, { community, participant }: { community: any; participant: any }) => {
if (stats === 200) {
updateCommunityMeta({
id: community.id,
isOwner: participant.is_owner,
name: community.name,
description: community.description,
});
}

if (community.id) router.push(`/communities/${community.id}/home`);
},
);
}
}, []);

useEffect(() => {
if (isLogin && socket?.connected === true) {
socket.emit('retrieve-any-community',
(stats: number, { community, participant }: { community: any; participant: any }) => {
if (stats === 200) {
updateCommunityMeta({
id: community.id,
isOwner: participant.is_owner,
name: community.name,
description: community.description,
});
}

if (community.id) router.push(`/communities/${community.id}/home`);
},
);
}
}, [isLogin, socket?.connected]);

return (
<div className="flex">
<div className="flex-col min-w-[350px] p-6">
<div className="p-2">
<Logo height={16} width={134} logoVariant="navigation" logoSize="default" />
</div>
<div className="flex h-12 px-2.5 py-2 md:w-[302px] mt-0 sm:mt-8 gap-2 items-center rounded-xl">
<div className="bg-gray-10 h-[32px] w-[32px] animate-pulse rounded-full shrink-0" />
<div className="bg-gray-10 h-[24px] w-full animate-pulse rounded-[4px]" />
</div>
<div className="w-full h-[calc(100dvh-124px)] p-2">
<ul className="mt-3 flex flex-col gap-4 overflow-hidden sm:mb-[60px]">
{[...new Array(7)].map((item, index) => (
<li
key={index.toString()}
className="bg-gray-10 h-[28px] w-full animate-pulse rounded-[4px]"
/>
))}
</ul>
</div>
<div className="fixed bottom-0 flex flex-col pb-6 sm:w-[302px]">
<div className="flex gap-2 items-center p-2">
<div className="bg-gray-10 h-[32px] w-[32px] animate-pulse rounded-full shrink-0" />
<div className="bg-gray-10 h-[24px] w-full animate-pulse rounded-[4px]" />
</div>
<div className="mt-1 p-2">
<div className="bg-gray-10 h-[32px] w-full animate-pulse rounded-[4px]" />
</div>
</div>
</div>
<div className="p-8 w-[calc(100vw-350px)] overflow-auto h-full">
<div className="pb-8 max-w-[1570px]">
<div className="flex gap-4 sm:flex-col xl:flex-row">
<div className="bg-gray-10 h-[48px] w-full animate-pulse rounded-[4px]" />
<div className="flex gap-2 w-full">
<div className="bg-gray-10 h-[48px] w-[48px] animate-pulse rounded-full shrink-0" />
<div className="bg-gray-10 h-[48px] w-full animate-pulse rounded-[4px]" />
</div>
</div>
<div className="mt-4">
<div className="bg-gray-10 h-[32px] w-[400px] animate-pulse rounded-[4px]" />
</div>
</div>
<div className="grid py-8 max-xs:py-4 gap-12 max-w-[1570px] xl:grid-cols-3">
<div className="flex flex-col gap-2">
<div className="bg-gray-10 h-[240px] w-full animate-pulse rounded-2xl" />
<div className="bg-gray-10 h-[32px] w-full animate-pulse rounded-[4px]" />
<div className="bg-gray-10 h-[72px] w-full animate-pulse rounded-[4px]" />
</div>
<div className="flex flex-col gap-2">
<div className="bg-gray-10 h-[240px] w-full animate-pulse rounded-2xl" />
<div className="bg-gray-10 h-[32px] w-full animate-pulse rounded-[4px]" />
<div className="bg-gray-10 h-[72px] w-full animate-pulse rounded-[4px]" />
</div>
<div className="flex flex-col gap-2">
<div className="bg-gray-10 h-[240px] w-full animate-pulse rounded-2xl" />
<div className="bg-gray-10 h-[32px] w-full animate-pulse rounded-[4px]" />
<div className="bg-gray-10 h-[72px] w-full animate-pulse rounded-[4px]" />
</div>
</div>
<div className="py-8 max-xs:py-4 w-full max-w-[1570px]">
<div className="bg-gray-10 h-[248px] w-full animate-pulse rounded-2xl" />
</div>
</div>
</div>
);
}
11 changes: 11 additions & 0 deletions apps/xi.front/app/(protected)/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { ReactNode } from 'react';
import ProtectedProvider from './providers';

type ProtectedLayoutPropsT = {
children: ReactNode;
};

const ProtectedLayout = ({ children }: ProtectedLayoutPropsT) => (
<ProtectedProvider>{children}</ProtectedProvider>
);
export default ProtectedLayout;
Loading

0 comments on commit 5375fe3

Please sign in to comment.