Compare commits
No commits in common. "master" and "blog" have entirely different histories.
3
.env
3
.env
|
@ -1,8 +1,5 @@
|
||||||
NEXT_PUBLIC_SERVER_BASE_URL=https://api.bbuddy.expert/api
|
NEXT_PUBLIC_SERVER_BASE_URL=https://api.bbuddy.expert/api
|
||||||
NEXT_PUBLIC_AGORA_APPID=ed90c9dc42634e5687d4e2e0766b363f
|
NEXT_PUBLIC_AGORA_APPID=ed90c9dc42634e5687d4e2e0766b363f
|
||||||
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_51LVB3LK5pVGxNPeKk4gedt5NW4cb8k7BVXvgOMPTK4x1nnbGTD8BCqDqgInboT6N72YwrTl4tOsVz8rAjbUadX1m00y4Aq5qE8
|
|
||||||
STRIPE_SECRET_KEY=sk_test_51LVB3LK5pVGxNPeK6j0wCsPqYMoGfcuwf1LpwGEBsr1dUx4NngukyjYL2oMZer5EOlW3lqnVEPjNDruN0OkUohIf00fWFUHN5O
|
|
||||||
STRIPE_PAYMENT_DESCRIPTION='BBuddy services'
|
|
||||||
|
|
||||||
NEXT_PUBLIC_CONTENTFUL_SPACE_ID = voxpxjq7y7vf
|
NEXT_PUBLIC_CONTENTFUL_SPACE_ID = voxpxjq7y7vf
|
||||||
NEXT_PUBLIC_CONTENTFUL_ACCESS_TOKEN = s99GWKfpDKkNwiEJ3pN7US_tmqsGvDlaex-sOJwpzuc
|
NEXT_PUBLIC_CONTENTFUL_ACCESS_TOKEN = s99GWKfpDKkNwiEJ3pN7US_tmqsGvDlaex-sOJwpzuc
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
// @ts-check
|
// @ts-check
|
||||||
const withNextIntl = require('next-intl/plugin')();
|
const withNextIntl = require('next-intl/plugin')();
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
const json = require('./package.json');
|
|
||||||
|
|
||||||
/** @type {import('next').NextConfig} */
|
/** @type {import('next').NextConfig} */
|
||||||
const nextConfig = {
|
const nextConfig = {
|
||||||
|
@ -15,9 +14,6 @@ const nextConfig = {
|
||||||
sassOptions: {
|
sassOptions: {
|
||||||
includePaths: [path.join(__dirname, 'styles')],
|
includePaths: [path.join(__dirname, 'styles')],
|
||||||
},
|
},
|
||||||
env: {
|
|
||||||
version: json.version
|
|
||||||
},
|
|
||||||
typescript: {
|
typescript: {
|
||||||
// !! WARN !!
|
// !! WARN !!
|
||||||
// Dangerously allow production builds to successfully complete even if
|
// Dangerously allow production builds to successfully complete even if
|
||||||
|
@ -34,7 +30,8 @@ const nextConfig = {
|
||||||
},
|
},
|
||||||
// output: 'standalone',
|
// output: 'standalone',
|
||||||
poweredByHeader: false,
|
poweredByHeader: false,
|
||||||
productionBrowserSourceMaps: true
|
productionBrowserSourceMaps: true,
|
||||||
|
trailingSlash: true
|
||||||
};
|
};
|
||||||
|
|
||||||
module.exports = withNextIntl(nextConfig);
|
module.exports = withNextIntl(nextConfig);
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "bbuddy-ui",
|
"name": "bbuddy-ui",
|
||||||
"version": "0.2.3",
|
"version": "0.0.1",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "next dev -p 4200",
|
"dev": "next dev -p 4200",
|
||||||
|
@ -13,13 +13,10 @@
|
||||||
"@ant-design/icons": "^5.2.6",
|
"@ant-design/icons": "^5.2.6",
|
||||||
"@ant-design/nextjs-registry": "^1.0.0",
|
"@ant-design/nextjs-registry": "^1.0.0",
|
||||||
"@contentful/rich-text-react-renderer": "^15.22.9",
|
"@contentful/rich-text-react-renderer": "^15.22.9",
|
||||||
"@stripe/react-stripe-js": "^2.7.3",
|
"agora-rtc-react": "^2.1.0",
|
||||||
"@stripe/stripe-js": "^4.1.0",
|
|
||||||
"agora-rtc-react": "2.1.0",
|
|
||||||
"agora-rtc-sdk-ng": "^4.20.2",
|
"agora-rtc-sdk-ng": "^4.20.2",
|
||||||
"antd": "^5.12.1",
|
"antd": "^5.12.1",
|
||||||
"antd-img-crop": "^4.21.0",
|
"antd-img-crop": "^4.21.0",
|
||||||
"antd-style": "^3.6.2",
|
|
||||||
"axios": "^1.6.5",
|
"axios": "^1.6.5",
|
||||||
"contentful": "^10.13.3",
|
"contentful": "^10.13.3",
|
||||||
"dayjs": "^1.11.10",
|
"dayjs": "^1.11.10",
|
||||||
|
@ -29,9 +26,7 @@
|
||||||
"react": "^18",
|
"react": "^18",
|
||||||
"react-dom": "^18",
|
"react-dom": "^18",
|
||||||
"react-slick": "^0.29.0",
|
"react-slick": "^0.29.0",
|
||||||
"react-stripe-js": "^1.1.5",
|
|
||||||
"slick-carousel": "^1.8.1",
|
"slick-carousel": "^1.8.1",
|
||||||
"stripe": "^16.2.0",
|
|
||||||
"styled-components": "^6.1.1"
|
"styled-components": "^6.1.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
|
@ -1,11 +0,0 @@
|
||||||
{
|
|
||||||
"applinks": {
|
|
||||||
"apps": [],
|
|
||||||
"details": [
|
|
||||||
{
|
|
||||||
"appID": "GTYAM4FYH3.com.bbuddy.whistle",
|
|
||||||
"paths": ["/en/experts/*"]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,13 +0,0 @@
|
||||||
[
|
|
||||||
{
|
|
||||||
"relation": ["delegate_permission/common.handle_all_urls"],
|
|
||||||
"target": {
|
|
||||||
"namespace": "android_app",
|
|
||||||
"package_name": "com.bbuddy.whistle",
|
|
||||||
"sha256_cert_fingerprints": [
|
|
||||||
"87:A2:49:9A:F4:05:9C:06:3C:3D:F3:10:88:F5:49:6D:5F:F2:BC:1E:90:0D:F2:37:A5:BA:37:19:5C:A3:75:C2",
|
|
||||||
"86:42:FE:EA:44:22:9D:16:7F:FC:70:92:A6:39:9D:B1:C3:F1:DE:21:32:4A:45:8C:07:98:39:55:AF:47:32:66"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
|
@ -1,5 +1,5 @@
|
||||||
|
import { GeneralFilter, ExpertsData, ExpertDetails } from '../types/experts';
|
||||||
import { apiRequest } from './helpers';
|
import { apiRequest } from './helpers';
|
||||||
import { GeneralFilter, ExpertsData, ExpertDetails, ExpertScheduler, ExpertSchedulerSession, SignupSessionData } from '../types/experts';
|
|
||||||
|
|
||||||
export const getExpertsList = (locale: string, filter?: GeneralFilter): Promise<ExpertsData> => apiRequest({
|
export const getExpertsList = (locale: string, filter?: GeneralFilter): Promise<ExpertsData> => apiRequest({
|
||||||
url: '/home/coachsearch1',
|
url: '/home/coachsearch1',
|
||||||
|
@ -14,18 +14,3 @@ export const getExpertById = (id: string, locale: string): Promise<ExpertDetails
|
||||||
data: { id },
|
data: { id },
|
||||||
locale
|
locale
|
||||||
});
|
});
|
||||||
|
|
||||||
export const getSchedulerByExpertId = (id: string, locale: string): Promise<ExpertScheduler> => apiRequest({
|
|
||||||
url: '/home/sessionsignupdata',
|
|
||||||
method: 'post',
|
|
||||||
data: { id },
|
|
||||||
locale
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getSchedulerSession = (data: SignupSessionData, locale: string, token: string): Promise<ExpertSchedulerSession> => apiRequest({
|
|
||||||
url: '/home/sessionsignupsubmit',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import { useCallback, useState } from 'react';
|
import { useCallback, useEffect, useState } from 'react';
|
||||||
import { ProfileData, ProfileRequest } from '../../types/profile';
|
import { ProfileData, ProfileRequest } from '../../types/profile';
|
||||||
import { getPersonalData, setPersonData } from '../profile';
|
import { getPersonalData, setPersonData } from '../profile';
|
||||||
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
||||||
|
@ -18,7 +18,7 @@ export const useProfileSettings = (locale: string) => {
|
||||||
setProfileSettings(data);
|
setProfileSettings(data);
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
console.log(err);
|
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
setFetchLoading(false);
|
setFetchLoading(false);
|
||||||
|
|
|
@ -1,42 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useCallback, useEffect, useState } from 'react';
|
|
||||||
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
|
||||||
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
|
||||||
import { Room } from '../../types/rooms';
|
|
||||||
import { getRoomDetails } from '../rooms';
|
|
||||||
|
|
||||||
export const useRoomDetails = (locale: string, roomId: number) => {
|
|
||||||
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
|
||||||
const [room, setRoom] = useState<Room>();
|
|
||||||
const [errorData, setErrorData] = useState<any>();
|
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
|
||||||
|
|
||||||
const fetchData = useCallback(() => {
|
|
||||||
setLoading(true);
|
|
||||||
setErrorData(undefined);
|
|
||||||
setRoom(undefined);
|
|
||||||
|
|
||||||
getRoomDetails(locale, jwt, roomId)
|
|
||||||
.then((room) => {
|
|
||||||
setRoom(room);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
setErrorData(err);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setLoading(false);
|
|
||||||
})
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
fetchData();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return {
|
|
||||||
fetchData,
|
|
||||||
loading,
|
|
||||||
room,
|
|
||||||
errorData
|
|
||||||
};
|
|
||||||
};
|
|
|
@ -1,109 +0,0 @@
|
||||||
import { apiRequest } from './helpers';
|
|
||||||
import {GetUsersForRooms, Room, RoomEdit, RoomEditDTO} from '../types/rooms';
|
|
||||||
|
|
||||||
export const getUpcomingRooms = (locale: string, token: string): Promise<Room[]> => apiRequest({
|
|
||||||
url: '/home/upcomingsessionsall',
|
|
||||||
method: 'post',
|
|
||||||
data: {
|
|
||||||
sessionType: 'room'
|
|
||||||
},
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getRecentRooms = (locale: string, token: string): Promise<Room[]> => apiRequest({
|
|
||||||
url: '/home/historicalmeetings',
|
|
||||||
method: 'post',
|
|
||||||
data: {
|
|
||||||
sessionType: 'room'
|
|
||||||
},
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getRoomDetails = (locale: string, token: string, id: number): Promise<Room> => apiRequest({
|
|
||||||
url: '/home/room',
|
|
||||||
method: 'post',
|
|
||||||
data: { id },
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const deleteRoomClient = (locale: string, token: string, data: { sessionId: number, clientUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/deleteclientfromroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const deleteRoomSupervisor = (locale: string, token: string, data: { sessionId: number, supervisorUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/deletesupervisorfromroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const becomeRoomClient = (locale: string, token: string, data: { sessionId: number, clientUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/becomeroomclient',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const becomeRoomSupervisor = (locale: string, token: string, data: { sessionId: number, supervisorUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/becomeroomsupervisor',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getUsersList = (locale: string, token: string, data: { template: string }): Promise<GetUsersForRooms> => apiRequest({
|
|
||||||
url: '/home/findusersforroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const addClient = (locale: string, token: string, data: { sessionId: number, clientUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/addclienttoroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const addSupervisor = (locale: string, token: string, data: { sessionId: number, supervisorUserId: number }): Promise<any> => apiRequest({
|
|
||||||
url: '/home/addsupervisortoroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const createRoom = (locale: string, token: string): Promise<any> => apiRequest({
|
|
||||||
url: '/home/createroom',
|
|
||||||
method: 'post',
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const updateRoom = (locale: string, token: string, data: RoomEdit): Promise<any> => apiRequest({
|
|
||||||
url: '/home/updateroom',
|
|
||||||
method: 'post',
|
|
||||||
data,
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getRoomById = (locale: string, token: string, id: number): Promise<RoomEditDTO> => apiRequest({
|
|
||||||
url: '/home/getroomforedit',
|
|
||||||
method: 'post',
|
|
||||||
data: { id },
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
|
@ -91,11 +91,3 @@ export const finishSession = (locale: string, token: string, sessionId: number):
|
||||||
locale,
|
locale,
|
||||||
token
|
token
|
||||||
});
|
});
|
||||||
|
|
||||||
export const sessionPaymentConfirm = (locale: string, token: string, sessionId: number): Promise<Session> => apiRequest({
|
|
||||||
url: '/home/session_pay_confirm',
|
|
||||||
method: 'post',
|
|
||||||
data: { id: sessionId },
|
|
||||||
locale,
|
|
||||||
token
|
|
||||||
});
|
|
||||||
|
|
|
@ -1,79 +0,0 @@
|
||||||
"use server";
|
|
||||||
|
|
||||||
import { Stripe } from "stripe";
|
|
||||||
|
|
||||||
import { headers } from "next/headers";
|
|
||||||
|
|
||||||
import { formatAmountForStripe } from "../utils/stripe-helpers";
|
|
||||||
import { stripe } from "../lib/stripe";
|
|
||||||
|
|
||||||
export async function createCheckoutSession(
|
|
||||||
data: FormData,
|
|
||||||
): Promise<{ client_secret: string | null; url: string | null }> {
|
|
||||||
const ui_mode = data.get(
|
|
||||||
"uiMode",
|
|
||||||
) as Stripe.Checkout.SessionCreateParams.UiMode;
|
|
||||||
console.log('DATA', data)
|
|
||||||
const origin: string = headers().get("origin") as string;
|
|
||||||
|
|
||||||
const checkoutSession: Stripe.Checkout.Session =
|
|
||||||
await stripe.checkout.sessions.create({
|
|
||||||
mode: "payment",
|
|
||||||
submit_type: "donate",
|
|
||||||
line_items: [
|
|
||||||
{
|
|
||||||
quantity: 1,
|
|
||||||
price_data: {
|
|
||||||
currency: 'eur',
|
|
||||||
product_data: {
|
|
||||||
name: "Custom amount donation",
|
|
||||||
},
|
|
||||||
unit_amount: formatAmountForStripe(
|
|
||||||
Number(data.get("customDonation") as string),
|
|
||||||
'eur',
|
|
||||||
),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
...(ui_mode === "hosted" && {
|
|
||||||
success_url: `${origin}/payment/with-checkout/result?session_id={CHECKOUT_SESSION_ID}`,
|
|
||||||
cancel_url: `${origin}/with-checkout`,
|
|
||||||
}),
|
|
||||||
...(ui_mode === "embedded" && {
|
|
||||||
return_url: `${origin}/payment/with-embedded-checkout/result?session_id={CHECKOUT_SESSION_ID}`,
|
|
||||||
}),
|
|
||||||
ui_mode,
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
client_secret: checkoutSession.client_secret,
|
|
||||||
url: checkoutSession.url,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
export async function createPaymentIntent(
|
|
||||||
data: { amount: number, sessionId?: string },
|
|
||||||
): Promise<{ client_secret: string }> {
|
|
||||||
|
|
||||||
const params = {
|
|
||||||
amount: formatAmountForStripe(
|
|
||||||
data.amount,
|
|
||||||
'eur',
|
|
||||||
),
|
|
||||||
automatic_payment_methods: { enabled: true },
|
|
||||||
currency: 'eur',
|
|
||||||
} as Stripe.PaymentIntentCreateParams;
|
|
||||||
|
|
||||||
if (data?.sessionId){
|
|
||||||
params.metadata = {
|
|
||||||
sessionId : data.sessionId
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const paymentIntent: Stripe.PaymentIntent =
|
|
||||||
await stripe.paymentIntents.create(params);
|
|
||||||
|
|
||||||
return { client_secret: paymentIntent.client_secret as string };
|
|
||||||
}
|
|
||||||
|
|
||||||
export const getStripePaymentStatus = async (payment_intent: string): Promise<Stripe.PaymentIntent> => await stripe.paymentIntents.retrieve(payment_intent);
|
|
|
@ -1,14 +1,14 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
// import { useTranslations } from 'next-intl';
|
import { useTranslations } from 'next-intl';
|
||||||
import Link from 'next/link';
|
import {getTranslations, unstable_setRequestLocale} from 'next-intl/server';
|
||||||
import { getTranslations, unstable_setRequestLocale } from 'next-intl/server';
|
|
||||||
import { i18nText } from '../../../../i18nKeys';
|
import { i18nText } from '../../../../i18nKeys';
|
||||||
import { fetchBlogPosts } from '../../../../lib/contentful/blogPosts';
|
import {fetchBlogPosts} from "../../../../lib/contentful/blogPosts";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
export default async function News({params: {locale}}: { params: { locale: string } }) {
|
export default async function News({params: {locale}}: { params: { locale: string } }) {
|
||||||
unstable_setRequestLocale(locale);
|
unstable_setRequestLocale(locale);
|
||||||
const t = await getTranslations('Main');
|
const t = await getTranslations('Main');
|
||||||
const { data, total } = await fetchBlogPosts({preview: false, sticky: true})
|
const {data, total} = await fetchBlogPosts({preview: false, sticky: true})
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="main-articles">
|
<div className="main-articles">
|
||||||
|
|
|
@ -15,8 +15,7 @@ import React, { ReactNode } from 'react';
|
||||||
export default function MainLayout({ children, news, experts }: {
|
export default function MainLayout({ children, news, experts }: {
|
||||||
children: ReactNode,
|
children: ReactNode,
|
||||||
news: ReactNode,
|
news: ReactNode,
|
||||||
experts: ReactNode,
|
experts: ReactNode
|
||||||
payment: ReactNode
|
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
@ -25,4 +24,4 @@ export default function MainLayout({ children, news, experts }: {
|
||||||
{experts}
|
{experts}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
|
@ -38,6 +38,10 @@ export default function ExpertProfilePage({ params: { locale } }: { params: { lo
|
||||||
getPayData(locale, jwt)
|
getPayData(locale, jwt)
|
||||||
])
|
])
|
||||||
.then(([profile, person, education, tags, practice, schedule, payData]) => {
|
.then(([profile, person, education, tags, practice, schedule, payData]) => {
|
||||||
|
console.log('profile', profile);
|
||||||
|
console.log('person', person);
|
||||||
|
console.log('education', education);
|
||||||
|
console.log('schedule', schedule);
|
||||||
setIsFull(profile.fillProgress === 'full');
|
setIsFull(profile.fillProgress === 'full');
|
||||||
setData({
|
setData({
|
||||||
person,
|
person,
|
||||||
|
@ -57,14 +61,16 @@ export default function ExpertProfilePage({ params: { locale } }: { params: { lo
|
||||||
}
|
}
|
||||||
}, [jwt]);
|
}, [jwt]);
|
||||||
|
|
||||||
return data ? (
|
return (
|
||||||
<Loader isLoading={loading}>
|
<Loader isLoading={loading}>
|
||||||
<ExpertProfile
|
{data && (
|
||||||
isFull={isFull}
|
<ExpertProfile
|
||||||
locale={locale}
|
isFull={isFull}
|
||||||
data={data}
|
locale={locale}
|
||||||
updateData={setData}
|
data={data}
|
||||||
/>
|
updateData={setData}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</Loader>
|
</Loader>
|
||||||
) : null;
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -18,7 +18,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
|
||||||
<div className="messages-session">
|
<div className="messages-session">
|
||||||
<Link
|
<Link
|
||||||
className="card-profile"
|
className="card-profile"
|
||||||
href={'messages/1' as any}
|
href={'1' as any}
|
||||||
>
|
>
|
||||||
<div className="card-profile__header">
|
<div className="card-profile__header">
|
||||||
<div className="card-profile__header__portrait">
|
<div className="card-profile__header__portrait">
|
||||||
|
@ -42,7 +42,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
|
||||||
</Link>
|
</Link>
|
||||||
<Link
|
<Link
|
||||||
className="card-profile"
|
className="card-profile"
|
||||||
href={'messages/2' as any}
|
href={'2' as any}
|
||||||
>
|
>
|
||||||
<div className="card-profile__header">
|
<div className="card-profile__header">
|
||||||
<div className="card-profile__header__portrait">
|
<div className="card-profile__header__portrait">
|
||||||
|
@ -63,7 +63,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
|
||||||
</Link>
|
</Link>
|
||||||
<Link
|
<Link
|
||||||
className="card-profile"
|
className="card-profile"
|
||||||
href={'messages/3' as any}
|
href={'3' as any}
|
||||||
>
|
>
|
||||||
<div className="card-profile__header">
|
<div className="card-profile__header">
|
||||||
<div className="card-profile__header__portrait">
|
<div className="card-profile__header__portrait">
|
||||||
|
|
|
@ -1,57 +0,0 @@
|
||||||
import React, { Suspense } from 'react';
|
|
||||||
import { unstable_setRequestLocale } from 'next-intl/server';
|
|
||||||
import { notFound } from 'next/navigation';
|
|
||||||
import { AccountMenu, RoomDetails, RoomsTabs } from '../../../../../../components/Account';
|
|
||||||
import { RoomsType } from '../../../../../../types/rooms';
|
|
||||||
|
|
||||||
const ROOMS_ROUTES = [RoomsType.UPCOMING, RoomsType.RECENT, RoomsType.NEW];
|
|
||||||
|
|
||||||
export async function generateStaticParams({
|
|
||||||
params: { locale },
|
|
||||||
}: { params: { locale: string } }) {
|
|
||||||
return [{ locale, slug: [RoomsType.UPCOMING] }];
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function RoomsDetailItem({ params: { locale, slug } }: { params: { locale: string, slug?: string[] } }) {
|
|
||||||
unstable_setRequestLocale(locale);
|
|
||||||
const roomType: string = slug?.length > 0 && slug[0] || '';
|
|
||||||
const roomId: number | null = slug?.length > 1 && Number(slug[1]) || null;
|
|
||||||
|
|
||||||
if (!slug?.length || slug?.length > 2) {
|
|
||||||
notFound();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (ROOMS_ROUTES.includes(roomType as RoomsType) && Number.isInteger(roomId)) {
|
|
||||||
return (
|
|
||||||
<Suspense fallback={<p>Loading...</p>}>
|
|
||||||
<RoomDetails
|
|
||||||
locale={locale}
|
|
||||||
roomId={roomId || 0}
|
|
||||||
activeType={roomType as RoomsType}
|
|
||||||
/>
|
|
||||||
</Suspense>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (ROOMS_ROUTES.includes(roomType as RoomsType) && !Number.isInteger(roomId)) {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="col-xl-3 col-lg-4 d-none d-lg-block">
|
|
||||||
<AccountMenu locale={locale}/>
|
|
||||||
</div>
|
|
||||||
<div className="col-xl-9 col-lg-8 ">
|
|
||||||
<div className="page-account__inner">
|
|
||||||
<Suspense fallback={<p>Loading...</p>}>
|
|
||||||
<RoomsTabs
|
|
||||||
locale={locale}
|
|
||||||
activeTab={roomType as RoomsType}
|
|
||||||
/>
|
|
||||||
</Suspense>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return notFound();
|
|
||||||
};
|
|
|
@ -1,12 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { redirect } from 'next/navigation';
|
|
||||||
import { useLocalStorage } from '../../../../../hooks/useLocalStorage';
|
|
||||||
import { AUTH_TOKEN_KEY } from '../../../../../constants/common';
|
|
||||||
import { RoomsType } from '../../../../../types/rooms';
|
|
||||||
|
|
||||||
export default function RoomsMainPage() {
|
|
||||||
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
|
||||||
|
|
||||||
return token ? redirect(`rooms/${RoomsType.UPCOMING}`) : null;
|
|
||||||
};
|
|
|
@ -26,7 +26,7 @@ export default function SessionDetailItem({ params: { locale, slug } }: { params
|
||||||
<Suspense fallback={<p>Loading...</p>}>
|
<Suspense fallback={<p>Loading...</p>}>
|
||||||
<SessionDetails
|
<SessionDetails
|
||||||
locale={locale}
|
locale={locale}
|
||||||
sessionId={sessionId as number}
|
sessionId={sessionId}
|
||||||
activeType={sessionType as SessionType}
|
activeType={sessionType as SessionType}
|
||||||
/>
|
/>
|
||||||
</Suspense>
|
</Suspense>
|
||||||
|
|
|
@ -8,5 +8,5 @@ import { SessionType } from '../../../../../types/sessions';
|
||||||
export default function SessionsMainPage() {
|
export default function SessionsMainPage() {
|
||||||
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
||||||
|
|
||||||
return token ? redirect(`sessions/${SessionType.UPCOMING}`) : null;
|
return token ? redirect(SessionType.UPCOMING) : null;
|
||||||
};
|
};
|
||||||
|
|
|
@ -3,7 +3,7 @@ import type { Metadata } from 'next';
|
||||||
import { unstable_setRequestLocale } from 'next-intl/server';
|
import { unstable_setRequestLocale } from 'next-intl/server';
|
||||||
import { useTranslations } from 'next-intl';
|
import { useTranslations } from 'next-intl';
|
||||||
import { GeneralTopSection } from '../../../components/Page';
|
import { GeneralTopSection } from '../../../components/Page';
|
||||||
import { ScreenCarousel } from '../../../components/Page/ScreenCarousel';
|
import { ScreenCarousel } from '../../../components/Page/ScreenCarousel/index';
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: 'Bbuddy - Become a BB expert',
|
title: 'Bbuddy - Become a BB expert',
|
||||||
|
|
|
@ -9,6 +9,7 @@ import {CustomPagination} from "../../../components/view/CustomPagination";
|
||||||
import {DEFAULT_PAGE_SIZE} from "../../../constants/common";
|
import {DEFAULT_PAGE_SIZE} from "../../../constants/common";
|
||||||
import {BlogPosts} from "../../../components/BlogPosts/BlogPosts";
|
import {BlogPosts} from "../../../components/BlogPosts/BlogPosts";
|
||||||
|
|
||||||
|
|
||||||
interface BlogPostPageParams {
|
interface BlogPostPageParams {
|
||||||
slug: string
|
slug: string
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,9 +6,10 @@ import { getExpertById, getExpertsList } from '../../../../actions/experts';
|
||||||
import {
|
import {
|
||||||
ExpertCard,
|
ExpertCard,
|
||||||
ExpertCertificate,
|
ExpertCertificate,
|
||||||
|
ExpertInformation,
|
||||||
ExpertPractice
|
ExpertPractice
|
||||||
} from '../../../../components/Experts/ExpertDetails';
|
} from '../../../../components/Experts/ExpertDetails';
|
||||||
import { Details } from '../../../../types/education';
|
import { Details } from '../../../../types/experts';
|
||||||
import { BackButton } from '../../../../components/view/BackButton';
|
import { BackButton } from '../../../../components/view/BackButton';
|
||||||
import { i18nText } from '../../../../i18nKeys';
|
import { i18nText } from '../../../../i18nKeys';
|
||||||
|
|
||||||
|
@ -35,6 +36,7 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
|
||||||
if (!expertId) notFound();
|
if (!expertId) notFound();
|
||||||
|
|
||||||
const expert = await getExpertById(expertId, locale);
|
const expert = await getExpertById(expertId, locale);
|
||||||
|
console.log(expert);
|
||||||
|
|
||||||
const getAssociationLevel = (accLevelId?: number) => {
|
const getAssociationLevel = (accLevelId?: number) => {
|
||||||
if (accLevelId) {
|
if (accLevelId) {
|
||||||
|
@ -81,7 +83,8 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
|
||||||
</BackButton>
|
</BackButton>
|
||||||
</Suspense>
|
</Suspense>
|
||||||
</div>
|
</div>
|
||||||
<ExpertCard expert={expert} locale={locale} expertId={expertId}/>
|
<ExpertCard expert={expert} locale={locale} />
|
||||||
|
<ExpertInformation expert={expert} locale={locale} />
|
||||||
|
|
||||||
<h2 className="title-h2">{i18nText('expertBackground', locale)}</h2>
|
<h2 className="title-h2">{i18nText('expertBackground', locale)}</h2>
|
||||||
<p className="base-text">
|
<p className="base-text">
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import React, { ReactNode, Suspense } from 'react';
|
import React, { ReactNode } from 'react';
|
||||||
import { Metadata } from 'next';
|
import { Metadata } from 'next';
|
||||||
import { unstable_setRequestLocale } from 'next-intl/server';
|
import { unstable_setRequestLocale } from 'next-intl/server';
|
||||||
import { notFound } from 'next/navigation';
|
import { notFound } from 'next/navigation';
|
||||||
|
@ -6,7 +6,7 @@ import { ConfigProvider } from 'antd';
|
||||||
import { AntdRegistry } from '@ant-design/nextjs-registry';
|
import { AntdRegistry } from '@ant-design/nextjs-registry';
|
||||||
import theme from '../../constants/theme';
|
import theme from '../../constants/theme';
|
||||||
import { ALLOWED_LOCALES } from '../../constants/locale';
|
import { ALLOWED_LOCALES } from '../../constants/locale';
|
||||||
import { Header, Footer, AppConfig } from '../../components/Page';
|
import { Header, Footer } from '../../components/Page';
|
||||||
|
|
||||||
type LayoutProps = {
|
type LayoutProps = {
|
||||||
children: ReactNode;
|
children: ReactNode;
|
||||||
|
@ -30,9 +30,6 @@ export default function LocaleLayout({ children, params: { locale } }: LayoutPro
|
||||||
<AntdRegistry>
|
<AntdRegistry>
|
||||||
<ConfigProvider theme={theme}>
|
<ConfigProvider theme={theme}>
|
||||||
<div className="b-wrapper">
|
<div className="b-wrapper">
|
||||||
<Suspense fallback={null}>
|
|
||||||
<AppConfig />
|
|
||||||
</Suspense>
|
|
||||||
<div className="b-content">
|
<div className="b-content">
|
||||||
<Header locale={locale} />
|
<Header locale={locale} />
|
||||||
{children}
|
{children}
|
||||||
|
@ -42,4 +39,4 @@ export default function LocaleLayout({ children, params: { locale } }: LayoutPro
|
||||||
</ConfigProvider>
|
</ConfigProvider>
|
||||||
</AntdRegistry>
|
</AntdRegistry>
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
|
@ -1,66 +0,0 @@
|
||||||
import type { Stripe } from "stripe";
|
|
||||||
|
|
||||||
import { NextResponse } from "next/server";
|
|
||||||
|
|
||||||
import { stripe } from "../../../lib/stripe";
|
|
||||||
|
|
||||||
export async function POST(req: Request) {
|
|
||||||
let event: Stripe.Event;
|
|
||||||
|
|
||||||
try {
|
|
||||||
event = stripe.webhooks.constructEvent(
|
|
||||||
await (await req.blob()).text(),
|
|
||||||
req.headers.get("stripe-signature") as string,
|
|
||||||
process.env.STRIPE_WEBHOOK_SECRET as string,
|
|
||||||
);
|
|
||||||
} catch (err) {
|
|
||||||
const errorMessage = err instanceof Error ? err.message : "Unknown error";
|
|
||||||
// On error, log and return the error message.
|
|
||||||
if (err! instanceof Error) console.log(err);
|
|
||||||
console.log(`❌ Error message: ${errorMessage}`);
|
|
||||||
return NextResponse.json(
|
|
||||||
{ message: `Webhook Error: ${errorMessage}` },
|
|
||||||
{ status: 400 },
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Successfully constructed event.
|
|
||||||
console.log("✅ Success:", event.id);
|
|
||||||
|
|
||||||
const permittedEvents: string[] = [
|
|
||||||
"checkout.session.completed",
|
|
||||||
"payment_intent.succeeded",
|
|
||||||
"payment_intent.payment_failed",
|
|
||||||
];
|
|
||||||
|
|
||||||
if (permittedEvents.includes(event.type)) {
|
|
||||||
let data;
|
|
||||||
|
|
||||||
try {
|
|
||||||
switch (event.type) {
|
|
||||||
case "checkout.session.completed":
|
|
||||||
data = event.data.object as Stripe.Checkout.Session;
|
|
||||||
console.log(`💰 CheckoutSession status: ${data.payment_status}`);
|
|
||||||
break;
|
|
||||||
case "payment_intent.payment_failed":
|
|
||||||
data = event.data.object as Stripe.PaymentIntent;
|
|
||||||
console.log(`❌ Payment failed: ${data.last_payment_error?.message}`);
|
|
||||||
break;
|
|
||||||
case "payment_intent.succeeded":
|
|
||||||
data = event.data.object as Stripe.PaymentIntent;
|
|
||||||
console.log(`💰 PaymentIntent status: ${data.status}`);
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
throw new Error(`Unhandled event: ${event.type}`);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.log(error);
|
|
||||||
return NextResponse.json(
|
|
||||||
{ message: "Webhook handler failed" },
|
|
||||||
{ status: 500 },
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Return a response to acknowledge receipt of the event.
|
|
||||||
return NextResponse.json({ message: "Received" }, { status: 200 });
|
|
||||||
}
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { fetchBlogPosts } from '../lib/contentful/blogPosts';
|
import {fetchBlogPosts} from "../lib/contentful/blogPosts";
|
||||||
|
|
||||||
export default async function sitemap() {
|
export default async function sitemap() {
|
||||||
const paths = [
|
const paths = [
|
||||||
|
@ -24,4 +24,4 @@ export default async function sitemap() {
|
||||||
})
|
})
|
||||||
|
|
||||||
return paths
|
return paths
|
||||||
}
|
}
|
|
@ -1,8 +1,8 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import React, { FC, useEffect, useState } from 'react';
|
import React, { FC, useEffect, useState } from 'react';
|
||||||
import { Form, message, Upload } from 'antd';
|
import { Button, Form, message, Upload } from 'antd';
|
||||||
import type { UploadFile } from 'antd';
|
import type { GetProp, UploadFile, UploadProps } from 'antd';
|
||||||
import ImgCrop from 'antd-img-crop';
|
import ImgCrop from 'antd-img-crop';
|
||||||
import { CameraOutlined, DeleteOutlined } from '@ant-design/icons';
|
import { CameraOutlined, DeleteOutlined } from '@ant-design/icons';
|
||||||
import { useRouter } from '../../navigation';
|
import { useRouter } from '../../navigation';
|
||||||
|
@ -12,7 +12,7 @@ import { validateImage } from '../../utils/account';
|
||||||
import { useProfileSettings } from '../../actions/hooks/useProfileSettings';
|
import { useProfileSettings } from '../../actions/hooks/useProfileSettings';
|
||||||
import { CustomInput } from '../view/CustomInput';
|
import { CustomInput } from '../view/CustomInput';
|
||||||
import { OutlinedButton } from '../view/OutlinedButton';
|
import { OutlinedButton } from '../view/OutlinedButton';
|
||||||
import { FilledSquareButton, FilledYellowButton } from '../view/FilledButton';
|
import {FilledButton, FilledSquareButton, FilledYellowButton} from '../view/FilledButton';
|
||||||
import { DeleteAccountModal } from '../Modals/DeleteAccountModal';
|
import { DeleteAccountModal } from '../Modals/DeleteAccountModal';
|
||||||
import { Loader } from '../view/Loader';
|
import { Loader } from '../view/Loader';
|
||||||
|
|
||||||
|
@ -20,6 +20,8 @@ type ProfileSettingsProps = {
|
||||||
locale: string;
|
locale: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
type FileType = Parameters<GetProp<UploadProps, 'beforeUpload'>>[0];
|
||||||
|
|
||||||
export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
const [form] = Form.useForm<ProfileRequest>();
|
const [form] = Form.useForm<ProfileRequest>();
|
||||||
const { profileSettings, fetchProfileSettings, save, fetchLoading } = useProfileSettings(locale);
|
const { profileSettings, fetchProfileSettings, save, fetchLoading } = useProfileSettings(locale);
|
||||||
|
@ -38,24 +40,10 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
}
|
}
|
||||||
}, [profileSettings]);
|
}, [profileSettings]);
|
||||||
|
|
||||||
const onSave = (newProfile: ProfileRequest) => {
|
|
||||||
setSaveLoading(true);
|
|
||||||
save(newProfile)
|
|
||||||
.then(() => {
|
|
||||||
fetchProfileSettings();
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
message.error('Не удалось сохранить изменения');
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setSaveLoading(false);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const onSaveProfile = () => {
|
const onSaveProfile = () => {
|
||||||
form.validateFields()
|
form.validateFields()
|
||||||
.then(({ login, surname, username }) => {
|
.then(({ login, surname, username }) => {
|
||||||
const { phone, role, languagesLinks } = profileSettings || {};
|
const { phone, role, languagesLinks } = profileSettings;
|
||||||
const newProfile: ProfileRequest = {
|
const newProfile: ProfileRequest = {
|
||||||
phone,
|
phone,
|
||||||
role,
|
role,
|
||||||
|
@ -68,18 +56,27 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
if (photo) {
|
if (photo) {
|
||||||
const reader = new FileReader();
|
console.log(photo);
|
||||||
reader.readAsDataURL(photo as File);
|
const formData = new FormData();
|
||||||
reader.onloadend = () => {
|
formData.append('file', photo as FileType);
|
||||||
const newReg = new RegExp('data:image/(png|jpg|jpeg);base64,')
|
|
||||||
newProfile.faceImage = reader?.result?.replace(newReg, '');
|
|
||||||
newProfile.isFaceImageKeepExisting = false;
|
|
||||||
|
|
||||||
onSave(newProfile);
|
newProfile.faceImage = `[${(photo as File).arrayBuffer()}]`;
|
||||||
}
|
newProfile.isFaceImageKeepExisting = false;
|
||||||
} else {
|
|
||||||
onSave(newProfile);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
console.log(newProfile);
|
||||||
|
|
||||||
|
setSaveLoading(true);
|
||||||
|
save(newProfile)
|
||||||
|
.then(() => {
|
||||||
|
fetchProfileSettings();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error('Не удалось сохранить изменения');
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
setSaveLoading(false);
|
||||||
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -106,10 +103,6 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
modalTitle="Редактировать"
|
modalTitle="Редактировать"
|
||||||
modalOk="Сохранить"
|
modalOk="Сохранить"
|
||||||
modalCancel="Отмена"
|
modalCancel="Отмена"
|
||||||
modalProps={{
|
|
||||||
okButtonProps: { className: 'b-button__filled_yellow' },
|
|
||||||
cancelButtonProps: { className: 'b-button__outlined' }
|
|
||||||
}}
|
|
||||||
beforeCrop={beforeCrop}
|
beforeCrop={beforeCrop}
|
||||||
>
|
>
|
||||||
<Upload
|
<Upload
|
||||||
|
@ -121,7 +114,7 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
url: profileSettings.faceImageUrl
|
url: profileSettings.faceImageUrl
|
||||||
}
|
}
|
||||||
] : undefined}
|
] : undefined}
|
||||||
accept=".jpg,.jpeg,.png"
|
accept=".jpg,.jpeg,.png,.gif"
|
||||||
beforeUpload={beforeUpload}
|
beforeUpload={beforeUpload}
|
||||||
multiple={false}
|
multiple={false}
|
||||||
showUploadList={false}
|
showUploadList={false}
|
||||||
|
@ -178,7 +171,7 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
|
||||||
>
|
>
|
||||||
{i18nText('save', locale)}
|
{i18nText('save', locale)}
|
||||||
</FilledYellowButton>
|
</FilledYellowButton>
|
||||||
<OutlinedButton onClick={() => router.push('settings/change-password')}>
|
<OutlinedButton onClick={() => router.push('change-password')}>
|
||||||
{i18nText('changePass', locale)}
|
{i18nText('changePass', locale)}
|
||||||
</OutlinedButton>
|
</OutlinedButton>
|
||||||
<OutlinedButton
|
<OutlinedButton
|
||||||
|
|
|
@ -37,7 +37,7 @@ export const Agora = ({ sessionId, secret, stopCalling, remoteUser }: AgoraProps
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="b-agora__wrap b-agora__wrap__single">
|
<div className="b-agora__wrap">
|
||||||
<RemoteUserPanel calling={calling} user={remoteUser} />
|
<RemoteUserPanel calling={calling} user={remoteUser} />
|
||||||
<div className="b-agora__panel">
|
<div className="b-agora__panel">
|
||||||
<MediaControl
|
<MediaControl
|
||||||
|
|
|
@ -1,54 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useJoin } from 'agora-rtc-react';
|
|
||||||
import { useEffect, useState } from 'react';
|
|
||||||
import { MediaControl } from './view';
|
|
||||||
import { UsersGroupPanel } from './components';
|
|
||||||
|
|
||||||
type AgoraProps = {
|
|
||||||
roomId: number;
|
|
||||||
secret?: string;
|
|
||||||
stopCalling: () => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const AgoraGroup = ({ roomId, secret, stopCalling }: AgoraProps) => {
|
|
||||||
const [calling, setCalling] = useState(false);
|
|
||||||
const [micOn, setMic] = useState(false);
|
|
||||||
const [cameraOn, setCamera] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setCalling(true);
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
useJoin(
|
|
||||||
{
|
|
||||||
appid: process.env.NEXT_PUBLIC_AGORA_APPID,
|
|
||||||
channel: `${roomId}-${secret}`,
|
|
||||||
token: null,
|
|
||||||
},
|
|
||||||
calling,
|
|
||||||
);
|
|
||||||
|
|
||||||
const stop = () => {
|
|
||||||
stopCalling();
|
|
||||||
setCalling(false);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="b-agora__wrap">
|
|
||||||
<UsersGroupPanel calling={calling} micOn={micOn} cameraOn={cameraOn}/>
|
|
||||||
</div>
|
|
||||||
<div className="b-agora__panel_group">
|
|
||||||
<MediaControl
|
|
||||||
calling={calling}
|
|
||||||
cameraOn={cameraOn}
|
|
||||||
micOn={micOn}
|
|
||||||
setCalling={stop}
|
|
||||||
setCamera={() => setCamera(a => !a)}
|
|
||||||
setMic={() => setMic(a => !a)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,44 +0,0 @@
|
||||||
import {
|
|
||||||
useIsConnected, useLocalCameraTrack, useLocalMicrophoneTrack, usePublish,
|
|
||||||
useRemoteAudioTracks,
|
|
||||||
useRemoteUsers,
|
|
||||||
useRemoteVideoTracks
|
|
||||||
} from 'agora-rtc-react';
|
|
||||||
import { LocalUser } from './LocalUser';
|
|
||||||
import { RemoteVideoPlayer } from './RemoteVideoPlayer';
|
|
||||||
|
|
||||||
type UsersGroupPanelProps = {
|
|
||||||
calling: boolean;
|
|
||||||
micOn: boolean;
|
|
||||||
cameraOn: boolean;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const UsersGroupPanel = ({ calling, micOn, cameraOn }: UsersGroupPanelProps) => {
|
|
||||||
const isConnected = useIsConnected();
|
|
||||||
const remoteUsers = useRemoteUsers();
|
|
||||||
const { localMicrophoneTrack } = useLocalMicrophoneTrack(micOn);
|
|
||||||
const { localCameraTrack } = useLocalCameraTrack(cameraOn);
|
|
||||||
const { videoTracks } = useRemoteVideoTracks(remoteUsers);
|
|
||||||
const { audioTracks } = useRemoteAudioTracks(remoteUsers);
|
|
||||||
|
|
||||||
usePublish([localMicrophoneTrack, localCameraTrack]);
|
|
||||||
audioTracks.map(track => track.play());
|
|
||||||
|
|
||||||
return calling && isConnected && remoteUsers ? (
|
|
||||||
<div className={`b-agora__remote_groups gr-${remoteUsers.length + 1}`}>
|
|
||||||
<div>
|
|
||||||
<LocalUser
|
|
||||||
audioTrack={localMicrophoneTrack}
|
|
||||||
cameraOn={cameraOn}
|
|
||||||
micOn={micOn}
|
|
||||||
videoTrack={localCameraTrack}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{remoteUsers.length > 0 && remoteUsers.map((user) => (
|
|
||||||
<div key={user.uid}>
|
|
||||||
<RemoteVideoPlayer track={user.videoTrack} />
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
) : null;
|
|
||||||
}
|
|
|
@ -3,4 +3,3 @@ export * from './UserCover';
|
||||||
export * from './RemoteUsers';
|
export * from './RemoteUsers';
|
||||||
export * from './LocalUserPanel';
|
export * from './LocalUserPanel';
|
||||||
export * from './RemoteUserPanel';
|
export * from './RemoteUserPanel';
|
||||||
export * from './UsersGroupPanel';
|
|
||||||
|
|
|
@ -2,9 +2,7 @@
|
||||||
|
|
||||||
import AgoraRTC, { AgoraRTCProvider } from 'agora-rtc-react';
|
import AgoraRTC, { AgoraRTCProvider } from 'agora-rtc-react';
|
||||||
import { Session } from '../../../types/sessions';
|
import { Session } from '../../../types/sessions';
|
||||||
import { Room } from '../../../types/rooms';
|
|
||||||
import { Agora } from './Agora';
|
import { Agora } from './Agora';
|
||||||
import { AgoraGroup } from './AgoraGroup';
|
|
||||||
|
|
||||||
export const AgoraClient = ({ session, stopCalling, isCoach }: { session?: Session, stopCalling: () => void, isCoach: boolean }) => {
|
export const AgoraClient = ({ session, stopCalling, isCoach }: { session?: Session, stopCalling: () => void, isCoach: boolean }) => {
|
||||||
const remoteUser = isCoach ? (session?.clients?.length ? session?.clients[0] : undefined) : session?.coach;
|
const remoteUser = isCoach ? (session?.clients?.length ? session?.clients[0] : undefined) : session?.coach;
|
||||||
|
@ -22,17 +20,3 @@ export const AgoraClient = ({ session, stopCalling, isCoach }: { session?: Sessi
|
||||||
</AgoraRTCProvider>
|
</AgoraRTCProvider>
|
||||||
) : null;
|
) : null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const AgoraClientGroup = ({ room, stopCalling }: { room?: Room, stopCalling: () => void }) => {
|
|
||||||
return room ? (
|
|
||||||
<AgoraRTCProvider client={AgoraRTC.createClient({ mode: "rtc", codec: "vp8" })}>
|
|
||||||
{room && (
|
|
||||||
<AgoraGroup
|
|
||||||
roomId={room.id}
|
|
||||||
secret={room.secret}
|
|
||||||
stopCalling={stopCalling}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</AgoraRTCProvider>
|
|
||||||
) : null;
|
|
||||||
};
|
|
||||||
|
|
|
@ -3,4 +3,3 @@
|
||||||
export { AccountMenu } from './AccountMenu';
|
export { AccountMenu } from './AccountMenu';
|
||||||
export { ProfileSettings } from './ProfileSettings';
|
export { ProfileSettings } from './ProfileSettings';
|
||||||
export * from './sessions';
|
export * from './sessions';
|
||||||
export * from './rooms';
|
|
||||||
|
|
|
@ -1,45 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useEffect, useState } from 'react';
|
|
||||||
import { EditRoomForm } from './EditRoomForm';
|
|
||||||
import debounce from 'lodash/debounce';
|
|
||||||
import { createRoom } from '../../../actions/rooms';
|
|
||||||
import { Loader } from '../../view/Loader';
|
|
||||||
import { useRouter } from '../../../navigation';
|
|
||||||
import { RoomsType } from '../../../types/rooms';
|
|
||||||
|
|
||||||
|
|
||||||
export const CreateRoom = ({ locale, jwt }: { locale: string, jwt: string }) => {
|
|
||||||
const [roomId, setRoomId] = useState<number>();
|
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const getRoom = debounce(() => {
|
|
||||||
createRoom(locale, jwt)
|
|
||||||
.then((data) => {
|
|
||||||
setRoomId(data);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setLoading(false);
|
|
||||||
})
|
|
||||||
}, 500);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setLoading(true);
|
|
||||||
getRoom();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Loader isLoading={loading}>
|
|
||||||
{roomId && (
|
|
||||||
<EditRoomForm
|
|
||||||
roomId={roomId}
|
|
||||||
locale={locale}
|
|
||||||
jwt={jwt}
|
|
||||||
mode="create"
|
|
||||||
afterSubmit={() => router.push(`/account/rooms/${RoomsType.UPCOMING}`)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Loader>
|
|
||||||
)
|
|
||||||
};
|
|
|
@ -1,220 +0,0 @@
|
||||||
import React, { useCallback, useEffect, useState } from 'react';
|
|
||||||
import { Button, Form, Input, notification } from 'antd';
|
|
||||||
import dayjs, { Dayjs } from 'dayjs';
|
|
||||||
import { i18nText } from '../../../i18nKeys';
|
|
||||||
import { Tag } from '../../../types/tags';
|
|
||||||
import { Slot } from '../../../types/experts';
|
|
||||||
import { RoomEdit, RoomEditDTO } from '../../../types/rooms';
|
|
||||||
import { getRoomById, updateRoom } from '../../../actions/rooms';
|
|
||||||
import { Loader } from '../../view/Loader';
|
|
||||||
import { CustomInput } from '../../view/CustomInput';
|
|
||||||
import { CustomSelect } from '../../view/CustomSelect';
|
|
||||||
import { CustomSwitch } from '../../view/CustomSwitch';
|
|
||||||
import { CustomMultiSelect } from '../../view/CustomMultiSelect';
|
|
||||||
import { CustomDatePicker } from '../../view/CustomDatePicker';
|
|
||||||
|
|
||||||
type EditRoomFormProps = {
|
|
||||||
roomId: number,
|
|
||||||
locale: string,
|
|
||||||
jwt: string,
|
|
||||||
mode: 'create' | 'edit';
|
|
||||||
afterSubmit?: () => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
type RoomFormState = {
|
|
||||||
title?: string;
|
|
||||||
description?: string;
|
|
||||||
date?: Dayjs;
|
|
||||||
maxCount?: number;
|
|
||||||
startAt?: string;
|
|
||||||
supervisor?: boolean;
|
|
||||||
tags?: number[];
|
|
||||||
};
|
|
||||||
|
|
||||||
export const EditRoomForm = ({ roomId, locale, jwt, mode, afterSubmit }: EditRoomFormProps) => {
|
|
||||||
const [form] = Form.useForm<RoomFormState>();
|
|
||||||
const [editingRoom, setEditingRoom] = useState<RoomEditDTO>();
|
|
||||||
const dateValue = Form.useWatch('date', form);
|
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
|
||||||
const [fetchLoading, setFetchLoading] = useState<boolean>(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setFetchLoading(true);
|
|
||||||
getRoomById(locale, jwt, roomId)
|
|
||||||
.then((data) => {
|
|
||||||
setEditingRoom(data);
|
|
||||||
const { item } = data || {};
|
|
||||||
|
|
||||||
if (mode === 'edit' && item) {
|
|
||||||
form.setFieldsValue({
|
|
||||||
title: item.title,
|
|
||||||
description: item.description,
|
|
||||||
date: item?.scheduledStartAtUtc ? dayjs(item.scheduledStartAtUtc) : undefined,
|
|
||||||
maxCount: item.maxClients,
|
|
||||||
startAt: item?.scheduledStartAtUtc,
|
|
||||||
supervisor: item.isNeedSupervisor,
|
|
||||||
tags: item.tagIds || undefined
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setFetchLoading(false);
|
|
||||||
})
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const getAvailableSlots = useCallback((): string[] => {
|
|
||||||
const dateList = new Set<string>();
|
|
||||||
if (editingRoom?.availableSlots) {
|
|
||||||
editingRoom.availableSlots.forEach(({ startTime }) => {
|
|
||||||
const [date] = startTime.split('T');
|
|
||||||
dateList.add(dayjs(date).format('YYYY-MM-DD'));
|
|
||||||
});
|
|
||||||
|
|
||||||
return Array.from(dateList);
|
|
||||||
}
|
|
||||||
|
|
||||||
return [];
|
|
||||||
}, [editingRoom?.availableSlots]);
|
|
||||||
|
|
||||||
const getTimeOptions = (slots?: Slot[], curDate?: Dayjs) => {
|
|
||||||
const date = curDate ? curDate.format('YYYY-MM-DD') : '';
|
|
||||||
if (slots && slots?.length && date) {
|
|
||||||
return slots.filter(({ startTime }) => dayjs(startTime).format('YYYY-MM-DD') === date)
|
|
||||||
.map(({ startTime, endTime }) => ({ value: startTime, label: `${dayjs(startTime).format('HH:mm')} - ${dayjs(endTime).format('HH:mm')}` }));
|
|
||||||
}
|
|
||||||
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
|
|
||||||
const getTagsOptions = (tags?: Tag[]) => {
|
|
||||||
if (tags) {
|
|
||||||
return tags.map(({ id, name }) => ({ value: id, label: <span>{name}</span> })) || [];
|
|
||||||
}
|
|
||||||
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
|
|
||||||
const onSubmit = () => {
|
|
||||||
setLoading(true);
|
|
||||||
const { title, description, startAt, maxCount, tags, supervisor } = form.getFieldsValue();
|
|
||||||
const result: RoomEdit = {
|
|
||||||
...editingRoom,
|
|
||||||
id: roomId,
|
|
||||||
title,
|
|
||||||
scheduledStartAtUtc: startAt,
|
|
||||||
maxClients: maxCount,
|
|
||||||
isNeedSupervisor: supervisor,
|
|
||||||
tagIds: tags || []
|
|
||||||
};
|
|
||||||
|
|
||||||
if (description) {
|
|
||||||
result.description = description;
|
|
||||||
}
|
|
||||||
|
|
||||||
updateRoom(locale, jwt, result)
|
|
||||||
.then(() => {
|
|
||||||
afterSubmit && afterSubmit();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setLoading(false)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const disabledDate = (current: Dayjs) => current && !getAvailableSlots().includes(current.format('YYYY-MM-DD'));
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Loader isLoading={fetchLoading}>
|
|
||||||
<Form
|
|
||||||
form={form}
|
|
||||||
autoComplete="off"
|
|
||||||
style={{ display: 'flex', gap: 16, flexDirection: 'column' }}
|
|
||||||
onFinish={onSubmit}
|
|
||||||
className="b-room-form"
|
|
||||||
>
|
|
||||||
<Form.Item
|
|
||||||
name="title"
|
|
||||||
rules={[{ required: true }]}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<CustomInput
|
|
||||||
size="small"
|
|
||||||
placeholder={i18nText('title', locale)}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item name="description">
|
|
||||||
<Input.TextArea
|
|
||||||
className="b-textarea"
|
|
||||||
rows={4}
|
|
||||||
maxLength={1000}
|
|
||||||
placeholder={i18nText('description', locale)}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<div className="b-room-form__grid">
|
|
||||||
<Form.Item
|
|
||||||
name="date"
|
|
||||||
rules={[{ required: true }]}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<CustomDatePicker
|
|
||||||
locale={locale}
|
|
||||||
label={i18nText('room.date', locale)}
|
|
||||||
disabledDate={disabledDate}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name="startAt"
|
|
||||||
rules={[{ required: true }]}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<CustomSelect
|
|
||||||
label={i18nText('room.time', locale)}
|
|
||||||
options={getTimeOptions(editingRoom?.availableSlots, dateValue)}
|
|
||||||
disabled={!dateValue}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name="maxCount"
|
|
||||||
rules={[{ required: true }]}
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<CustomSelect
|
|
||||||
label={i18nText('room.maxParticipants', locale)}
|
|
||||||
options={Array.from({ length: 16 }).map((_, i) => ({ value: i+1, label: i+1 }))}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name="supervisor"
|
|
||||||
valuePropName="checked"
|
|
||||||
label={i18nText('room.presenceOfSupervisor', locale)}
|
|
||||||
className="b-room-switch"
|
|
||||||
>
|
|
||||||
<CustomSwitch />
|
|
||||||
</Form.Item>
|
|
||||||
</div>
|
|
||||||
<Form.Item
|
|
||||||
name="tags"
|
|
||||||
noStyle
|
|
||||||
>
|
|
||||||
<CustomMultiSelect
|
|
||||||
label={i18nText('topics', locale)}
|
|
||||||
options={getTagsOptions(editingRoom?.tags)}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Button
|
|
||||||
className="card-detail__apply"
|
|
||||||
htmlType="submit"
|
|
||||||
loading={loading}
|
|
||||||
disabled={loading}
|
|
||||||
>
|
|
||||||
{i18nText('room.save', locale)}
|
|
||||||
</Button>
|
|
||||||
</Form>
|
|
||||||
</Loader>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,66 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useState, useEffect } from 'react';
|
|
||||||
import { RoomsType } from '../../../types/rooms';
|
|
||||||
import { useSessionTracking } from '../../../actions/hooks/useSessionTracking';
|
|
||||||
import { AccountMenu } from '../AccountMenu';
|
|
||||||
import { Loader } from '../../view/Loader';
|
|
||||||
import { RoomDetailsContent } from './RoomDetailsContent';
|
|
||||||
import { useRoomDetails } from '../../../actions/hooks/useRoomDetails';
|
|
||||||
import { AgoraClientGroup } from '../agora';
|
|
||||||
|
|
||||||
type RoomDetailsProps = {
|
|
||||||
locale: string;
|
|
||||||
roomId: number;
|
|
||||||
activeType: RoomsType;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const RoomDetails = ({ roomId, locale, activeType }: RoomDetailsProps) => {
|
|
||||||
const { room, errorData, loading, fetchData } = useRoomDetails(locale, roomId);
|
|
||||||
const tracking = useSessionTracking(locale, roomId);
|
|
||||||
const [isCalling, setIsCalling] = useState<boolean>(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (isCalling) {
|
|
||||||
tracking.start();
|
|
||||||
} else {
|
|
||||||
tracking.stop();
|
|
||||||
}
|
|
||||||
}, [isCalling]);
|
|
||||||
|
|
||||||
const stopCalling = () => {
|
|
||||||
setIsCalling(false);
|
|
||||||
fetchData();
|
|
||||||
}
|
|
||||||
|
|
||||||
return isCalling
|
|
||||||
? (
|
|
||||||
<AgoraClientGroup
|
|
||||||
room={room}
|
|
||||||
stopCalling={stopCalling}
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
<div className="col-xl-3 col-lg-4 d-none d-lg-block">
|
|
||||||
<AccountMenu locale={locale} />
|
|
||||||
</div>
|
|
||||||
<div className="col-xl-9 col-lg-8 ">
|
|
||||||
<div className="page-account__inner">
|
|
||||||
<Loader
|
|
||||||
isLoading={loading}
|
|
||||||
errorData={errorData}
|
|
||||||
refresh={fetchData}
|
|
||||||
>
|
|
||||||
<RoomDetailsContent
|
|
||||||
locale={locale}
|
|
||||||
room={room}
|
|
||||||
activeType={activeType}
|
|
||||||
startRoom={() => setIsCalling(true)}
|
|
||||||
refresh={fetchData}
|
|
||||||
/>
|
|
||||||
</Loader>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,355 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useState } from 'react';
|
|
||||||
import { Button, notification, Tag } from 'antd';
|
|
||||||
import { DeleteOutlined, LeftOutlined } from '@ant-design/icons';
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import Image from 'next/image';
|
|
||||||
import { useRouter } from '../../../navigation';
|
|
||||||
import { Room, RoomsType } from '../../../types/rooms';
|
|
||||||
import { i18nText } from '../../../i18nKeys';
|
|
||||||
import { LinkButton } from '../../view/LinkButton';
|
|
||||||
import {
|
|
||||||
addClient,
|
|
||||||
addSupervisor,
|
|
||||||
becomeRoomClient,
|
|
||||||
becomeRoomSupervisor,
|
|
||||||
deleteRoomClient,
|
|
||||||
deleteRoomSupervisor
|
|
||||||
} from '../../../actions/rooms';
|
|
||||||
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../../constants/common';
|
|
||||||
import { useLocalStorage } from '../../../hooks/useLocalStorage';
|
|
||||||
import { UserListModal } from '../../Modals/UsersListModal';
|
|
||||||
import { SessionState } from '../../../types/sessions';
|
|
||||||
import { EditRoomForm } from './EditRoomForm';
|
|
||||||
|
|
||||||
type RoomDetailsContentProps = {
|
|
||||||
locale: string;
|
|
||||||
activeType: RoomsType;
|
|
||||||
room?: Room;
|
|
||||||
startRoom: () => void;
|
|
||||||
refresh: () => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const RoomDetailsContent = ({ room, startRoom, locale, activeType, refresh }: RoomDetailsContentProps) => {
|
|
||||||
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
|
||||||
const [userData] = useLocalStorage(AUTH_USER, '');
|
|
||||||
const { id: userId = 0 } = userData ? JSON.parse(userData) : {};
|
|
||||||
const router = useRouter();
|
|
||||||
const [showModal, setShowModal] = useState<boolean>(false);
|
|
||||||
const [forSupervisor, setForSupervisor] = useState<boolean>(false);
|
|
||||||
const startDate = room?.scheduledStartAtUtc ? dayjs(room?.scheduledStartAtUtc).locale(locale) : null;
|
|
||||||
const endDate = room?.scheduledEndAtUtc ? dayjs(room?.scheduledEndAtUtc).locale(locale) : null;
|
|
||||||
const today = startDate ? dayjs().format('YYYY-MM-DD') === startDate.format('YYYY-MM-DD') : false;
|
|
||||||
const isCreator = room?.coach && room.coach.id === +userId || false;
|
|
||||||
const isSupervisor = room?.supervisor && room.supervisor.id === +userId || false;
|
|
||||||
const isClient = room?.clients && room.clients.length > 0 && room.clients.map(({ id }) => id).includes(+userId) || false;
|
|
||||||
const isTimeBeforeStart = room?.scheduledStartAtUtc ? dayjs() < dayjs(room.scheduledStartAtUtc) : false;
|
|
||||||
const [isEdit, setIsEdit] = useState<boolean>(false);
|
|
||||||
|
|
||||||
const goBack = () => router.push(`/account/rooms/${activeType}`);
|
|
||||||
|
|
||||||
const checkUserApply = (): boolean => (!room?.supervisor || !isSupervisor) && (!room?.clients || room?.clients && room?.clients.length === 0 || !isClient);
|
|
||||||
|
|
||||||
const deleteClient = (clientUserId: number) => {
|
|
||||||
if (room?.id) {
|
|
||||||
deleteRoomClient(locale, jwt, { sessionId: room.id, clientUserId })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const deleteSupervisor = (supervisorUserId?: number) => {
|
|
||||||
if (room?.id && supervisorUserId) {
|
|
||||||
deleteRoomSupervisor(locale, jwt, { sessionId: room.id, supervisorUserId })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
})
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const becomeClient = () => {
|
|
||||||
if (room?.id && userId) {
|
|
||||||
becomeRoomClient(locale, jwt, { sessionId: room.id, clientUserId: +userId })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const becomeSupervisor = () => {
|
|
||||||
if (room?.id && userId) {
|
|
||||||
becomeRoomSupervisor(locale, jwt, { sessionId: room.id, supervisorUserId: +userId })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const onInviteSupervisor = () => {
|
|
||||||
setForSupervisor(true)
|
|
||||||
setShowModal(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const onAddUser = (id: number) => {
|
|
||||||
if (room?.id) {
|
|
||||||
setShowModal(false);
|
|
||||||
|
|
||||||
if (forSupervisor) {
|
|
||||||
addSupervisor(locale, jwt, { sessionId: room.id, supervisorUserId: id })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
addClient(locale, jwt, { sessionId: room.id, clientUserId: id })
|
|
||||||
.then(() => {
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const afterEditing = () => {
|
|
||||||
setIsEdit(false);
|
|
||||||
refresh();
|
|
||||||
}
|
|
||||||
|
|
||||||
return !isEdit ? (
|
|
||||||
<div className="card-detail">
|
|
||||||
<div>
|
|
||||||
<Button
|
|
||||||
className="card-detail__back"
|
|
||||||
type="link"
|
|
||||||
icon={<LeftOutlined/>}
|
|
||||||
onClick={goBack}
|
|
||||||
>
|
|
||||||
{i18nText('back', locale)}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__name">{room?.title || ''}</div>
|
|
||||||
<div
|
|
||||||
className={`card-detail__date${today ? ' chosen' : ''}${activeType === RoomsType.RECENT ? ' history' : ''}`}>
|
|
||||||
{today
|
|
||||||
? `${i18nText('today', locale)} ${startDate?.format('HH:mm')} - ${endDate?.format('HH:mm')}`
|
|
||||||
: `${startDate?.format('D MMMM')} ${startDate?.format('HH:mm')} - ${endDate?.format('HH:mm')}`}
|
|
||||||
</div>
|
|
||||||
{room?.themesTags && room.themesTags.length > 0 && (
|
|
||||||
<div className="card-detail__skills">
|
|
||||||
<div className="skills__list">
|
|
||||||
{room.themesTags.map((skill) => <Tag key={skill?.id}
|
|
||||||
className="skills__list__item">{skill?.name}</Tag>)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{room?.description && <div className="card-profile__desc">{room.description}</div>}
|
|
||||||
{activeType === RoomsType.UPCOMING && (isCreator || isSupervisor || isClient) && (
|
|
||||||
<div className="card-detail__actions">
|
|
||||||
{(isCreator || isClient || isSupervisor) && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__apply"
|
|
||||||
onClick={startRoom}
|
|
||||||
>
|
|
||||||
{isCreator ? i18nText('session.start', locale) : i18nText('session.join', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{isCreator && isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__filled"
|
|
||||||
onClick={() => setIsEdit(true)}
|
|
||||||
>
|
|
||||||
{i18nText('room.editRoom', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div className="card-detail__profile">
|
|
||||||
<div className="card-detail__profile_title">
|
|
||||||
<div>{i18nText('room.roomCreator', locale)}</div>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__profile_list">
|
|
||||||
<div className="card-detail__profile_item">
|
|
||||||
<div className="card-detail__portrait card-detail__portrait_small">
|
|
||||||
<Image src={room?.coach?.faceImageUrl || '/images/user-avatar.png'} width={86} height={86} alt=""/>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__inner">
|
|
||||||
<div className="card-detail__name">{`${room?.coach?.name} ${room?.coach?.surname || ''}`}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{room?.isNeedSupervisor && (
|
|
||||||
<div className="card-detail__profile">
|
|
||||||
<div className="card-detail__profile_title">
|
|
||||||
<div>{i18nText('room.supervisor', locale)}</div>
|
|
||||||
</div>
|
|
||||||
{room?.supervisor && (
|
|
||||||
<div className="card-detail__profile_list">
|
|
||||||
<div className="card-detail__profile_item">
|
|
||||||
<div className="card-detail__portrait card-detail__portrait_small">
|
|
||||||
<Image src={room?.supervisor?.faceImageUrl || '/images/user-avatar.png'} width={86}
|
|
||||||
height={86}
|
|
||||||
alt=""/>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__inner">
|
|
||||||
<div
|
|
||||||
className="card-detail__name">{`${room?.supervisor?.name} ${room?.supervisor?.surname || ''}`}</div>
|
|
||||||
</div>
|
|
||||||
{isCreator && activeType === RoomsType.UPCOMING && isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && (
|
|
||||||
<LinkButton
|
|
||||||
type="link"
|
|
||||||
style={{alignSelf: 'flex-start'}}
|
|
||||||
danger
|
|
||||||
icon={<DeleteOutlined/>}
|
|
||||||
onClick={() => deleteSupervisor(room?.supervisor?.id)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{room?.supervisor && activeType === RoomsType.RECENT && (
|
|
||||||
<>
|
|
||||||
{room?.supervisorComment && (
|
|
||||||
<div className="card-detail__supervisor-comment">{room.supervisorComment}</div>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && !room?.supervisor && isCreator && activeType === RoomsType.UPCOMING && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__filled"
|
|
||||||
onClick={onInviteSupervisor}
|
|
||||||
>
|
|
||||||
{i18nText('room.inviteSupervisor', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && !room?.supervisor && !isCreator && activeType === RoomsType.UPCOMING && checkUserApply() && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__apply"
|
|
||||||
onClick={becomeSupervisor}
|
|
||||||
>
|
|
||||||
{i18nText('room.joinSupervisor', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{!room?.supervisor && !isCreator && !checkUserApply() && (
|
|
||||||
<div className="card-profile__desc">{i18nText('noData', locale)}</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div className="card-detail__profile">
|
|
||||||
<div className="card-detail__profile_title">
|
|
||||||
<div>{i18nText('room.participants', locale)}</div>
|
|
||||||
<div>{`${room?.clients?.length || 0}/${room?.maxClients}`}</div>
|
|
||||||
</div>
|
|
||||||
{room?.clients && room?.clients?.length > 0 && (
|
|
||||||
<div className="card-detail__profile_list">
|
|
||||||
{room.clients.map(({id, faceImageUrl, name, surname}) => (
|
|
||||||
<div key={id} className="card-detail__profile_item">
|
|
||||||
<div className="card-detail__portrait card-detail__portrait_small">
|
|
||||||
<Image src={faceImageUrl || '/images/user-avatar.png'} width={86}
|
|
||||||
height={86}
|
|
||||||
alt=""/>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__inner">
|
|
||||||
<div
|
|
||||||
className="card-detail__name">{`${name} ${surname || ''}`}</div>
|
|
||||||
</div>
|
|
||||||
{isCreator && room?.state === SessionState.COACH_APPROVED && activeType === RoomsType.UPCOMING && isTimeBeforeStart && (
|
|
||||||
<LinkButton
|
|
||||||
type="link"
|
|
||||||
style={{alignSelf: 'flex-start'}}
|
|
||||||
danger
|
|
||||||
icon={<DeleteOutlined/>}
|
|
||||||
onClick={() => deleteClient(id)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && isCreator && activeType === RoomsType.UPCOMING && (!room?.clients || (room?.clients && room?.clients?.length < room.maxClients)) && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__filled"
|
|
||||||
onClick={() => setShowModal(true)}
|
|
||||||
>
|
|
||||||
{i18nText('room.inviteParticipant', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
{isTimeBeforeStart && room?.state === SessionState.COACH_APPROVED && !isCreator && activeType === RoomsType.UPCOMING && (!room?.clients || (room?.clients && room?.clients?.length < room.maxClients)) && checkUserApply() && (
|
|
||||||
<Button
|
|
||||||
className="card-detail__apply"
|
|
||||||
onClick={becomeClient}
|
|
||||||
>
|
|
||||||
{i18nText('room.joinParticipant', locale)}
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
{room && (
|
|
||||||
<UserListModal
|
|
||||||
locale={locale}
|
|
||||||
jwt={jwt}
|
|
||||||
isOpen={showModal}
|
|
||||||
handleCancel={() => setShowModal(false)}
|
|
||||||
submit={onAddUser}
|
|
||||||
afterCloseModal={() => setForSupervisor(false)}
|
|
||||||
room={room}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="card-detail">
|
|
||||||
<div>
|
|
||||||
<Button
|
|
||||||
className="card-detail__back"
|
|
||||||
type="link"
|
|
||||||
icon={<LeftOutlined/>}
|
|
||||||
onClick={() => setIsEdit(false)}
|
|
||||||
>
|
|
||||||
{i18nText('back', locale)}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<EditRoomForm
|
|
||||||
roomId={room?.id || 0}
|
|
||||||
locale={locale}
|
|
||||||
jwt={jwt}
|
|
||||||
mode="edit"
|
|
||||||
afterSubmit={afterEditing}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,173 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import React, { MouseEvent, useCallback, useEffect, useState } from 'react';
|
|
||||||
import { Empty, Space } from 'antd';
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import 'dayjs/locale/ru';
|
|
||||||
import 'dayjs/locale/en';
|
|
||||||
import 'dayjs/locale/de';
|
|
||||||
import 'dayjs/locale/it';
|
|
||||||
import 'dayjs/locale/fr';
|
|
||||||
import 'dayjs/locale/es';
|
|
||||||
import { RoomsType } from '../../../types/rooms';
|
|
||||||
import { getRecentRooms, getUpcomingRooms } from '../../../actions/rooms';
|
|
||||||
import { Loader } from '../../view/Loader';
|
|
||||||
import { useLocalStorage } from '../../../hooks/useLocalStorage';
|
|
||||||
import { AUTH_TOKEN_KEY } from '../../../constants/common';
|
|
||||||
import { usePathname, useRouter } from '../../../navigation';
|
|
||||||
import { i18nText } from '../../../i18nKeys';
|
|
||||||
import { CreateRoom } from './CreateRoom';
|
|
||||||
|
|
||||||
type RoomsTabsProps = {
|
|
||||||
locale: string;
|
|
||||||
activeTab: RoomsType;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const RoomsTabs = ({ locale, activeTab }: RoomsTabsProps) => {
|
|
||||||
const [sort, setSort] = useState<string>();
|
|
||||||
const [rooms, setRooms] = useState<any>();
|
|
||||||
const [loading, setLoading] = useState<boolean>(true);
|
|
||||||
const [errorData, setErrorData] = useState<any>();
|
|
||||||
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
|
||||||
const router = useRouter();
|
|
||||||
const pathname = usePathname();
|
|
||||||
|
|
||||||
const fetchData = () => {
|
|
||||||
setErrorData(undefined);
|
|
||||||
setLoading(true);
|
|
||||||
Promise.all([
|
|
||||||
getUpcomingRooms(locale, jwt),
|
|
||||||
getRecentRooms(locale, jwt)
|
|
||||||
])
|
|
||||||
.then(([upcoming, recent]) => {
|
|
||||||
setRooms({
|
|
||||||
[RoomsType.UPCOMING]: upcoming || [],
|
|
||||||
[RoomsType.RECENT]: recent || []
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
setErrorData(err);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setLoading(false);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
fetchData();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const onChangeSort = useCallback((value: string) => {
|
|
||||||
setSort(value);
|
|
||||||
}, [sort]);
|
|
||||||
|
|
||||||
const onClickSession = (event: MouseEvent<HTMLDivElement>, id: number) => {
|
|
||||||
event.stopPropagation();
|
|
||||||
event.preventDefault();
|
|
||||||
router.push(`${pathname}/${id}`);
|
|
||||||
};
|
|
||||||
|
|
||||||
const getChildren = (list?: any[]) => (
|
|
||||||
<>
|
|
||||||
{/* <div className="filter-session">
|
|
||||||
<div className="filter-session__item">
|
|
||||||
<CustomSelect
|
|
||||||
label="Topic"
|
|
||||||
value={sort}
|
|
||||||
onChange={onChangeSort}
|
|
||||||
options={[
|
|
||||||
{ value: 'topic1', label: 'Topic 1' },
|
|
||||||
{ value: 'topic2', label: 'Topic 2' },
|
|
||||||
{ value: 'topic3', label: 'Topic 3' },
|
|
||||||
{ value: 'topic4', label: 'Topic 4' }
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
<div className="list-session">
|
|
||||||
{list && list?.length > 0 ? list?.map(({ id, scheduledStartAtUtc, scheduledEndAtUtc, title, coach, clients, supervisor, maxClients }) => {
|
|
||||||
const startDate = dayjs(scheduledStartAtUtc).locale(locale);
|
|
||||||
const endDate = dayjs(scheduledEndAtUtc).locale(locale);
|
|
||||||
const today = dayjs().format('YYYY-MM-DD') === startDate.format('YYYY-MM-DD');
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div key={id} className="card-profile session__item" onClick={(e: MouseEvent<HTMLDivElement>) => onClickSession(e, id)}>
|
|
||||||
<div className="card-profile__header">
|
|
||||||
<div className="card-profile__header__portrait">
|
|
||||||
<img src={coach?.faceImageUrl || '/images/person.png'} className="" alt="" />
|
|
||||||
</div>
|
|
||||||
<div className="card-profile__header__inner">
|
|
||||||
<div>
|
|
||||||
<div className="card-profile__header__name">{`${coach?.name} ${coach?.surname || ''}`}</div>
|
|
||||||
<div className="card-profile__header__title">{title}</div>
|
|
||||||
<div className={`card-profile__header__date${activeTab === RoomsType.RECENT ? ' history' : (today ? ' chosen' : '')}`}>
|
|
||||||
{today
|
|
||||||
? `${i18nText('today', locale)} ${startDate.format('HH:mm')} - ${endDate.format('HH:mm')}`
|
|
||||||
: `${startDate.format('D MMMM')} ${startDate.format('HH:mm')} - ${endDate.format('HH:mm')}`}
|
|
||||||
</div>
|
|
||||||
<div className="card-room__details">
|
|
||||||
{supervisor && (
|
|
||||||
<>
|
|
||||||
<div>{i18nText('room.supervisor', locale)}</div>
|
|
||||||
<div>{`${supervisor?.name} ${supervisor?.surname || ''}`}</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<div>{i18nText('room.members', locale)}</div>
|
|
||||||
<div>{`${clients.length}/${maxClients}`}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}) : (
|
|
||||||
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={i18nText('noData', locale)} />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
|
|
||||||
const tabs = [
|
|
||||||
{
|
|
||||||
key: RoomsType.UPCOMING,
|
|
||||||
label: (
|
|
||||||
<>
|
|
||||||
{i18nText('room.upcoming', locale)}
|
|
||||||
{rooms?.upcoming && rooms?.upcoming?.length > 0 ? (<span className="count">{rooms?.upcoming.length}</span>) : null}
|
|
||||||
</>
|
|
||||||
),
|
|
||||||
children: getChildren(rooms?.upcoming)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: RoomsType.RECENT,
|
|
||||||
label: i18nText('room.recent', locale),
|
|
||||||
children: getChildren(rooms?.recent)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: RoomsType.NEW,
|
|
||||||
label: i18nText('room.newRoom', locale),
|
|
||||||
children: <CreateRoom locale={locale} jwt={jwt} />
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Loader
|
|
||||||
isLoading={loading}
|
|
||||||
errorData={errorData}
|
|
||||||
refresh={fetchData}
|
|
||||||
>
|
|
||||||
<div className="tabs-session">
|
|
||||||
{tabs.map(({ key, label }) => (
|
|
||||||
<Space
|
|
||||||
key={key}
|
|
||||||
className={`tabs-session__item ${key === activeTab ? 'active' : ''}`}
|
|
||||||
onClick={() => router.push(`/account/rooms/${key}`)}
|
|
||||||
>
|
|
||||||
{label}
|
|
||||||
</Space>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
{tabs.filter(({ key }) => key === activeTab)[0].children}
|
|
||||||
</Loader>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,6 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
export * from './RoomDetails';
|
|
||||||
export * from './RoomsTabs';
|
|
||||||
export * from './RoomDetailsContent';
|
|
||||||
export * from './CreateRoom';
|
|
|
@ -81,7 +81,7 @@ export const SessionDetailsContent = ({ session, locale, activeType, startSessio
|
||||||
const CoachCard = (coach?: PublicUser) => coach ? (
|
const CoachCard = (coach?: PublicUser) => coach ? (
|
||||||
<div className="card-detail__expert">
|
<div className="card-detail__expert">
|
||||||
<div className="card-detail__portrait">
|
<div className="card-detail__portrait">
|
||||||
<Image src={coach?.faceImageUrl || '/images/user-avatar.png'} width={140} height={140} alt="" />
|
<Image src={coach?.faceImageUrl || '/images/person.png'} width={140} height={140} alt="" />
|
||||||
</div>
|
</div>
|
||||||
<div className="card-detail__inner">
|
<div className="card-detail__inner">
|
||||||
<Link href={`/experts/${coach?.id}` as any} target="_blank">
|
<Link href={`/experts/${coach?.id}` as any} target="_blank">
|
||||||
|
@ -106,7 +106,7 @@ export const SessionDetailsContent = ({ session, locale, activeType, startSessio
|
||||||
<div className="card-detail__skills">
|
<div className="card-detail__skills">
|
||||||
<div className="skills__list">
|
<div className="skills__list">
|
||||||
{session?.themesTags?.slice(0, 2).map((skill) => <Tag key={skill?.id} className="skills__list__item">{skill?.name}</Tag>)}
|
{session?.themesTags?.slice(0, 2).map((skill) => <Tag key={skill?.id} className="skills__list__item">{skill?.name}</Tag>)}
|
||||||
{session?.themesTags && session?.themesTags?.length > 2
|
{session?.themesTags?.length > 2
|
||||||
? (
|
? (
|
||||||
<Tag className="skills__list__more">
|
<Tag className="skills__list__more">
|
||||||
<Link href={`/experts/${coach?.id}` as any} target="_blank">
|
<Link href={`/experts/${coach?.id}` as any} target="_blank">
|
||||||
|
@ -128,7 +128,7 @@ export const SessionDetailsContent = ({ session, locale, activeType, startSessio
|
||||||
const StudentCard = (student?: PublicUser | null) => student ? (
|
const StudentCard = (student?: PublicUser | null) => student ? (
|
||||||
<div className="card-detail__expert">
|
<div className="card-detail__expert">
|
||||||
<div className="card-detail__portrait">
|
<div className="card-detail__portrait">
|
||||||
<Image src={student?.faceImageUrl || '/images/user-avatar.png'} width={140} height={140} alt="" />
|
<Image src={student?.faceImageUrl || '/images/person.png'} width={140} height={140} alt="" />
|
||||||
</div>
|
</div>
|
||||||
<div className="card-detail__inner">
|
<div className="card-detail__inner">
|
||||||
<div className="card-detail__name">{`${student?.name} ${student?.surname || ''}`}</div>
|
<div className="card-detail__name">{`${student?.name} ${student?.surname || ''}`}</div>
|
||||||
|
|
|
@ -14,7 +14,7 @@ import { useLocalStorage } from '../../../hooks/useLocalStorage';
|
||||||
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../../constants/common';
|
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../../constants/common';
|
||||||
import { getRecentSessions, getRequestedSessions, getUpcomingSessions } from '../../../actions/sessions';
|
import { getRecentSessions, getRequestedSessions, getUpcomingSessions } from '../../../actions/sessions';
|
||||||
import { Session, Sessions, SessionType } from '../../../types/sessions';
|
import { Session, Sessions, SessionType } from '../../../types/sessions';
|
||||||
import { useRouter, usePathname } from '../../../navigation';
|
import { useRouter } from '../../../navigation';
|
||||||
import { i18nText } from '../../../i18nKeys';
|
import { i18nText } from '../../../i18nKeys';
|
||||||
|
|
||||||
type SessionsTabsProps = {
|
type SessionsTabsProps = {
|
||||||
|
@ -31,7 +31,6 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
|
||||||
const [userData] = useLocalStorage(AUTH_USER, '');
|
const [userData] = useLocalStorage(AUTH_USER, '');
|
||||||
const { id: userId = 0 } = userData ? JSON.parse(userData) : {};
|
const { id: userId = 0 } = userData ? JSON.parse(userData) : {};
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const pathname = usePathname();
|
|
||||||
|
|
||||||
const fetchData = () => {
|
const fetchData = () => {
|
||||||
setErrorData(undefined);
|
setErrorData(undefined);
|
||||||
|
@ -67,7 +66,7 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
|
||||||
const onClickSession = (event: MouseEvent<HTMLDivElement>, id: number) => {
|
const onClickSession = (event: MouseEvent<HTMLDivElement>, id: number) => {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
router.push(`${pathname}/${id}`);
|
router.push(`${id}`);
|
||||||
};
|
};
|
||||||
|
|
||||||
const getChildren = (list?: Session[]) => (
|
const getChildren = (list?: Session[]) => (
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { Alert, message } from 'antd';
|
import {Alert, message} from 'antd';
|
||||||
import Image from 'next/image';
|
import Image from 'next/image';
|
||||||
import { i18nText } from '../../i18nKeys';
|
import { i18nText } from '../../i18nKeys';
|
||||||
import { ExpertData, PayInfo, ProfileData } from '../../types/profile';
|
import { ExpertData, PayInfo, ProfileData } from '../../types/profile';
|
||||||
|
@ -145,13 +145,7 @@ export const ExpertProfile = ({ locale, data, updateData, isFull }: ExpertProfil
|
||||||
updateExpert={updateExpert}
|
updateExpert={updateExpert}
|
||||||
/>
|
/>
|
||||||
</Loader>
|
</Loader>
|
||||||
<Loader isLoading={loading.includes('schedule')}>
|
<ExpertSchedule locale={locale} data={data?.schedule} />
|
||||||
<ExpertSchedule
|
|
||||||
locale={locale}
|
|
||||||
data={data?.schedule}
|
|
||||||
updateExpert={updateExpert}
|
|
||||||
/>
|
|
||||||
</Loader>
|
|
||||||
<Loader isLoading={loading.includes('education')}>
|
<Loader isLoading={loading.includes('education')}>
|
||||||
<ExpertEducation
|
<ExpertEducation
|
||||||
locale={locale}
|
locale={locale}
|
||||||
|
|
|
@ -1,14 +1,14 @@
|
||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import { useState } from 'react';
|
import {useState} from "react";
|
||||||
import { Tag } from 'antd';
|
import {Tag} from "antd";
|
||||||
import { EditOutlined } from '@ant-design/icons';
|
import {EditOutlined} from "@ant-design/icons";
|
||||||
import { ExpertData, ProfileData } from '../../../types/profile';
|
import {LinkButton} from "../../view/LinkButton";
|
||||||
import { i18nText } from '../../../i18nKeys';
|
import {ExpertData, ProfileData} from "../../../types/profile";
|
||||||
import { PracticeDTO } from '../../../types/practice';
|
import {i18nText} from "../../../i18nKeys/index";
|
||||||
import { LinkButton } from '../../view/LinkButton';
|
import {PracticeDTO} from "../../../types/practice";
|
||||||
import { ExpertPractice } from '../../Experts/ExpertDetails';
|
import {ExpertPractice} from "../../Experts/ExpertDetails";
|
||||||
import { EditExpertAboutModal } from '../../Modals/EditExpertAboutModal';
|
import {EditExpertAboutModal} from "../../Modals/EditExpertAboutModal";
|
||||||
|
|
||||||
type ExpertAboutProps = {
|
type ExpertAboutProps = {
|
||||||
locale: string;
|
locale: string;
|
||||||
|
|
|
@ -1,56 +1,48 @@
|
||||||
import { useState } from 'react';
|
|
||||||
import { Tag } from 'antd';
|
|
||||||
import { EditOutlined } from '@ant-design/icons';
|
import { EditOutlined } from '@ant-design/icons';
|
||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import { ScheduleDTO } from '../../../types/schedule';
|
import { ScheduleDTO } from '../../../types/schedule';
|
||||||
import { i18nText } from '../../../i18nKeys';
|
import { i18nText } from '../../../i18nKeys';
|
||||||
import { getCurrentTime, getTimeString } from '../../../utils/time';
|
|
||||||
import { ExpertData } from '../../../types/profile';
|
|
||||||
import { LinkButton } from '../../view/LinkButton';
|
import { LinkButton } from '../../view/LinkButton';
|
||||||
import { EditExpertScheduleModal } from '../../Modals/EditExpertScheduleModal';
|
import {useState} from "react";
|
||||||
|
import {Tag} from "antd";
|
||||||
|
import {getCurrentTime} from "../../../utils/time";
|
||||||
|
|
||||||
type ExpertScheduleProps = {
|
type ExpertScheduleProps = {
|
||||||
locale: string;
|
locale: string;
|
||||||
data?: ScheduleDTO;
|
data?: ScheduleDTO;
|
||||||
updateExpert: (key: keyof ExpertData) => void;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export const ExpertSchedule = ({ locale, data, updateExpert }: ExpertScheduleProps) => {
|
export const ExpertSchedule = ({ locale, data }: ExpertScheduleProps) => {
|
||||||
const [showEdit, setShowEdit] = useState<boolean>(false);
|
const [showEdit, setShowEdit] = useState<boolean>(false);
|
||||||
|
// person51
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="coaching-section__wrap">
|
<div className="coaching-section__wrap">
|
||||||
<div className="coaching-section">
|
<div className="coaching-section">
|
||||||
<div className="coaching-section__title">
|
<div className="coaching-section__title">
|
||||||
<h2 className="title-h2">{i18nText('schedule', locale)}</h2>
|
<h2 className="title-h2">{i18nText('schedule', locale)}</h2>
|
||||||
<LinkButton
|
{/*<LinkButton
|
||||||
type="link"
|
type="link"
|
||||||
icon={<EditOutlined />}
|
icon={<EditOutlined />}
|
||||||
onClick={() => setShowEdit(true)}
|
onClick={() => setShowEdit(true)}
|
||||||
/>
|
/>*/}
|
||||||
</div>
|
</div>
|
||||||
<div className="b-schedule-list">
|
<div className="b-schedule-list">
|
||||||
{data && data?.workingTimes?.map((date, index) => {
|
{data && data?.workingTimes?.map((date, index) => {
|
||||||
const { startDay, startTimeMin, endTimeMin } = getCurrentTime(date, dayjs().format('Z'));
|
const { startDay, startTime, endDay, endTime } = getCurrentTime(date);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={`date_${index}`}>
|
<div key={`date_${index}`}>
|
||||||
<Tag className="skills__list__item">{i18nText(startDay, locale)}</Tag>
|
<Tag className="skills__list__item">{i18nText(startDay, locale)}</Tag>
|
||||||
<div>{startTimeMin ? getTimeString(startTimeMin) : '00:00'}</div>
|
<div>{startTime}</div>
|
||||||
<span>-</span>
|
<span>-</span>
|
||||||
<div>{endTimeMin ? getTimeString(endTimeMin) : '00:00'}</div>
|
{startDay !== endDay && <Tag className="skills__list__item">{i18nText(endDay, locale)}</Tag>}
|
||||||
|
<div>{endTime}</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<EditExpertScheduleModal
|
|
||||||
open={showEdit}
|
|
||||||
handleCancel={() => setShowEdit(false)}
|
|
||||||
locale={locale}
|
|
||||||
data={data}
|
|
||||||
refresh={() => updateExpert('schedule')}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -55,6 +55,8 @@ export const ExpertsAdditionalFilter = ({
|
||||||
};
|
};
|
||||||
const search = getSearchParamsString(newFilter);
|
const search = getSearchParamsString(newFilter);
|
||||||
|
|
||||||
|
console.log('here1');
|
||||||
|
|
||||||
router.push(search ? `${basePath}?${search}#filter` : `${basePath}#filter`);
|
router.push(search ? `${basePath}?${search}#filter` : `${basePath}#filter`);
|
||||||
|
|
||||||
// router.push({
|
// router.push({
|
||||||
|
|
|
@ -1,25 +1,19 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import React, { FC, useState, useEffect } from 'react';
|
import React, { FC } from 'react';
|
||||||
import Image from 'next/image';
|
import Image from 'next/image';
|
||||||
import { Tag, Image as AntdImage, Space, Button } from 'antd';
|
import { Tag, Image as AntdImage, Space } from 'antd';
|
||||||
import { ZoomInOutlined, ZoomOutOutlined, StarFilled } from '@ant-design/icons';
|
import { ZoomInOutlined, ZoomOutOutlined, StarFilled } from '@ant-design/icons';
|
||||||
import { SignupSessionData } from '../../types/experts';
|
|
||||||
import { ExpertDetails, Practice, ThemeGroup } from '../../types/experts';
|
import { ExpertDetails, Practice, ThemeGroup } from '../../types/experts';
|
||||||
import { ExpertDocument } from '../../types/file';
|
import { ExpertDocument } from '../../types/file';
|
||||||
import { Locale } from '../../types/locale';
|
import { Locale } from '../../types/locale';
|
||||||
import { CustomRate } from '../view/CustomRate';
|
import { CustomRate } from '../view/CustomRate';
|
||||||
import { i18nText } from '../../i18nKeys';
|
import { i18nText } from '../../i18nKeys';
|
||||||
import { FilledYellowButton } from '../view/FilledButton';
|
import { FilledYellowButton } from '../view/FilledButton';
|
||||||
import { getStorageValue } from '../../hooks/useLocalStorage';
|
|
||||||
import { AUTH_TOKEN_KEY, SESSION_DATA } from '../../constants/common';
|
|
||||||
import { ScheduleModal } from '../Modals/ScheduleModal';
|
|
||||||
import { ScheduleModalResult } from '../Modals/ScheduleModalResult';
|
|
||||||
|
|
||||||
type ExpertDetailsProps = {
|
type ExpertDetailsProps = {
|
||||||
expert: ExpertDetails;
|
expert: ExpertDetails;
|
||||||
locale?: string;
|
locale?: string;
|
||||||
expertId?: string;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
type ExpertPracticeProps = {
|
type ExpertPracticeProps = {
|
||||||
|
@ -28,77 +22,50 @@ type ExpertPracticeProps = {
|
||||||
locale?: string;
|
locale?: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const ExpertCard: FC<ExpertDetailsProps> = ({ expert, locale, expertId }) => {
|
export const ExpertCard: FC<ExpertDetailsProps> = ({ expert, locale }) => {
|
||||||
const { publicCoachDetails } = expert || {};
|
const { publicCoachDetails } = expert || {};
|
||||||
const [showSchedulerModal, setShowSchedulerModal] = useState<boolean>(false);
|
|
||||||
const [mode, setMode] = useState<'data' | 'time' | 'pay' | 'finish'>('data');
|
return (
|
||||||
|
<div className="expert-card">
|
||||||
|
<div className="expert-card__wrap">
|
||||||
|
<div className="expert-card__avatar">
|
||||||
|
<Image src={publicCoachDetails?.faceImageUrl || '/images/person.png'} width={216} height={216} alt="" />
|
||||||
|
</div>
|
||||||
|
<div className="expert-card__inner">
|
||||||
|
<h1 className="expert-card__title">{`${publicCoachDetails?.name} ${publicCoachDetails?.surname || ''}`}</h1>
|
||||||
|
<div className="expert-card__info">
|
||||||
|
<span>{`${publicCoachDetails?.practiceHours} ${i18nText('practiceHours', locale)}`}</span>
|
||||||
|
<i>|</i>
|
||||||
|
<span>{`${publicCoachDetails?.supervisionPerYearId} ${i18nText('supervisionCount', locale)}`}</span>
|
||||||
|
</div>
|
||||||
|
<div className="expert-card__rating">
|
||||||
|
<CustomRate defaultValue={4} character={<StarFilled style={{ fontSize: 32 }} />} disabled />
|
||||||
|
<span>{`4/5 (${i18nText('outOf', locale)} 345)`}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="expert-card__wrap-btn">
|
||||||
|
<a href="#" className="btn-apply">
|
||||||
|
<img src="/images/calendar-outline.svg" className="" alt="" />
|
||||||
|
{i18nText('schedule', locale)}
|
||||||
|
</a>
|
||||||
|
{/*
|
||||||
|
<a href="#" className="btn-video">
|
||||||
|
<img src="/images/videocam-outline.svg" className="" alt=""/>
|
||||||
|
Video
|
||||||
|
</a>
|
||||||
|
*/}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const ExpertInformation: FC<ExpertDetailsProps> = ({ expert, locale }) => {
|
||||||
const { publicCoachDetails: { tags = [], sessionCost = 0, sessionDuration = 0, coachLanguages = [] } } = expert || {};
|
const { publicCoachDetails: { tags = [], sessionCost = 0, sessionDuration = 0, coachLanguages = [] } } = expert || {};
|
||||||
const isRus = locale === Locale.ru;
|
const isRus = locale === Locale.ru;
|
||||||
|
|
||||||
const checkSession = (data?: SignupSessionData) => {
|
|
||||||
if (data?.startAtUtc && data?.tagId) {
|
|
||||||
const jwt = getStorageValue(AUTH_TOKEN_KEY, '');
|
|
||||||
sessionStorage?.setItem(SESSION_DATA, JSON.stringify(data));
|
|
||||||
if (jwt) {
|
|
||||||
setMode('pay');
|
|
||||||
} else {
|
|
||||||
setShowSchedulerModal(false);
|
|
||||||
const showAuth = new Event('show_auth_enter');
|
|
||||||
document.dispatchEvent(showAuth);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleShowPayForm = () => {
|
|
||||||
setShowSchedulerModal(true);
|
|
||||||
setMode('pay');
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
document.addEventListener('show_pay_form', handleShowPayForm);
|
|
||||||
return () => {
|
|
||||||
document.removeEventListener('show_pay_form', handleShowPayForm);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const onSchedulerHandle = () => {
|
|
||||||
setMode('data');
|
|
||||||
setShowSchedulerModal(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="expert-card">
|
|
||||||
<div className="expert-card__wrap">
|
|
||||||
<div className="expert-card__avatar">
|
|
||||||
<Image src={publicCoachDetails?.faceImageUrl || '/images/person.png'} width={216} height={216} alt="" />
|
|
||||||
</div>
|
|
||||||
<div className="expert-card__inner">
|
|
||||||
<h1 className="expert-card__title">{`${publicCoachDetails?.name} ${publicCoachDetails?.surname || ''}`}</h1>
|
|
||||||
<div className="expert-card__info">
|
|
||||||
<span>{`${publicCoachDetails?.practiceHours} ${i18nText('practiceHours', locale)}`}</span>
|
|
||||||
<i>|</i>
|
|
||||||
<span>{`${publicCoachDetails?.supervisionPerYearId} ${i18nText('supervisionCount', locale)}`}</span>
|
|
||||||
</div>
|
|
||||||
<div className="expert-card__rating">
|
|
||||||
<CustomRate defaultValue={4} character={<StarFilled style={{ fontSize: 32 }} />} disabled />
|
|
||||||
<span>{`4/5 (${i18nText('outOf', locale)} 345)`}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="expert-card__wrap-btn">
|
|
||||||
<Button className="btn-apply" onClick={onSchedulerHandle}>
|
|
||||||
<img src="/images/calendar-outline.svg" className="" alt="" />
|
|
||||||
{i18nText('schedule', locale)}
|
|
||||||
</Button>
|
|
||||||
{/*
|
|
||||||
<a href="#" className="btn-video">
|
|
||||||
<img src="/images/videocam-outline.svg" className="" alt=""/>
|
|
||||||
Video
|
|
||||||
</a>
|
|
||||||
*/}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="expert-info">
|
<div className="expert-info">
|
||||||
{/* <h2 className="title-h2">{}</h2> */}
|
{/* <h2 className="title-h2">{}</h2> */}
|
||||||
<div className="skills__list">
|
<div className="skills__list">
|
||||||
|
@ -124,22 +91,11 @@ export const ExpertCard: FC<ExpertDetailsProps> = ({ expert, locale, expertId })
|
||||||
{tags?.map((skill) => <Tag key={skill?.id} className="skills__list__item">{skill?.name}</Tag>)}
|
{tags?.map((skill) => <Tag key={skill?.id} className="skills__list__item">{skill?.name}</Tag>)}
|
||||||
</div>
|
</div>
|
||||||
<div className="wrap-btn-prise">
|
<div className="wrap-btn-prise">
|
||||||
<FilledYellowButton onClick={onSchedulerHandle}>{i18nText('signUp', locale)}</FilledYellowButton>
|
<FilledYellowButton onClick={() => console.log('schedule')}>{i18nText('signUp', locale)}</FilledYellowButton>
|
||||||
<div className="wrap-btn-prise__text">
|
<div className="wrap-btn-prise__text">
|
||||||
{`${sessionCost}€`} <span>/ {`${sessionDuration}${isRus ? 'мин' : 'min'}`}</span>
|
{`${sessionCost}€`} <span>/ {`${sessionDuration}${isRus ? 'мин' : 'min'}`}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<ScheduleModal
|
|
||||||
open={showSchedulerModal}
|
|
||||||
handleCancel={() => setShowSchedulerModal(false)}
|
|
||||||
updateMode={setMode}
|
|
||||||
mode={mode}
|
|
||||||
expertId={expertId as string}
|
|
||||||
locale={locale as string}
|
|
||||||
sessionCost={sessionCost}
|
|
||||||
checkSession={checkSession}
|
|
||||||
/>
|
|
||||||
<ScheduleModalResult locale={locale as string} />
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,20 +1,20 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import React, { FC, useState } from 'react';
|
import React, { FC, useEffect, useState } from 'react';
|
||||||
import { Modal, Button, message, Form, Collapse } from 'antd';
|
import {Modal, Button, message, Form, Collapse, GetProp, UploadProps} from 'antd';
|
||||||
import type { CollapseProps } from 'antd';
|
import type { CollapseProps } from 'antd';
|
||||||
import { CloseOutlined } from '@ant-design/icons';
|
import { CloseOutlined } from '@ant-design/icons';
|
||||||
import { i18nText } from '../../i18nKeys';
|
import { i18nText } from '../../i18nKeys';
|
||||||
import { PracticePersonData } from '../../types/practice';
|
import { PracticePersonData, PracticeDTO, PracticeData, PracticeCase } from '../../types/practice';
|
||||||
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
||||||
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
||||||
import { setEducation } from '../../actions/profile';
|
import {setEducation} from '../../actions/profile';
|
||||||
import { EducationData, EducationDTO } from '../../types/education';
|
import {Certificate, Details, EducationData, EducationDTO, Experience} from "../../types/education";
|
||||||
import { CertificatesContent } from './educationModalContent/Certificates';
|
import {CertificatesContent} from "./educationModalContent/Certificates";
|
||||||
import { EducationsContent } from './educationModalContent/Educations';
|
import {EducationsContent} from "./educationModalContent/Educations";
|
||||||
import { TrainingsContent } from './educationModalContent/Trainings';
|
import {TrainingsContent} from "./educationModalContent/Trainings";
|
||||||
import { MbasContent } from './educationModalContent/Mbas';
|
import {MbasContent} from "./educationModalContent/Mbas";
|
||||||
import { ExperiencesContent } from './educationModalContent/Experiences';
|
import {ExperiencesContent} from "./educationModalContent/Experiences";
|
||||||
|
|
||||||
type EditExpertEducationModalProps = {
|
type EditExpertEducationModalProps = {
|
||||||
open: boolean;
|
open: boolean;
|
||||||
|
|
|
@ -1,214 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import React, { FC, useEffect, useState } from 'react';
|
|
||||||
import { Modal, Button, message } from 'antd';
|
|
||||||
import { CloseOutlined, DeleteOutlined } from '@ant-design/icons';
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import { i18nText } from '../../i18nKeys';
|
|
||||||
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
|
||||||
import { UTC_LIST } from '../../constants/time';
|
|
||||||
import { MapWorkingTime, ScheduleDTO } from '../../types/schedule';
|
|
||||||
import {
|
|
||||||
WEEK_DAY,
|
|
||||||
formattedSchedule,
|
|
||||||
getNewTime,
|
|
||||||
getTimeZoneOffset,
|
|
||||||
getTimeString,
|
|
||||||
formattedTimeByOffset, formattedWorkList
|
|
||||||
} from '../../utils/time';
|
|
||||||
import { useLocalStorage } from '../../hooks/useLocalStorage';
|
|
||||||
import { setSchedule } from '../../actions/profile';
|
|
||||||
import { CustomSelect } from '../view/CustomSelect';
|
|
||||||
import { CustomTimePicker } from '../view/CustomTimePicker';
|
|
||||||
import { LinkButton } from '../view/LinkButton';
|
|
||||||
import { OutlinedButton } from '../view/OutlinedButton';
|
|
||||||
|
|
||||||
type EditExpertScheduleModalProps = {
|
|
||||||
open: boolean;
|
|
||||||
handleCancel: () => void;
|
|
||||||
locale: string;
|
|
||||||
data?: ScheduleDTO;
|
|
||||||
refresh: () => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
const DEFAULT_WORK: MapWorkingTime = { startDay: '' };
|
|
||||||
|
|
||||||
export const EditExpertScheduleModal: FC<EditExpertScheduleModalProps> = ({
|
|
||||||
open,
|
|
||||||
handleCancel,
|
|
||||||
locale,
|
|
||||||
data,
|
|
||||||
refresh,
|
|
||||||
}) => {
|
|
||||||
const defaultTimeZone = dayjs().format('Z');
|
|
||||||
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
|
||||||
const [timeZone, setTimeZone] = useState<string>(defaultTimeZone);
|
|
||||||
const [workList, setWorkList] = useState<MapWorkingTime[]>([DEFAULT_WORK]);
|
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (open && data?.workingTimes && data.workingTimes.length > 0) {
|
|
||||||
setWorkList(formattedSchedule(data.workingTimes, timeZone));
|
|
||||||
}
|
|
||||||
}, [open]);
|
|
||||||
|
|
||||||
const onSave = () => {
|
|
||||||
const workingTimes = formattedWorkList(workList, timeZone);
|
|
||||||
|
|
||||||
setLoading(true);
|
|
||||||
setSchedule(locale, jwt, { workingTimes })
|
|
||||||
.then(() => {
|
|
||||||
handleCancel();
|
|
||||||
refresh();
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
message.error('Не удалось сохранить расписание');
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setLoading(false);
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
const addWorkingHours = () => {
|
|
||||||
setWorkList([
|
|
||||||
...workList,
|
|
||||||
DEFAULT_WORK
|
|
||||||
]);
|
|
||||||
};
|
|
||||||
|
|
||||||
const deleteWorkingHours = (index: number) => {
|
|
||||||
setWorkList(workList.filter((work, i) => i !== index));
|
|
||||||
};
|
|
||||||
|
|
||||||
const onChangeWeekDay = (val: string, index: number) => {
|
|
||||||
setWorkList(workList.map((work, i) => {
|
|
||||||
if (i === index) {
|
|
||||||
return {
|
|
||||||
...work,
|
|
||||||
startDay: val
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return work;
|
|
||||||
}));
|
|
||||||
};
|
|
||||||
|
|
||||||
const onChangeTime = (time: string, index: number, start?: boolean) => {
|
|
||||||
setWorkList(workList.map((work, i) => {
|
|
||||||
if (i === index) {
|
|
||||||
const timeMin = getNewTime(time);
|
|
||||||
let res;
|
|
||||||
|
|
||||||
if (start) {
|
|
||||||
res = {
|
|
||||||
startTimeMin: timeMin
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
res = {
|
|
||||||
endTimeMin: timeMin
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
...work,
|
|
||||||
...res
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return work;
|
|
||||||
}));
|
|
||||||
};
|
|
||||||
|
|
||||||
const onChangeTimeZone = (newTimeZone: string) => {
|
|
||||||
const offset = getTimeZoneOffset(timeZone, newTimeZone);
|
|
||||||
setTimeZone(newTimeZone);
|
|
||||||
setWorkList(workList.map((work) => formattedTimeByOffset(work, offset)));
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
className="b-modal"
|
|
||||||
open={open}
|
|
||||||
title={undefined}
|
|
||||||
onOk={undefined}
|
|
||||||
onCancel={handleCancel}
|
|
||||||
footer={false}
|
|
||||||
width={498}
|
|
||||||
closeIcon={<CloseOutlined style={{ fontSize: 20, color: '#000' }}/>}
|
|
||||||
>
|
|
||||||
<div className="b-modal__expert__content">
|
|
||||||
<div className="b-modal__expert__title">{i18nText('schedule', locale)}</div>
|
|
||||||
<div className="b-modal__expert__inner" style={{ paddingRight: 12 }}>
|
|
||||||
<div style={{ paddingRight: 0, paddingBottom: 1 }}>
|
|
||||||
<div className="schedule">
|
|
||||||
<div className="schedule__inner">
|
|
||||||
<div className="timezone">
|
|
||||||
<div className="timezone__title">{`${i18nText('yourTimezone', locale)}: ${defaultTimeZone}`}</div>
|
|
||||||
<div className="timezone__utc">
|
|
||||||
<CustomSelect
|
|
||||||
label="UTC"
|
|
||||||
value={timeZone}
|
|
||||||
options={UTC_LIST.map((value) => ({ value, label: value }))}
|
|
||||||
onChange={(val) => onChangeTimeZone(val)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<h3 className="title-h3">{i18nText('workTime', locale)}</h3>
|
|
||||||
<div className="schedule__wrap">
|
|
||||||
{workList.length === 1 ? workList.map(({ startDay, startTimeMin, endTimeMin }, index) => (
|
|
||||||
<div key={`day_${index}`} className="schedule-item__single">
|
|
||||||
<CustomSelect />
|
|
||||||
<CustomSelect label={i18nText('startAt', locale)} />
|
|
||||||
<CustomSelect label={i18nText('finishAt', locale)} />
|
|
||||||
</div>
|
|
||||||
)) : null}
|
|
||||||
{workList.length > 1 ? workList.map(({ startDay, startTimeMin, endTimeMin }, index) => (
|
|
||||||
<div key={`day_${index}`} className="schedule-item">
|
|
||||||
<CustomSelect
|
|
||||||
label={i18nText('day', locale)}
|
|
||||||
value={startDay || undefined}
|
|
||||||
options={WEEK_DAY.map((value) => ({ value, label: i18nText(value, locale) }))}
|
|
||||||
onChange={(val) => onChangeWeekDay(val, index)}
|
|
||||||
/>
|
|
||||||
<CustomTimePicker
|
|
||||||
label={i18nText('startAt', locale)}
|
|
||||||
value={startTimeMin ? dayjs(getTimeString(startTimeMin), 'HH:mm') : dayjs('00:00', 'HH:mm')}
|
|
||||||
onChange={(time, timeString) => onChangeTime(timeString, index, true)}
|
|
||||||
/>
|
|
||||||
<CustomTimePicker
|
|
||||||
label={i18nText('finishAt', locale)}
|
|
||||||
value={endTimeMin ? dayjs(getTimeString(endTimeMin), 'HH:mm') : dayjs('00:00', 'HH:mm')}
|
|
||||||
onChange={(time, timeString) => onChangeTime(timeString, index)}
|
|
||||||
/>
|
|
||||||
<LinkButton
|
|
||||||
type="link"
|
|
||||||
danger
|
|
||||||
icon={<DeleteOutlined />}
|
|
||||||
onClick={() => deleteWorkingHours(index)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)) : null}
|
|
||||||
</div>
|
|
||||||
<OutlinedButton
|
|
||||||
type="link"
|
|
||||||
onClick={addWorkingHours}
|
|
||||||
>
|
|
||||||
{i18nText('addWorkingHours', locale)}
|
|
||||||
</OutlinedButton>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="b-modal__expert__button">
|
|
||||||
<Button
|
|
||||||
className="card-detail__apply"
|
|
||||||
onClick={onSave}
|
|
||||||
loading={loading}
|
|
||||||
>
|
|
||||||
{i18nText('save', locale)}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,286 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import React, {FC, useEffect, useState} from 'react';
|
|
||||||
import classNames from 'classnames';
|
|
||||||
import { Modal, Menu, Calendar, Radio, Button, Input, message, Form } from 'antd';
|
|
||||||
import type { CalendarProps, MenuProps } from 'antd';
|
|
||||||
import { ArrowLeftOutlined } from '@ant-design/icons';
|
|
||||||
import { CloseOutlined } from '@ant-design/icons';
|
|
||||||
import dayjs, { Dayjs } from 'dayjs';
|
|
||||||
import 'dayjs/locale/ru';
|
|
||||||
import 'dayjs/locale/en';
|
|
||||||
import 'dayjs/locale/de';
|
|
||||||
import 'dayjs/locale/it';
|
|
||||||
import 'dayjs/locale/fr';
|
|
||||||
import 'dayjs/locale/es';
|
|
||||||
import { getLocale } from '../../utils/locale';
|
|
||||||
import { AUTH_TOKEN_KEY, SESSION_DATA } from '../../constants/common';
|
|
||||||
import { ExpertScheduler, SignupSessionData } from '../../types/experts';
|
|
||||||
import { Tag } from '../../types/tags';
|
|
||||||
import { getSchedulerByExpertId, getSchedulerSession } from '../../actions/experts';
|
|
||||||
import { StripeElementsForm } from '../stripe/StripeElementsForm';
|
|
||||||
import { i18nText } from '../../i18nKeys';
|
|
||||||
import { CustomSelect } from '../../components/view/CustomSelect';
|
|
||||||
import { Loader } from '../view/Loader';
|
|
||||||
import { getStorageValue } from '../../hooks/useLocalStorage';
|
|
||||||
|
|
||||||
type ScheduleModalProps = {
|
|
||||||
open: boolean;
|
|
||||||
handleCancel: () => void;
|
|
||||||
mode: 'data' | 'time' | 'pay' | 'finish';
|
|
||||||
updateMode: (mode: 'data' | 'time' | 'pay' | 'finish') => void;
|
|
||||||
sessionCost: number;
|
|
||||||
expertId: string;
|
|
||||||
locale: string;
|
|
||||||
checkSession: (data?: SignupSessionData) => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
type MenuItem = Required<MenuProps>['items'][number];
|
|
||||||
|
|
||||||
const getCalendarMenu = (start: Dayjs): MenuItem[] => Array.from({ length: 3 })
|
|
||||||
.map((_: unknown, index: number) => {
|
|
||||||
const date = index ? start.add(index, 'M') : start.clone();
|
|
||||||
return {
|
|
||||||
label: <span className="b-calendar-month">{date.format('MMMM')}</span>,
|
|
||||||
key: date.format('YYYY-MM-DD')
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export const ScheduleModal: FC<ScheduleModalProps> = ({
|
|
||||||
open,
|
|
||||||
handleCancel,
|
|
||||||
mode,
|
|
||||||
updateMode,
|
|
||||||
sessionCost,
|
|
||||||
locale,
|
|
||||||
expertId,
|
|
||||||
checkSession,
|
|
||||||
}) => {
|
|
||||||
const [selectDate, setSelectDate] = useState<Dayjs>(dayjs());
|
|
||||||
const [dates, setDates] = useState<Record<string, { startTime: string, endTime: string }[]> | undefined>();
|
|
||||||
const [tags, setTags] = useState<Tag[] | undefined>();
|
|
||||||
const [rawScheduler, setRawScheduler] = useState<ExpertScheduler | null>(null);
|
|
||||||
const [isPayLoading, setIsPayLoading] = useState<boolean>(false);
|
|
||||||
const [sessionId, setSessionId] = useState<string>('');
|
|
||||||
const [form] = Form.useForm<{ clientComment?: string, startAtUtc?: string, tagId?: number }>();
|
|
||||||
|
|
||||||
dayjs.locale(locale);
|
|
||||||
|
|
||||||
const signupSession = () => {
|
|
||||||
const data = sessionStorage?.getItem(SESSION_DATA);
|
|
||||||
const jwt = getStorageValue(AUTH_TOKEN_KEY, '');
|
|
||||||
|
|
||||||
if (jwt && data) {
|
|
||||||
const parseData = JSON.parse(data);
|
|
||||||
setIsPayLoading(true);
|
|
||||||
getSchedulerSession(parseData as SignupSessionData, locale || 'en', jwt)
|
|
||||||
.then((session) => {
|
|
||||||
setSessionId(session?.sessionId);
|
|
||||||
console.log(session?.sessionId);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
message.error('Не удалось провести оплату')
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
sessionStorage?.removeItem(SESSION_DATA);
|
|
||||||
setIsPayLoading(false);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(()=> {
|
|
||||||
if (open && mode !== 'pay') {
|
|
||||||
getSchedulerByExpertId(expertId as string, locale as string)
|
|
||||||
.then((data) => {
|
|
||||||
setRawScheduler(data);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!open) {
|
|
||||||
form.resetFields();
|
|
||||||
}
|
|
||||||
}, [open]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (open && mode === 'pay') {
|
|
||||||
signupSession();
|
|
||||||
}
|
|
||||||
}, [mode]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const map = {} as any
|
|
||||||
rawScheduler?.availableSlots.forEach((el) => {
|
|
||||||
const key = dayjs(el.startTime).format('YYYY-MM-DD');
|
|
||||||
if (!map[key]){
|
|
||||||
map[key] = []
|
|
||||||
}
|
|
||||||
map[key].push(el);
|
|
||||||
})
|
|
||||||
setDates(map);
|
|
||||||
setTags(rawScheduler?.tags)
|
|
||||||
}, [rawScheduler]);
|
|
||||||
|
|
||||||
const onPanelChange = (value: Dayjs) => setSelectDate(value);
|
|
||||||
|
|
||||||
const onDateChange: CalendarProps<Dayjs>['onSelect'] = (value, selectInfo) => {
|
|
||||||
if (selectInfo.source === 'date') {
|
|
||||||
setSelectDate(value);
|
|
||||||
updateMode('time');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const disabledDate = (currentDate: Dayjs) => !dates || !dates[currentDate.format('YYYY-MM-DD')];
|
|
||||||
|
|
||||||
const cellRender: CalendarProps<Dayjs>['fullCellRender'] = (date, info) => {
|
|
||||||
const isWeekend = date.day() === 6 || date.day() === 0;
|
|
||||||
return React.cloneElement(info.originNode, {
|
|
||||||
...info.originNode.props,
|
|
||||||
className: classNames('b-calendar-cell', {
|
|
||||||
['b-calendar-cell__select']: selectDate.isSame(date, 'date'),
|
|
||||||
['b-calendar-cell__today']: date.isSame(dayjs(), 'date'),
|
|
||||||
['b-calendar-cell__weekend']: isWeekend,
|
|
||||||
}),
|
|
||||||
children: (
|
|
||||||
<div>
|
|
||||||
<span>
|
|
||||||
{date.get('date')}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
),
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const onValidate = () => {
|
|
||||||
form.validateFields()
|
|
||||||
.then((values) => {
|
|
||||||
checkSession({ coachId: +expertId, ...values });
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
className="b-modal"
|
|
||||||
open={open}
|
|
||||||
title={undefined}
|
|
||||||
onOk={undefined}
|
|
||||||
onCancel={handleCancel}
|
|
||||||
footer={false}
|
|
||||||
width={498}
|
|
||||||
closeIcon={<CloseOutlined style={{ fontSize: 20, color: '#000' }}/>}
|
|
||||||
>
|
|
||||||
{mode === 'data' && (
|
|
||||||
<Calendar
|
|
||||||
className="b-calendar"
|
|
||||||
fullscreen={false}
|
|
||||||
onPanelChange={onPanelChange}
|
|
||||||
fullCellRender={cellRender}
|
|
||||||
onSelect={onDateChange}
|
|
||||||
value={selectDate}
|
|
||||||
disabledDate={disabledDate}
|
|
||||||
locale={getLocale(locale)}
|
|
||||||
validRange={[selectDate.startOf('M'), selectDate.endOf('M')]}
|
|
||||||
headerRender={({ onChange }) => {
|
|
||||||
const start = dayjs().startOf('M');
|
|
||||||
const [activeMonth, setActiveMonth] = useState<string>(start.format('YYYY-MM-DD'));
|
|
||||||
|
|
||||||
const onClick: MenuProps['onClick'] = (e) => {
|
|
||||||
setActiveMonth(e.key);
|
|
||||||
onChange(dayjs(e.key));
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Menu
|
|
||||||
className="b-calendar-header"
|
|
||||||
onClick={onClick}
|
|
||||||
selectedKeys={[activeMonth]}
|
|
||||||
mode="horizontal"
|
|
||||||
items={getCalendarMenu(start)}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{mode === 'time' && (
|
|
||||||
<div className="b-schedule-time">
|
|
||||||
<div className="b-schedule-time-header">
|
|
||||||
<Button
|
|
||||||
className="b-button-link-big"
|
|
||||||
type="link"
|
|
||||||
onClick={() => updateMode('data')}
|
|
||||||
icon={<ArrowLeftOutlined />}
|
|
||||||
iconPosition="start"
|
|
||||||
>
|
|
||||||
{selectDate.locale(locale).format('DD MMMM YYYY')}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<Form form={form}>
|
|
||||||
<div className="b-schedule-select-tag">
|
|
||||||
{tags && (
|
|
||||||
<Form.Item
|
|
||||||
name="tagId"
|
|
||||||
rules={[{
|
|
||||||
required: true,
|
|
||||||
message: ''
|
|
||||||
}]}
|
|
||||||
>
|
|
||||||
<CustomSelect
|
|
||||||
label={i18nText('selectTopic', locale)}
|
|
||||||
options={tags?.map(({id, name}) => ({value: id, label: name}))}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="b-schedule-radio-list">
|
|
||||||
<Form.Item
|
|
||||||
name="startAtUtc"
|
|
||||||
rules={[{
|
|
||||||
required: true,
|
|
||||||
message: ''
|
|
||||||
}]}
|
|
||||||
>
|
|
||||||
<Radio.Group>
|
|
||||||
{dates && dates[selectDate.format('YYYY-MM-DD')].map((el: any) => (
|
|
||||||
<Radio
|
|
||||||
key={el.startTime}
|
|
||||||
value={el.startTime}
|
|
||||||
>
|
|
||||||
{dayjs(el.startTime).format('HH:mm')} - {dayjs(el.endTime).format('HH:mm')}
|
|
||||||
</Radio>)
|
|
||||||
)}
|
|
||||||
</Radio.Group>
|
|
||||||
</Form.Item>
|
|
||||||
</div>
|
|
||||||
<Form.Item name="clientComment">
|
|
||||||
<Input.TextArea
|
|
||||||
className="b-textarea"
|
|
||||||
rows={2}
|
|
||||||
placeholder={i18nText('sessionWishes', locale)}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
</Form>
|
|
||||||
<Button
|
|
||||||
className="btn-apply"
|
|
||||||
onClick={onValidate}
|
|
||||||
>
|
|
||||||
{i18nText('pay', locale)}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{mode === 'pay' && (
|
|
||||||
<div className="b-schedule-payment">
|
|
||||||
<Loader isLoading={isPayLoading}>
|
|
||||||
<StripeElementsForm
|
|
||||||
amount={sessionCost}
|
|
||||||
locale={locale}
|
|
||||||
sessionId={sessionId}
|
|
||||||
/>
|
|
||||||
</Loader>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,73 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useEffect, useState } from 'react';
|
|
||||||
import { Modal, Result } from 'antd';
|
|
||||||
import { CloseOutlined } from '@ant-design/icons';
|
|
||||||
import { useSearchParams, useRouter } from 'next/navigation';
|
|
||||||
import { Stripe } from 'stripe';
|
|
||||||
import { getStripePaymentStatus } from '../../actions/stripe';
|
|
||||||
import { sessionPaymentConfirm } from '../../actions/sessions';
|
|
||||||
import { getStorageValue } from '../../hooks/useLocalStorage';
|
|
||||||
import { AUTH_TOKEN_KEY } from '../../constants/common';
|
|
||||||
import { Session, SessionState } from '../../types/sessions';
|
|
||||||
import { i18nText } from '../../i18nKeys';
|
|
||||||
|
|
||||||
export const ScheduleModalResult = ({ locale }: { locale: string }) => {
|
|
||||||
const searchParams = useSearchParams();
|
|
||||||
const [paymentStatus, setPaymentStatus] = useState<Stripe.PaymentIntent.Status | undefined>();
|
|
||||||
const [session, setSession] = useState<Session | undefined>();
|
|
||||||
const [error, setError] = useState<any>();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setError(undefined);
|
|
||||||
const payment_intent = searchParams.get('payment_intent') || false;
|
|
||||||
if (payment_intent) {
|
|
||||||
getStripePaymentStatus(payment_intent)
|
|
||||||
.then((result) => {
|
|
||||||
setPaymentStatus(result?.status);
|
|
||||||
if (result?.status === 'succeeded' && result?.metadata?.sessionId) {
|
|
||||||
const jwt = getStorageValue(AUTH_TOKEN_KEY, '');
|
|
||||||
sessionPaymentConfirm(locale, jwt, +result.metadata.sessionId)
|
|
||||||
.then((session) => {
|
|
||||||
setSession(session);
|
|
||||||
})
|
|
||||||
.catch((err: any) => {
|
|
||||||
setError(err);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((err: any) => {
|
|
||||||
setError(err);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}, [searchParams]);
|
|
||||||
|
|
||||||
const onClose = () => {
|
|
||||||
const { origin, pathname } = window?.location || {};
|
|
||||||
|
|
||||||
router.push(`${origin}${pathname}`);
|
|
||||||
setPaymentStatus(undefined);
|
|
||||||
setSession(undefined);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
className="b-modal"
|
|
||||||
open={paymentStatus === 'succeeded' && session?.state === SessionState.PAID}
|
|
||||||
title={undefined}
|
|
||||||
onOk={undefined}
|
|
||||||
onCancel={onClose}
|
|
||||||
footer={false}
|
|
||||||
width={498}
|
|
||||||
closeIcon={<CloseOutlined style={{ fontSize: 20, color: '#000' }}/>}
|
|
||||||
>
|
|
||||||
<div className="b-schedule-payment-result">
|
|
||||||
<Result
|
|
||||||
status="success"
|
|
||||||
title={i18nText('successPayment', locale)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
}
|
|
|
@ -1,113 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import React, { useCallback, useState } from 'react';
|
|
||||||
import { Button, Modal, notification } from 'antd';
|
|
||||||
import { CloseOutlined } from '@ant-design/icons';
|
|
||||||
import debounce from 'lodash/debounce';
|
|
||||||
import Image from 'next/image';
|
|
||||||
import { i18nText } from '../../i18nKeys';
|
|
||||||
import { getUsersList } from '../../actions/rooms';
|
|
||||||
import { PublicUser } from '../../types/sessions';
|
|
||||||
import { Room } from '../../types/rooms';
|
|
||||||
import { CustomInput } from '../view/CustomInput';
|
|
||||||
import { Loader } from '../view/Loader';
|
|
||||||
|
|
||||||
type UserListModalProps = {
|
|
||||||
room: Room;
|
|
||||||
isOpen: boolean;
|
|
||||||
locale: string;
|
|
||||||
handleCancel: () => void;
|
|
||||||
jwt: string;
|
|
||||||
submit: (id: number) => void;
|
|
||||||
afterCloseModal?: () => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const UserListModal = ({ room, isOpen, locale, handleCancel, jwt, submit, afterCloseModal }: UserListModalProps) => {
|
|
||||||
const [users, setUsers] = useState<PublicUser[] | undefined>();
|
|
||||||
const [loading, seLoading] = useState<boolean>(false);
|
|
||||||
|
|
||||||
const onSearch = useCallback(debounce((e: any) => {
|
|
||||||
if (e?.target?.value) {
|
|
||||||
seLoading(true);
|
|
||||||
getUsersList(locale, jwt, { template: e.target.value })
|
|
||||||
.then(({ items }) => {
|
|
||||||
const clients = room?.clients?.map(({ id }) => id);
|
|
||||||
setUsers(items
|
|
||||||
? items.filter(({ id }) => !(clients?.length && clients.includes(id) || id === room?.supervisor?.id || id === room?.coach?.id))
|
|
||||||
: undefined);
|
|
||||||
})
|
|
||||||
.catch((err: any) => {
|
|
||||||
notification.error({
|
|
||||||
message: 'Error',
|
|
||||||
description: err?.response?.data?.errMessage
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
seLoading(false);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setUsers(undefined);
|
|
||||||
}
|
|
||||||
|
|
||||||
}, 300), []);
|
|
||||||
|
|
||||||
const onAfterClose = () => {
|
|
||||||
setUsers(undefined);
|
|
||||||
if (afterCloseModal) afterCloseModal();
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
className="b-modal"
|
|
||||||
open={isOpen}
|
|
||||||
title={undefined}
|
|
||||||
onOk={undefined}
|
|
||||||
onCancel={handleCancel}
|
|
||||||
footer={false}
|
|
||||||
width={498}
|
|
||||||
closeIcon={<CloseOutlined style={{ fontSize: 20, color: '#000' }}/>}
|
|
||||||
afterClose={onAfterClose}
|
|
||||||
>
|
|
||||||
<div className="b-modal__users-list__content">
|
|
||||||
<CustomInput
|
|
||||||
placeholder={i18nText('search', locale)}
|
|
||||||
onChange={onSearch}
|
|
||||||
allowClear
|
|
||||||
/>
|
|
||||||
{users && (
|
|
||||||
<div className="b-users-list__wrapper">
|
|
||||||
<Loader isLoading={loading}>
|
|
||||||
{users.length > 0 ? (
|
|
||||||
<div className="b-users-list">
|
|
||||||
{users.map(({ id, name, surname, faceImageUrl }) => (
|
|
||||||
<div className="b-users-list-item" key={id}>
|
|
||||||
<div>
|
|
||||||
<div className="card-detail__portrait card-detail__portrait_small">
|
|
||||||
<Image src={faceImageUrl || '/images/user-avatar.png'} width={86}
|
|
||||||
height={86}
|
|
||||||
alt=""/>
|
|
||||||
</div>
|
|
||||||
<div className="card-detail__inner">
|
|
||||||
<div
|
|
||||||
className="card-detail__name">{`${name} ${surname || ''}`}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
className="card-detail__filled"
|
|
||||||
onClick={() => submit(id)}
|
|
||||||
>
|
|
||||||
{i18nText('room.invite', locale)}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="b-users-list__empty">{i18nText('noData', locale)}</div>
|
|
||||||
)}
|
|
||||||
</Loader>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</Modal>
|
|
||||||
)
|
|
||||||
}
|
|
|
@ -6,7 +6,7 @@ import { AUTH_USER } from '../../../constants/common';
|
||||||
import { SocialConfig } from '../../../constants/social';
|
import { SocialConfig } from '../../../constants/social';
|
||||||
import { useOauthWindow } from '../../../hooks/useOauthWindow';
|
import { useOauthWindow } from '../../../hooks/useOauthWindow';
|
||||||
import { getAuth } from '../../../actions/auth';
|
import { getAuth } from '../../../actions/auth';
|
||||||
import {getPersonalData, getUserData} from '../../../actions/profile';
|
import { getPersonalData } from '../../../actions/profile';
|
||||||
import { CustomInput } from '../../view/CustomInput';
|
import { CustomInput } from '../../view/CustomInput';
|
||||||
import { CustomInputPassword } from '../../view/CustomInputPassword';
|
import { CustomInputPassword } from '../../view/CustomInputPassword';
|
||||||
import { FilledButton } from '../../view/FilledButton';
|
import { FilledButton } from '../../view/FilledButton';
|
||||||
|
@ -39,7 +39,7 @@ export const EnterContent: FC<EnterProps> = ({
|
||||||
getAuth(locale, { login, password })
|
getAuth(locale, { login, password })
|
||||||
.then((data) => {
|
.then((data) => {
|
||||||
if (data.jwtToken) {
|
if (data.jwtToken) {
|
||||||
getUserData(locale, data.jwtToken)
|
getPersonalData(locale, data.jwtToken)
|
||||||
.then((profile) => {
|
.then((profile) => {
|
||||||
localStorage.setItem(AUTH_USER, JSON.stringify(profile));
|
localStorage.setItem(AUTH_USER, JSON.stringify(profile));
|
||||||
updateToken(data.jwtToken);
|
updateToken(data.jwtToken);
|
||||||
|
|
|
@ -1,11 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useEffect } from 'react';
|
|
||||||
|
|
||||||
export const AppConfig = () => {
|
|
||||||
useEffect(() => {
|
|
||||||
console.log('AppVersion', process.env.version);
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return null;
|
|
||||||
};
|
|
|
@ -23,31 +23,6 @@ function HeaderAuthLinks ({
|
||||||
const selectedLayoutSegment = useSelectedLayoutSegment();
|
const selectedLayoutSegment = useSelectedLayoutSegment();
|
||||||
const pathname = selectedLayoutSegment || '';
|
const pathname = selectedLayoutSegment || '';
|
||||||
const [token, setToken] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
const [token, setToken] = useLocalStorage(AUTH_TOKEN_KEY, '');
|
||||||
const [isPayPath, setIsPayPath] = useState<boolean>(false);
|
|
||||||
|
|
||||||
const onOpen = (mode: 'enter' | 'register' | 'reset' | 'finish') => {
|
|
||||||
setMode(mode);
|
|
||||||
setIsOpenModal(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleAuthRegister = () => {
|
|
||||||
setIsPayPath(true);
|
|
||||||
onOpen('register');
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleAuthEnter = () => {
|
|
||||||
setIsPayPath(true);
|
|
||||||
onOpen('enter');
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
document.addEventListener('show_auth_register', handleAuthRegister);
|
|
||||||
document.addEventListener('show_auth_enter', handleAuthEnter);
|
|
||||||
return () => {
|
|
||||||
document.removeEventListener('show_auth_register', handleAuthRegister);
|
|
||||||
document.removeEventListener('show_auth_enter', handleAuthEnter);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!isOpenModal) {
|
if (!isOpenModal) {
|
||||||
|
@ -55,22 +30,15 @@ function HeaderAuthLinks ({
|
||||||
}
|
}
|
||||||
}, [isOpenModal]);
|
}, [isOpenModal]);
|
||||||
|
|
||||||
useEffect(() => {
|
const onOpen = (mode: 'enter' | 'register' | 'reset' | 'finish') => {
|
||||||
if (token && isPayPath) {
|
setMode(mode);
|
||||||
const showPayForm = new Event('show_pay_form');
|
setIsOpenModal(true);
|
||||||
document.dispatchEvent(showPayForm);
|
|
||||||
}
|
|
||||||
}, [token]);
|
|
||||||
|
|
||||||
const addNewEvent = (name: 'show_auth_register' | 'show_auth_enter') => {
|
|
||||||
const evt = new Event(name);
|
|
||||||
document.dispatchEvent(evt);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return token
|
return token
|
||||||
? (
|
? (
|
||||||
<li>
|
<li>
|
||||||
<Link href={'/account/sessions' as any} className={pathname === 'account' ? 'active' : ''}>
|
<Link href={'/account/sessions/upcoming' as any} className={pathname === 'account' ? 'active' : ''}>
|
||||||
{i18nText('account', locale)}
|
{i18nText('account', locale)}
|
||||||
</Link>
|
</Link>
|
||||||
</li>
|
</li>
|
||||||
|
@ -81,7 +49,7 @@ function HeaderAuthLinks ({
|
||||||
<Button
|
<Button
|
||||||
className="b-header__auth"
|
className="b-header__auth"
|
||||||
type="link"
|
type="link"
|
||||||
onClick={() => addNewEvent('show_auth_register')}
|
onClick={() => onOpen('register')}
|
||||||
>
|
>
|
||||||
{i18nText('registration', locale)}
|
{i18nText('registration', locale)}
|
||||||
</Button>
|
</Button>
|
||||||
|
@ -93,7 +61,7 @@ function HeaderAuthLinks ({
|
||||||
<Button
|
<Button
|
||||||
className="b-header__auth"
|
className="b-header__auth"
|
||||||
type="link"
|
type="link"
|
||||||
onClick={() => addNewEvent('show_auth_enter')}
|
onClick={() => onOpen('enter')}
|
||||||
>
|
>
|
||||||
{i18nText('enter', locale)}
|
{i18nText('enter', locale)}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
|
@ -1,4 +1,3 @@
|
||||||
export * from './Header';
|
export * from './Header';
|
||||||
export * from './Footer';
|
export * from './Footer';
|
||||||
export * from './GeneralTopSection';
|
export * from './GeneralTopSection';
|
||||||
export * from './AppConfig';
|
|
||||||
|
|
|
@ -1,165 +0,0 @@
|
||||||
'use client';
|
|
||||||
|
|
||||||
import React, { FC, useEffect, useState } from 'react';
|
|
||||||
import type { StripeError } from '@stripe/stripe-js';
|
|
||||||
import {
|
|
||||||
useStripe,
|
|
||||||
useElements,
|
|
||||||
PaymentElement,
|
|
||||||
Elements,
|
|
||||||
} from '@stripe/react-stripe-js';
|
|
||||||
import { Form, Button, message } from 'antd';
|
|
||||||
import getStripe from '../../utils/get-stripe';
|
|
||||||
import { createPaymentIntent} from '../../actions/stripe';
|
|
||||||
import { Payment } from '../../types/payment';
|
|
||||||
import { i18nText } from '../../i18nKeys';
|
|
||||||
import { WithError } from '../view/WithError';
|
|
||||||
|
|
||||||
type PaymentFormProps = {
|
|
||||||
amount: number,
|
|
||||||
sessionId?: string,
|
|
||||||
locale: string
|
|
||||||
}
|
|
||||||
|
|
||||||
type PaymentInfo = 'initial' | 'error' | 'processing' | 'requires_payment_method' | 'requires_confirmation' | 'requires_action' | 'succeeded';
|
|
||||||
|
|
||||||
const PaymentStatus = ({ status }: { status?: PaymentInfo }) => {
|
|
||||||
switch (status) {
|
|
||||||
case 'processing':
|
|
||||||
case 'requires_payment_method':
|
|
||||||
case 'requires_confirmation':
|
|
||||||
return <h2>Processing...</h2>;
|
|
||||||
|
|
||||||
case 'requires_action':
|
|
||||||
return <h2>Authenticating...</h2>;
|
|
||||||
|
|
||||||
case 'succeeded':
|
|
||||||
return <h2>Payment Succeeded</h2>;
|
|
||||||
|
|
||||||
default:
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
export const CheckoutForm: FC<PaymentFormProps> = ({ amount, sessionId, locale }) => {
|
|
||||||
const [form] = Form.useForm<Payment>();
|
|
||||||
const formAmount = Form.useWatch('amount', form);
|
|
||||||
const [paymentType, setPaymentType] = useState<string>('');
|
|
||||||
const [payment, setPayment] = useState<{
|
|
||||||
status: PaymentInfo
|
|
||||||
}>({ status: 'initial' });
|
|
||||||
const [errorData, setErrorData] = useState<any>();
|
|
||||||
const stripe = useStripe();
|
|
||||||
const elements = useElements();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
elements?.update({ amount: formAmount * 100 });
|
|
||||||
}, [formAmount]);
|
|
||||||
|
|
||||||
const onSubmit = async () => {
|
|
||||||
try {
|
|
||||||
if (!elements || !stripe) return;
|
|
||||||
|
|
||||||
setErrorData(undefined);
|
|
||||||
setPayment({ status: "processing" });
|
|
||||||
|
|
||||||
const { error: submitError } = await elements.submit();
|
|
||||||
|
|
||||||
if (submitError) {
|
|
||||||
if (submitError.message) {
|
|
||||||
message.error(submitError.message);
|
|
||||||
}
|
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const { client_secret: clientSecret } = await createPaymentIntent(
|
|
||||||
{ amount, sessionId }
|
|
||||||
);
|
|
||||||
|
|
||||||
const { error: confirmError } = await stripe!.confirmPayment({
|
|
||||||
elements,
|
|
||||||
clientSecret,
|
|
||||||
confirmParams: {
|
|
||||||
return_url: window.location.href,
|
|
||||||
payment_method_data: {
|
|
||||||
allow_redisplay: 'limited',
|
|
||||||
// billing_details: {
|
|
||||||
// name: input.cardholderName,
|
|
||||||
// },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
if (confirmError) {
|
|
||||||
setErrorData({
|
|
||||||
title: i18nText('errorPayment', locale),
|
|
||||||
message: confirmError.message ?? 'An unknown error occurred'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
} catch (err) {
|
|
||||||
const { message } = err as StripeError;
|
|
||||||
setErrorData({
|
|
||||||
title: i18nText('errorPayment', locale),
|
|
||||||
message: message ?? 'An unknown error occurred'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<WithError errorData={errorData}>
|
|
||||||
<Form form={form} onFinish={onSubmit} style={{ display: 'flex', overflow: 'hidden', flexDirection: 'column', gap: 16, justifyContent: 'space-between', alignItems: 'center' }}>
|
|
||||||
<div style={{ width: '100%' }}>
|
|
||||||
<PaymentElement
|
|
||||||
onChange={(e) => {
|
|
||||||
setPaymentType(e.value.type);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<PaymentStatus status={payment.status}/>
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
className="btn-apply"
|
|
||||||
htmlType="submit"
|
|
||||||
disabled={
|
|
||||||
!["initial", "succeeded", "error"].includes(payment.status) ||
|
|
||||||
!stripe
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{`${i18nText('pay', locale)} ${amount}€`}
|
|
||||||
</Button>
|
|
||||||
</Form>
|
|
||||||
</WithError>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export const StripeElementsForm: FC<PaymentFormProps> = ({ amount, sessionId, locale }) => {
|
|
||||||
return (
|
|
||||||
<Elements
|
|
||||||
stripe={getStripe()}
|
|
||||||
options={{
|
|
||||||
fonts: [{
|
|
||||||
cssSrc: 'https://fonts.googleapis.com/css2?family=Comfortaa&display=swap',
|
|
||||||
}],
|
|
||||||
appearance: {
|
|
||||||
variables: {
|
|
||||||
colorIcon: '#2c7873',
|
|
||||||
fontSizeBase: '16px',
|
|
||||||
colorPrimary: '#66A5AD',
|
|
||||||
colorBackground: '#F8F8F7',
|
|
||||||
colorText: '#000',
|
|
||||||
colorDanger: '#ff4d4f',
|
|
||||||
focusBoxShadow: 'none',
|
|
||||||
borderRadius: '8px'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
currency: 'eur',
|
|
||||||
mode: "payment",
|
|
||||||
amount: amount*100,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<CheckoutForm amount={amount} sessionId={sessionId} locale={locale} />
|
|
||||||
</Elements>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -1,60 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useEffect, useState } from 'react';
|
|
||||||
import { DatePicker } from 'antd';
|
|
||||||
import { CalendarOutlined } from '@ant-design/icons';
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import 'dayjs/locale/ru';
|
|
||||||
import 'dayjs/locale/en';
|
|
||||||
import 'dayjs/locale/de';
|
|
||||||
import 'dayjs/locale/it';
|
|
||||||
import 'dayjs/locale/fr';
|
|
||||||
import 'dayjs/locale/es';
|
|
||||||
import { getLocale } from '../../utils/locale';
|
|
||||||
|
|
||||||
export const CustomDatePicker = (props: any) => {
|
|
||||||
const { label, value, locale, ...other } = props;
|
|
||||||
const [isActiveLabel, setIsActiveLabel] = useState<boolean>(false);
|
|
||||||
|
|
||||||
dayjs.locale(locale);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (label) {
|
|
||||||
setIsActiveLabel(!!value);
|
|
||||||
} else {
|
|
||||||
setIsActiveLabel(false);
|
|
||||||
}
|
|
||||||
}, [value]);
|
|
||||||
|
|
||||||
const onOpenChange = (open: boolean) => {
|
|
||||||
if (open) {
|
|
||||||
if (!isActiveLabel) setIsActiveLabel(true)
|
|
||||||
} else {
|
|
||||||
setIsActiveLabel(!!value)
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={`b-datepicker-wrap ${isActiveLabel ? 'b-datepicker__active' : ''}`}>
|
|
||||||
<div className="b-datepicker-label">
|
|
||||||
<span>{label}</span>
|
|
||||||
</div>
|
|
||||||
<DatePicker
|
|
||||||
className="b-datepicker"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
locale={getLocale(locale)}
|
|
||||||
value={value}
|
|
||||||
showNow={false}
|
|
||||||
onOpenChange={onOpenChange}
|
|
||||||
needConfirm={false}
|
|
||||||
placeholder=""
|
|
||||||
variant="filled"
|
|
||||||
allowClear={false}
|
|
||||||
popupClassName="b-datepicker-popup"
|
|
||||||
minDate={dayjs().startOf('month')}
|
|
||||||
suffixIcon={<CalendarOutlined style={{ color: '#2c7873', fontSize: 20 }} />}
|
|
||||||
{...other}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -30,9 +30,7 @@ export const CustomMultiSelect = (props: any) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`b-multiselect-wrap ${isActiveLabel ? 'b-multiselect__active' : ''}`}>
|
<div className={`b-multiselect-wrap ${isActiveLabel ? 'b-multiselect__active' : ''}`}>
|
||||||
<div className="b-multiselect-label">
|
<div className="b-multiselect-label">{label}</div>
|
||||||
<span>{label}</span>
|
|
||||||
</div>
|
|
||||||
<Select
|
<Select
|
||||||
className="b-multiselect"
|
className="b-multiselect"
|
||||||
mode="multiple"
|
mode="multiple"
|
||||||
|
|
|
@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
|
||||||
import { Select } from 'antd';
|
import { Select } from 'antd';
|
||||||
|
|
||||||
export const CustomSelect = (props: any) => {
|
export const CustomSelect = (props: any) => {
|
||||||
const { label, value, style, ...other } = props;
|
const { label, value, ...other } = props;
|
||||||
const [isActiveLabel, setIsActiveLabel] = useState<boolean>(false);
|
const [isActiveLabel, setIsActiveLabel] = useState<boolean>(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
@ -16,10 +16,8 @@ export const CustomSelect = (props: any) => {
|
||||||
}, [value]);
|
}, [value]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`b-select-wrap ${isActiveLabel ? 'b-select__active' : ''}`} style={style}>
|
<div className={`b-select-wrap ${isActiveLabel ? 'b-select__active' : ''}`}>
|
||||||
<div className="b-select-label">
|
<div className="b-select-label">{label}</div>
|
||||||
<span>{label}</span>
|
|
||||||
</div>
|
|
||||||
<Select
|
<Select
|
||||||
className="b-select"
|
className="b-select"
|
||||||
value={value}
|
value={value}
|
||||||
|
|
|
@ -1,48 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useEffect, useState } from 'react';
|
|
||||||
import { TimePicker } from 'antd';
|
|
||||||
import { DownOutlined } from '@ant-design/icons';
|
|
||||||
|
|
||||||
export const CustomTimePicker = (props: any) => {
|
|
||||||
const { label, value, ...other } = props;
|
|
||||||
const [isActiveLabel, setIsActiveLabel] = useState<boolean>(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (label) {
|
|
||||||
setIsActiveLabel(!!value);
|
|
||||||
} else {
|
|
||||||
setIsActiveLabel(false);
|
|
||||||
}
|
|
||||||
}, [value]);
|
|
||||||
|
|
||||||
const onOpenChange = (open: boolean) => {
|
|
||||||
if (open) {
|
|
||||||
if (!isActiveLabel) setIsActiveLabel(true)
|
|
||||||
} else {
|
|
||||||
setIsActiveLabel(!!value)
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={`b-timepicker-wrap ${isActiveLabel ? 'b-timepicker__active' : ''}`}>
|
|
||||||
<div className="b-timepicker-label">
|
|
||||||
<span>{label}</span>
|
|
||||||
</div>
|
|
||||||
<TimePicker
|
|
||||||
className="b-timepicker"
|
|
||||||
format="HH:mm"
|
|
||||||
minuteStep={15}
|
|
||||||
value={value}
|
|
||||||
showNow={false}
|
|
||||||
onOpenChange={onOpenChange}
|
|
||||||
needConfirm={false}
|
|
||||||
placeholder=""
|
|
||||||
variant="filled"
|
|
||||||
allowClear={false}
|
|
||||||
suffixIcon={<DownOutlined style={{ color: '#2c7873', fontSize: 12 }} />}
|
|
||||||
{...other}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
|
@ -16,8 +16,8 @@ export const WithError: FC<WithErrorProps> = ({
|
||||||
return (
|
return (
|
||||||
<Result
|
<Result
|
||||||
status="error"
|
status="error"
|
||||||
title={errorData?.title}
|
title="Submission Failed"
|
||||||
subTitle={errorData?.message}
|
subTitle="Please check and modify the following information before resubmitting."
|
||||||
extra={refresh ? (
|
extra={refresh ? (
|
||||||
<Button type="primary" onClick={refresh}>
|
<Button type="primary" onClick={refresh}>
|
||||||
Refresh page
|
Refresh page
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export const BASE_URL = process.env.NEXT_PUBLIC_SERVER_BASE_URL || 'https://api.bbuddy.expert/api';
|
export const BASE_URL = process.env.NEXT_PUBLIC_SERVER_BASE_URL || 'https://api.bbuddy.expert/api';
|
||||||
export const AUTH_TOKEN_KEY = 'bbuddy_token';
|
export const AUTH_TOKEN_KEY = 'bbuddy_token';
|
||||||
export const AUTH_USER = 'bbuddy_auth_user';
|
export const AUTH_USER = 'bbuddy_auth_user';
|
||||||
export const SESSION_DATA = 'bbuddy_session_data';
|
|
||||||
|
|
||||||
export const DEFAULT_PAGE_SIZE = 5;
|
export const DEFAULT_PAGE_SIZE = 5;
|
||||||
export const DEFAULT_PAGE = 1;
|
export const DEFAULT_PAGE = 1;
|
||||||
|
|
|
@ -1,37 +0,0 @@
|
||||||
export const UTC_LIST = [
|
|
||||||
'-12:00',
|
|
||||||
'-11:00',
|
|
||||||
'-10:00',
|
|
||||||
'-09:30',
|
|
||||||
'-09:00',
|
|
||||||
'-08:00',
|
|
||||||
'-07:00',
|
|
||||||
'-06:00',
|
|
||||||
'-05:00',
|
|
||||||
'-04:00',
|
|
||||||
'-03:30',
|
|
||||||
'-03:00',
|
|
||||||
'-02:00',
|
|
||||||
'-01:00',
|
|
||||||
'+00:00',
|
|
||||||
'+01:00',
|
|
||||||
'+02:00',
|
|
||||||
'+03:00',
|
|
||||||
'+03:30',
|
|
||||||
'+04:00',
|
|
||||||
'+04:30',
|
|
||||||
'+05:00',
|
|
||||||
'+05:30',
|
|
||||||
'+06:00',
|
|
||||||
'+06:30',
|
|
||||||
'+07:00',
|
|
||||||
'+08:00',
|
|
||||||
'+09:00',
|
|
||||||
'+09:30',
|
|
||||||
'+10:00',
|
|
||||||
'+10:30',
|
|
||||||
'+11:00',
|
|
||||||
'+12:00',
|
|
||||||
'+13:00',
|
|
||||||
'+14:00'
|
|
||||||
];
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
|
|
||||||
export function getStorageValue (key: string, defaultValue: any) {
|
function getStorageValue (key: string, defaultValue: any) {
|
||||||
if (typeof window !== 'undefined') {
|
if (typeof window !== 'undefined') {
|
||||||
const saved = localStorage.getItem(key);
|
const saved = localStorage.getItem(key);
|
||||||
return saved || defaultValue;
|
return saved || defaultValue;
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Kommende & letzte Sitzungen',
|
sessions: 'Kommende & letzte Sitzungen',
|
||||||
rooms: 'Zimmer',
|
|
||||||
notifications: 'Benachrichtigung',
|
notifications: 'Benachrichtigung',
|
||||||
support: 'Hilfe & Support',
|
support: 'Hilfe & Support',
|
||||||
information: 'Rechtliche Informationen',
|
information: 'Rechtliche Informationen',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Neuen Kommentar hinzufügen',
|
addComment: 'Neuen Kommentar hinzufügen',
|
||||||
commentPlaceholder: 'Ihr Kommentar',
|
commentPlaceholder: 'Ihr Kommentar',
|
||||||
clientComments: 'Kundenkommentare',
|
clientComments: 'Kundenkommentare',
|
||||||
coachComments: 'Expertenkommentare'
|
coachComments: 'Trainerkommentare'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Zukünftige Räume',
|
upcoming: 'Zukünftige Räume',
|
||||||
requested: 'Angeforderte Räume',
|
requested: 'Angeforderte Räume',
|
||||||
recent: 'Kürzliche Räume',
|
recent: 'Kürzliche Räume',
|
||||||
newRoom: 'Neuer Raum',
|
newRoom: 'Neuer Raum'
|
||||||
editRoom: 'Raum bearbeiten',
|
|
||||||
date: 'Datum',
|
|
||||||
time: 'Zeit',
|
|
||||||
maxParticipants: 'Max. erlaubte Teilnehmer',
|
|
||||||
presenceOfSupervisor: 'Anwesenheit eines Supervisors',
|
|
||||||
supervisor: 'Supervisor',
|
|
||||||
members: 'Mitglieder',
|
|
||||||
participants: 'Teilnehmer',
|
|
||||||
roomCreator: 'Raum-Ersteller',
|
|
||||||
inviteSupervisor: 'Supervisor einladen',
|
|
||||||
joinSupervisor: 'Als Supervisor beitreten',
|
|
||||||
inviteParticipant: 'Teilnehmer einladen',
|
|
||||||
joinParticipant: 'Als Teilnehmer beitreten',
|
|
||||||
rapport: 'Rapport',
|
|
||||||
invite: 'Invite',
|
|
||||||
save: 'Raum speichern'
|
|
||||||
},
|
},
|
||||||
agreementText: 'Folgendes habe ich gelesen und erkläre mich damit einverstanden: Benutzervereinbarung,',
|
agreementText: 'Folgendes habe ich gelesen und erkläre mich damit einverstanden: Benutzervereinbarung,',
|
||||||
userAgreement: 'Benutzervereinbarung',
|
userAgreement: 'Benutzervereinbarung',
|
||||||
|
@ -127,9 +110,9 @@ export default {
|
||||||
seminars: 'Seminare',
|
seminars: 'Seminare',
|
||||||
courses: 'Kurse',
|
courses: 'Kurse',
|
||||||
mba: 'MBA-Information',
|
mba: 'MBA-Information',
|
||||||
aboutCoach: 'Über den Experten',
|
aboutCoach: 'Über Coach',
|
||||||
education: 'Bildung',
|
education: 'Bildung',
|
||||||
coaching: 'Expertenprofil',
|
coaching: 'Coaching',
|
||||||
experiences: 'Praktische Erfahrung',
|
experiences: 'Praktische Erfahrung',
|
||||||
payInfo: 'Zahlungsdaten',
|
payInfo: 'Zahlungsdaten',
|
||||||
sessionDuration: 'Sitzungsdauer',
|
sessionDuration: 'Sitzungsdauer',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Arbeitszeit',
|
workTime: 'Arbeitszeit',
|
||||||
startAt: 'Beginn um',
|
startAt: 'Beginn um',
|
||||||
finishAt: 'Ende um',
|
finishAt: 'Ende um',
|
||||||
day: 'Tag',
|
|
||||||
addWorkingHours: 'Arbeitszeiten hinzufügen',
|
addWorkingHours: 'Arbeitszeiten hinzufügen',
|
||||||
specialisation: 'Spezialisierung',
|
specialisation: 'Spezialisierung',
|
||||||
selectSpecialisation: 'Wählen Sie Ihre Spezialisierung, um fortzufahren',
|
selectSpecialisation: 'Wählen Sie Ihre Spezialisierung, um fortzufahren',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'Sa',
|
saturday: 'Sa',
|
||||||
addNew: 'Neu hinzufügen',
|
addNew: 'Neu hinzufügen',
|
||||||
mExperiences: 'Führungserfahrung',
|
mExperiences: 'Führungserfahrung',
|
||||||
pay: 'Zahlung',
|
|
||||||
sessionWishes: 'Schreiben Sie Ihre Wünsche zur Sitzung',
|
|
||||||
successPayment: 'Erfolgreiche Zahlung',
|
|
||||||
errorPayment: 'Zahlungsfehler',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'Die E-Mail-Adresse ist ungültig',
|
invalidEmail: 'Die E-Mail-Adresse ist ungültig',
|
||||||
emptyEmail: 'Bitte geben Sie Ihre E-Mail ein',
|
emptyEmail: 'Bitte geben Sie Ihre E-Mail ein',
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Upcoming & Recent Sessions',
|
sessions: 'Upcoming & Recent Sessions',
|
||||||
rooms: 'Rooms',
|
|
||||||
notifications: 'Notification',
|
notifications: 'Notification',
|
||||||
support: 'Help & Support',
|
support: 'Help & Support',
|
||||||
information: 'Legal Information',
|
information: 'Legal Information',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Add new',
|
addComment: 'Add new',
|
||||||
commentPlaceholder: 'Your comment',
|
commentPlaceholder: 'Your comment',
|
||||||
clientComments: 'Client Comments',
|
clientComments: 'Client Comments',
|
||||||
coachComments: 'Expert Comments'
|
coachComments: 'Coach Comments'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Upcoming Rooms',
|
upcoming: 'Upcoming Rooms',
|
||||||
requested: 'Rooms Requested',
|
requested: 'Rooms Requested',
|
||||||
recent: 'Recent Rooms',
|
recent: 'Recent Rooms',
|
||||||
newRoom: 'New Room',
|
newRoom: 'New Room'
|
||||||
editRoom: 'Edit Room',
|
|
||||||
date: 'Date',
|
|
||||||
time: 'Time',
|
|
||||||
maxParticipants: 'Max Participants Allowed',
|
|
||||||
presenceOfSupervisor: 'Presence of a Supervisor',
|
|
||||||
supervisor: 'Supervisor',
|
|
||||||
members: 'Members',
|
|
||||||
participants: 'Participants',
|
|
||||||
roomCreator: 'Room Creator',
|
|
||||||
inviteSupervisor: 'Invite Supervisor',
|
|
||||||
joinSupervisor: 'Join As A Supervisor',
|
|
||||||
inviteParticipant: 'Invite Participant',
|
|
||||||
joinParticipant: 'Join as a participant',
|
|
||||||
rapport: 'Rapport',
|
|
||||||
invite: 'Invite',
|
|
||||||
save: 'Save room'
|
|
||||||
},
|
},
|
||||||
agreementText: 'I have read and agree with the terms of the User Agreement,',
|
agreementText: 'I have read and agree with the terms of the User Agreement,',
|
||||||
userAgreement: 'User Agreement',
|
userAgreement: 'User Agreement',
|
||||||
|
@ -126,10 +109,10 @@ export default {
|
||||||
seminars: 'Seminars',
|
seminars: 'Seminars',
|
||||||
courses: 'Courses',
|
courses: 'Courses',
|
||||||
mba: 'MBA Information',
|
mba: 'MBA Information',
|
||||||
aboutCoach: 'About Expert',
|
aboutCoach: 'About Coach',
|
||||||
skillsInfo: 'Skills Info',
|
skillsInfo: 'Skills Info',
|
||||||
education: 'Education',
|
education: 'Education',
|
||||||
coaching: 'Expert profile',
|
coaching: 'Coaching',
|
||||||
experiences: 'Practical experience',
|
experiences: 'Practical experience',
|
||||||
payInfo: 'Payment Info',
|
payInfo: 'Payment Info',
|
||||||
sessionDuration: 'Session duration',
|
sessionDuration: 'Session duration',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Work time',
|
workTime: 'Work time',
|
||||||
startAt: 'Start at',
|
startAt: 'Start at',
|
||||||
finishAt: 'Finish at',
|
finishAt: 'Finish at',
|
||||||
day: 'Day',
|
|
||||||
addWorkingHours: 'Add working hours',
|
addWorkingHours: 'Add working hours',
|
||||||
specialisation: 'Specialisation',
|
specialisation: 'Specialisation',
|
||||||
selectSpecialisation: 'Select your specialisation to proceed',
|
selectSpecialisation: 'Select your specialisation to proceed',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'Sa',
|
saturday: 'Sa',
|
||||||
addNew: 'Add New',
|
addNew: 'Add New',
|
||||||
mExperiences: 'Managerial Experience',
|
mExperiences: 'Managerial Experience',
|
||||||
pay: 'Pay',
|
|
||||||
sessionWishes: 'Write your wishes about the session',
|
|
||||||
successPayment: 'Successful Payment',
|
|
||||||
errorPayment: 'Payment Error',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'The email address is not valid',
|
invalidEmail: 'The email address is not valid',
|
||||||
emptyEmail: 'Please enter your E-mail',
|
emptyEmail: 'Please enter your E-mail',
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Próximas y recientes sesiones',
|
sessions: 'Próximas y recientes sesiones',
|
||||||
rooms: 'Habitaciones',
|
|
||||||
notifications: 'Notificación',
|
notifications: 'Notificación',
|
||||||
support: 'Ayuda y asistencia',
|
support: 'Ayuda y asistencia',
|
||||||
information: 'Información jurídica',
|
information: 'Información jurídica',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Añadir nuevo comentario',
|
addComment: 'Añadir nuevo comentario',
|
||||||
commentPlaceholder: 'Tu comentario',
|
commentPlaceholder: 'Tu comentario',
|
||||||
clientComments: 'Comentarios del cliente',
|
clientComments: 'Comentarios del cliente',
|
||||||
coachComments: 'Comentarios del experto'
|
coachComments: 'Comentarios del entrenador'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Próximas salas',
|
upcoming: 'Próximas salas',
|
||||||
requested: 'Salas solicitadas',
|
requested: 'Salas solicitadas',
|
||||||
recent: 'Salas recientes',
|
recent: 'Salas recientes',
|
||||||
newRoom: 'Nueva sala',
|
newRoom: 'Nueva sala'
|
||||||
editRoom: 'Editar la sala',
|
|
||||||
date: 'Fecha',
|
|
||||||
time: 'Tiempo',
|
|
||||||
maxParticipants: 'Máximo de participantes permitidos',
|
|
||||||
presenceOfSupervisor: 'Presencia de un supervisor',
|
|
||||||
supervisor: 'Supervisor',
|
|
||||||
members: 'Miembros',
|
|
||||||
participants: 'Participantes',
|
|
||||||
roomCreator: 'Creador de salas',
|
|
||||||
inviteSupervisor: 'Invitar al supervisor',
|
|
||||||
joinSupervisor: 'Unirse como supervisor',
|
|
||||||
inviteParticipant: 'Invitar a un participante',
|
|
||||||
joinParticipant: 'Unirse como participante',
|
|
||||||
rapport: 'Buena relación',
|
|
||||||
invite: 'Invitar',
|
|
||||||
save: 'Guardar sala'
|
|
||||||
},
|
},
|
||||||
agreementText: 'He leído y acepto las condiciones del Acuerdo de usuario,',
|
agreementText: 'He leído y acepto las condiciones del Acuerdo de usuario,',
|
||||||
userAgreement: 'Acuerdo de usuario',
|
userAgreement: 'Acuerdo de usuario',
|
||||||
|
@ -127,9 +110,9 @@ export default {
|
||||||
seminars: 'Seminarios',
|
seminars: 'Seminarios',
|
||||||
courses: 'Cursos',
|
courses: 'Cursos',
|
||||||
mba: 'Información sobre máster en ADE (MBA)',
|
mba: 'Información sobre máster en ADE (MBA)',
|
||||||
aboutCoach: 'Acerca del experto',
|
aboutCoach: 'Sobre el coach',
|
||||||
education: 'Educación',
|
education: 'Educación',
|
||||||
coaching: 'Perfil del experto',
|
coaching: 'Coaching',
|
||||||
experiences: 'Experiencia práctica',
|
experiences: 'Experiencia práctica',
|
||||||
payInfo: 'Información de pago',
|
payInfo: 'Información de pago',
|
||||||
sessionDuration: 'Duración de la sesión',
|
sessionDuration: 'Duración de la sesión',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Tiempo de trabajo',
|
workTime: 'Tiempo de trabajo',
|
||||||
startAt: 'Empieza a las',
|
startAt: 'Empieza a las',
|
||||||
finishAt: 'Termina a las',
|
finishAt: 'Termina a las',
|
||||||
day: 'Día',
|
|
||||||
addWorkingHours: 'Añadir horas de trabajo',
|
addWorkingHours: 'Añadir horas de trabajo',
|
||||||
specialisation: 'Especialización',
|
specialisation: 'Especialización',
|
||||||
selectSpecialisation: 'Selecciona tu especialización para continuar',
|
selectSpecialisation: 'Selecciona tu especialización para continuar',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'S',
|
saturday: 'S',
|
||||||
addNew: 'Añadir nuevo',
|
addNew: 'Añadir nuevo',
|
||||||
mExperiences: 'Experiencia de dirección',
|
mExperiences: 'Experiencia de dirección',
|
||||||
pay: 'Pago',
|
|
||||||
sessionWishes: 'Escribe tus deseos sobre la sesión',
|
|
||||||
successPayment: 'Pago Exitoso',
|
|
||||||
errorPayment: 'Error de Pago',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'La dirección de correo electrónico no es válida',
|
invalidEmail: 'La dirección de correo electrónico no es válida',
|
||||||
emptyEmail: 'Introduce tu correo electrónico',
|
emptyEmail: 'Introduce tu correo electrónico',
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Sessions futures et récentes',
|
sessions: 'Sessions futures et récentes',
|
||||||
rooms: 'Chambres',
|
|
||||||
notifications: 'Notification',
|
notifications: 'Notification',
|
||||||
support: 'Aide et support',
|
support: 'Aide et support',
|
||||||
information: 'Informations légales',
|
information: 'Informations légales',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Ajouter un nouveau commentaire',
|
addComment: 'Ajouter un nouveau commentaire',
|
||||||
commentPlaceholder: 'Votre commentaire',
|
commentPlaceholder: 'Votre commentaire',
|
||||||
clientComments: 'Commentaires du client',
|
clientComments: 'Commentaires du client',
|
||||||
coachComments: 'Commentaires de l\'expert'
|
coachComments: 'Commentaires du coach'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Salles futures',
|
upcoming: 'Salles futures',
|
||||||
requested: 'Salles demandées',
|
requested: 'Salles demandées',
|
||||||
recent: 'Salles récentes',
|
recent: 'Salles récentes',
|
||||||
newRoom: 'Nouvelle salle',
|
newRoom: 'Nouvelle salle'
|
||||||
editRoom: 'Modifier la salle',
|
|
||||||
date: 'Date',
|
|
||||||
time: 'Temps',
|
|
||||||
maxParticipants: 'Max de participants autorisés',
|
|
||||||
presenceOfSupervisor: 'Présence d\'un superviseur',
|
|
||||||
supervisor: 'Superviseur',
|
|
||||||
members: 'Membres',
|
|
||||||
participants: 'Participants',
|
|
||||||
roomCreator: 'Créateur de la salle',
|
|
||||||
inviteSupervisor: 'Inviter un superviseur',
|
|
||||||
joinSupervisor: 'Rejoindre en tant que superviseur',
|
|
||||||
inviteParticipant: 'Inviter un participant',
|
|
||||||
joinParticipant: 'Rejoindre en tant que participant',
|
|
||||||
rapport: 'Rapport',
|
|
||||||
invite: 'Inviter',
|
|
||||||
save: 'Sauvegarder la salle'
|
|
||||||
},
|
},
|
||||||
agreementText: 'J\'ai lu et j\'accepte les dispositions de l\'Accord Utilisateur et de la',
|
agreementText: 'J\'ai lu et j\'accepte les dispositions de l\'Accord Utilisateur et de la',
|
||||||
userAgreement: '',
|
userAgreement: '',
|
||||||
|
@ -127,9 +110,9 @@ export default {
|
||||||
seminars: 'Séminaires',
|
seminars: 'Séminaires',
|
||||||
courses: 'Cours',
|
courses: 'Cours',
|
||||||
mba: 'Infos Maîtrise en gestion',
|
mba: 'Infos Maîtrise en gestion',
|
||||||
aboutCoach: 'À propos de l\'expert',
|
aboutCoach: 'À propos du coach',
|
||||||
education: 'Éducation',
|
education: 'Éducation',
|
||||||
coaching: 'Profil de l\'expert',
|
coaching: 'Coaching',
|
||||||
experiences: 'Expérience pratique',
|
experiences: 'Expérience pratique',
|
||||||
payInfo: 'Infos sur le paiement',
|
payInfo: 'Infos sur le paiement',
|
||||||
sessionDuration: 'Durée de la session',
|
sessionDuration: 'Durée de la session',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Heures de travail',
|
workTime: 'Heures de travail',
|
||||||
startAt: 'Commencer à',
|
startAt: 'Commencer à',
|
||||||
finishAt: 'Finir à',
|
finishAt: 'Finir à',
|
||||||
day: 'Jour',
|
|
||||||
addWorkingHours: 'Ajouter des heures de travail',
|
addWorkingHours: 'Ajouter des heures de travail',
|
||||||
specialisation: 'Spécialisation',
|
specialisation: 'Spécialisation',
|
||||||
selectSpecialisation: 'Sélectionnez votre spécialisation pour continuer',
|
selectSpecialisation: 'Sélectionnez votre spécialisation pour continuer',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'Sa',
|
saturday: 'Sa',
|
||||||
addNew: 'Ajouter un nouveau',
|
addNew: 'Ajouter un nouveau',
|
||||||
mExperiences: 'Expérience en gestion',
|
mExperiences: 'Expérience en gestion',
|
||||||
pay: 'Paiement',
|
|
||||||
sessionWishes: 'Écrivez vos souhaits concernant la session',
|
|
||||||
successPayment: 'Paiement Réussi',
|
|
||||||
errorPayment: 'Erreur de Paiement',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'L\'adresse e-mail n\'est pas valide',
|
invalidEmail: 'L\'adresse e-mail n\'est pas valide',
|
||||||
emptyEmail: 'Veuillez saisir votre e-mail',
|
emptyEmail: 'Veuillez saisir votre e-mail',
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Prossime e recenti sessioni',
|
sessions: 'Prossime e recenti sessioni',
|
||||||
rooms: 'Stanze',
|
|
||||||
notifications: 'Notifica',
|
notifications: 'Notifica',
|
||||||
support: 'Assistenza e supporto',
|
support: 'Assistenza e supporto',
|
||||||
information: 'Informazioni legali',
|
information: 'Informazioni legali',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Aggiungi nuovo commento',
|
addComment: 'Aggiungi nuovo commento',
|
||||||
commentPlaceholder: 'Il tuo commento',
|
commentPlaceholder: 'Il tuo commento',
|
||||||
clientComments: 'Commenti del cliente',
|
clientComments: 'Commenti del cliente',
|
||||||
coachComments: 'Commenti dell\'esperto'
|
coachComments: 'Commenti dell\'allenatore'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Prossime sale',
|
upcoming: 'Prossime sale',
|
||||||
requested: 'Sale richieste',
|
requested: 'Sale richieste',
|
||||||
recent: 'Sale recenti',
|
recent: 'Sale recenti',
|
||||||
newRoom: 'Nuova sala',
|
newRoom: 'Nuova sala'
|
||||||
editRoom: 'Modifica sala',
|
|
||||||
date: 'Data',
|
|
||||||
time: 'Tempo',
|
|
||||||
maxParticipants: 'Numero massimo di partecipanti consentiti',
|
|
||||||
presenceOfSupervisor: 'Presenza di un relatore',
|
|
||||||
supervisor: 'Relatore',
|
|
||||||
members: 'Iscritti',
|
|
||||||
participants: 'Partecipanti',
|
|
||||||
roomCreator: 'Creatore sala',
|
|
||||||
inviteSupervisor: 'Invita relatore',
|
|
||||||
joinSupervisor: 'Partecipa come relatore',
|
|
||||||
inviteParticipant: 'Invita partecipante',
|
|
||||||
joinParticipant: 'Partecipa come partecipante',
|
|
||||||
rapport: 'Rapporto',
|
|
||||||
invite: 'Invita',
|
|
||||||
save: 'Salva sala'
|
|
||||||
},
|
},
|
||||||
agreementText: 'Ho letto e accetto i termini dell\'Accordo con l\'utente,',
|
agreementText: 'Ho letto e accetto i termini dell\'Accordo con l\'utente,',
|
||||||
userAgreement: '',
|
userAgreement: '',
|
||||||
|
@ -127,9 +110,9 @@ export default {
|
||||||
seminars: 'Seminari',
|
seminars: 'Seminari',
|
||||||
courses: 'Corsi',
|
courses: 'Corsi',
|
||||||
mba: 'Info sull\'MBA',
|
mba: 'Info sull\'MBA',
|
||||||
aboutCoach: 'Informazioni sull\'esperto',
|
aboutCoach: 'Informazioni sul coach',
|
||||||
education: 'Istruzione',
|
education: 'Istruzione',
|
||||||
coaching: 'Profilo dell\'esperto',
|
coaching: 'Coaching',
|
||||||
experiences: 'Esperienza pratica',
|
experiences: 'Esperienza pratica',
|
||||||
payInfo: 'Info pagamento',
|
payInfo: 'Info pagamento',
|
||||||
sessionDuration: 'Durata della sessione',
|
sessionDuration: 'Durata della sessione',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Orario di lavoro',
|
workTime: 'Orario di lavoro',
|
||||||
startAt: 'Inizia alle',
|
startAt: 'Inizia alle',
|
||||||
finishAt: 'Termina alle',
|
finishAt: 'Termina alle',
|
||||||
day: 'Giorno',
|
|
||||||
addWorkingHours: 'Aggiungi ore lavorative',
|
addWorkingHours: 'Aggiungi ore lavorative',
|
||||||
specialisation: 'Specializzazione',
|
specialisation: 'Specializzazione',
|
||||||
selectSpecialisation: 'Seleziona la tua specializzazione per continuare',
|
selectSpecialisation: 'Seleziona la tua specializzazione per continuare',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'Sa',
|
saturday: 'Sa',
|
||||||
addNew: 'Aggiungi nuovo',
|
addNew: 'Aggiungi nuovo',
|
||||||
mExperiences: 'Esperienza manageriale',
|
mExperiences: 'Esperienza manageriale',
|
||||||
pay: 'Pagamento',
|
|
||||||
sessionWishes: 'Scrivi i tuoi desideri riguardo alla sessione',
|
|
||||||
successPayment: 'Pagamento Riuscito',
|
|
||||||
errorPayment: 'Errore di Pagamento',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'L\'indirizzo e-mail non è valido',
|
invalidEmail: 'L\'indirizzo e-mail non è valido',
|
||||||
emptyEmail: 'Inserisci l\'e-mail',
|
emptyEmail: 'Inserisci l\'e-mail',
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
export default {
|
export default {
|
||||||
accountMenu: {
|
accountMenu: {
|
||||||
sessions: 'Предстоящие и недавние сессии',
|
sessions: 'Предстоящие и недавние сессии',
|
||||||
rooms: 'Комнаты',
|
|
||||||
notifications: 'Уведомления',
|
notifications: 'Уведомления',
|
||||||
support: 'Служба поддержки',
|
support: 'Служба поддержки',
|
||||||
information: 'Юридическая информация',
|
information: 'Юридическая информация',
|
||||||
|
@ -43,29 +42,13 @@ export default {
|
||||||
addComment: 'Добавить новый',
|
addComment: 'Добавить новый',
|
||||||
commentPlaceholder: 'Ваш комментарий',
|
commentPlaceholder: 'Ваш комментарий',
|
||||||
clientComments: 'Комментарии клиента',
|
clientComments: 'Комментарии клиента',
|
||||||
coachComments: 'Комментарии эксперта'
|
coachComments: 'Комментарии коуча'
|
||||||
},
|
},
|
||||||
room: {
|
room: {
|
||||||
upcoming: 'Предстоящие комнаты',
|
upcoming: 'Предстоящие комнаты',
|
||||||
requested: 'Запрошенные комнаты',
|
requested: 'Запрошенные комнаты',
|
||||||
recent: 'Недавние комнаты',
|
recent: 'Недавние комнаты',
|
||||||
newRoom: 'Новая комната',
|
newRoom: 'Новая комната'
|
||||||
editRoom: 'Изменить комнату',
|
|
||||||
date: 'Дата',
|
|
||||||
time: 'Время',
|
|
||||||
maxParticipants: 'Макс. кол-во участников',
|
|
||||||
presenceOfSupervisor: 'Присутствие супервизора',
|
|
||||||
supervisor: 'Супервайзер',
|
|
||||||
members: 'Участники',
|
|
||||||
participants: 'Участники',
|
|
||||||
roomCreator: 'Создатель комнаты',
|
|
||||||
inviteSupervisor: 'Пригласить супервизора',
|
|
||||||
joinSupervisor: 'Присоединиться как супервизор',
|
|
||||||
inviteParticipant: 'Пригласить участника',
|
|
||||||
joinParticipant: 'Присоединиться как участник',
|
|
||||||
rapport: 'Раппорт',
|
|
||||||
invite: 'Пригласить',
|
|
||||||
save: 'Сохранить комнату'
|
|
||||||
},
|
},
|
||||||
agreementText: 'Я прочитал и согласен с условиями Пользовательского соглашения,',
|
agreementText: 'Я прочитал и согласен с условиями Пользовательского соглашения,',
|
||||||
userAgreement: 'Пользовательского соглашения',
|
userAgreement: 'Пользовательского соглашения',
|
||||||
|
@ -128,9 +111,9 @@ export default {
|
||||||
courses: 'Курсы',
|
courses: 'Курсы',
|
||||||
mba: 'Информация о MBA',
|
mba: 'Информация о MBA',
|
||||||
experiences: 'Практический опыт',
|
experiences: 'Практический опыт',
|
||||||
aboutCoach: 'Информация об эксперте',
|
aboutCoach: 'О коуче',
|
||||||
education: 'Образование',
|
education: 'Образование',
|
||||||
coaching: 'Профиль эксперта',
|
coaching: 'Коучинг',
|
||||||
payInfo: 'Платежная информация',
|
payInfo: 'Платежная информация',
|
||||||
sessionDuration: 'Продолжительность сессии',
|
sessionDuration: 'Продолжительность сессии',
|
||||||
experienceHours: 'Общее количество часов практического опыта',
|
experienceHours: 'Общее количество часов практического опыта',
|
||||||
|
@ -143,7 +126,6 @@ export default {
|
||||||
workTime: 'Рабочее время',
|
workTime: 'Рабочее время',
|
||||||
startAt: 'Начало в',
|
startAt: 'Начало в',
|
||||||
finishAt: 'Завершение в',
|
finishAt: 'Завершение в',
|
||||||
day: 'День',
|
|
||||||
addWorkingHours: 'Добавить рабочие часы',
|
addWorkingHours: 'Добавить рабочие часы',
|
||||||
specialisation: 'Специализация',
|
specialisation: 'Специализация',
|
||||||
selectSpecialisation: 'Выберите свою специализацию для продолжения',
|
selectSpecialisation: 'Выберите свою специализацию для продолжения',
|
||||||
|
@ -163,10 +145,6 @@ export default {
|
||||||
saturday: 'Сб',
|
saturday: 'Сб',
|
||||||
addNew: 'Добавить',
|
addNew: 'Добавить',
|
||||||
mExperiences: 'Управленческий опыт',
|
mExperiences: 'Управленческий опыт',
|
||||||
pay: 'Оплата',
|
|
||||||
sessionWishes: 'Напишите свои пожелания по поводу сессии',
|
|
||||||
successPayment: 'Успешная оплата',
|
|
||||||
errorPayment: 'Ошибка оплаты',
|
|
||||||
errors: {
|
errors: {
|
||||||
invalidEmail: 'Адрес электронной почты недействителен',
|
invalidEmail: 'Адрес электронной почты недействителен',
|
||||||
emptyEmail: 'Пожалуйста, введите ваш E-mail',
|
emptyEmail: 'Пожалуйста, введите ваш E-mail',
|
||||||
|
|
|
@ -1,11 +0,0 @@
|
||||||
import "server-only";
|
|
||||||
|
|
||||||
import Stripe from "stripe";
|
|
||||||
|
|
||||||
export const stripe = new Stripe(process.env.STRIPE_SECRET_KEY as string, {
|
|
||||||
apiVersion: "2024-06-20",
|
|
||||||
appInfo: {
|
|
||||||
name: "bbuddy-ui",
|
|
||||||
url: "",
|
|
||||||
},
|
|
||||||
});
|
|
|
@ -668,7 +668,6 @@ a {
|
||||||
& > div {
|
& > div {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
padding-left: 1px;
|
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
@ -109,11 +109,10 @@ textarea {
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-avatar {
|
.user-avatar {
|
||||||
display: grid;
|
display: flex;
|
||||||
gap: 16px;
|
gap: 16px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
grid-template-columns: 100px auto;
|
|
||||||
|
|
||||||
&__edit {
|
&__edit {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
@ -82,13 +82,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__users-list__content {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 40px;
|
|
||||||
gap: 24px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-modal-mask {
|
.ant-modal-mask {
|
||||||
|
|
|
@ -931,10 +931,6 @@
|
||||||
&.chosen {
|
&.chosen {
|
||||||
color: #D93E5C;
|
color: #D93E5C;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.history {
|
|
||||||
color: #c4c4c4;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1399,7 +1395,6 @@
|
||||||
background-position: 99% 50%;
|
background-position: 99% 50%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border-radius: 8px;
|
|
||||||
|
|
||||||
&__title {
|
&__title {
|
||||||
color: #FFBD00;
|
color: #FFBD00;
|
||||||
|
@ -1426,16 +1421,6 @@
|
||||||
background: #C4DFE6;
|
background: #C4DFE6;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-item {
|
|
||||||
display: grid;
|
|
||||||
gap: 8px;
|
|
||||||
grid-template-columns: 80px 1fr 1fr 32px;
|
|
||||||
|
|
||||||
&__single {
|
|
||||||
grid-template-columns: 80px 1fr 1fr;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&__inner{
|
&__inner{
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -1452,7 +1437,6 @@
|
||||||
&__wrap {
|
&__wrap {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
.btn-cancel,
|
.btn-cancel,
|
||||||
.btn-edit {
|
.btn-edit {
|
||||||
|
|
|
@ -2,12 +2,9 @@
|
||||||
&__wrap {
|
&__wrap {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 716px;
|
height: 716px;
|
||||||
|
border-radius: 16px;
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
&__single {
|
|
||||||
border-radius: 16px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&__container {
|
&__container {
|
||||||
|
@ -28,16 +25,6 @@
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
|
||||||
&_group {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
background: rgba(0, 59, 70, 0.4);
|
|
||||||
padding: 16px;
|
|
||||||
border-radius: 16px;
|
|
||||||
margin-top: 24px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&__controls {
|
&__controls {
|
||||||
|
@ -139,48 +126,6 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
&_groups {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
gap: 16px;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
& > div {
|
|
||||||
border-radius: 16px;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
video {
|
|
||||||
object-fit: contain !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.gr-1 {
|
|
||||||
& > div {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.gr-2, &.gr-3, &.gr-4 {
|
|
||||||
& > div {
|
|
||||||
flex: calc((100% - 16px) / 2) 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.gr-5, &.gr-6, &.gr-7, &.gr-8, &.gr-9 {
|
|
||||||
& > div {
|
|
||||||
flex: calc((100% - 16px * 2) / 3) 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.gr-10, &.gr-11, &.gr-12, &.gr-13, &.gr-14, &.gr-15, &.gr-16 {
|
|
||||||
& > div {
|
|
||||||
flex: calc((100% - 16px * 3) / 4) 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&__video {
|
&__video {
|
||||||
|
|
|
@ -18,11 +18,6 @@
|
||||||
background: lightgray 50%;
|
background: lightgray 50%;
|
||||||
box-shadow: 0 8px 16px 0 rgba(102, 165, 173, 0.32);
|
box-shadow: 0 8px 16px 0 rgba(102, 165, 173, 0.32);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
&_small {
|
|
||||||
width: 86px;
|
|
||||||
height: 86px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&__inner {
|
&__inner {
|
||||||
|
@ -46,17 +41,6 @@
|
||||||
line-height: 120%;
|
line-height: 120%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__supervisor-comment {
|
|
||||||
width: 100%;
|
|
||||||
background: #E4F5FA;
|
|
||||||
padding: 8px;
|
|
||||||
border-radius: 0 8px 8px 8px;
|
|
||||||
color: #66A5AD;
|
|
||||||
@include rem(13);
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 120%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&__comments {
|
&__comments {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -216,31 +200,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__filled {
|
|
||||||
user-select: none;
|
|
||||||
outline: none !important;
|
|
||||||
border: none !important;
|
|
||||||
text-decoration: none;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 8px !important;
|
|
||||||
background: #66A5AD !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
display: flex;
|
|
||||||
height: 54px !important;
|
|
||||||
padding: 15px 24px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: #fff !important;
|
|
||||||
@include rem(15);
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 160%;
|
|
||||||
|
|
||||||
&:hover, &:active {
|
|
||||||
color: #fff !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&__header {
|
&__header {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding-bottom: 8px;
|
padding-bottom: 8px;
|
||||||
|
@ -309,54 +268,6 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__profile {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 16px;
|
|
||||||
padding-top: 16px;
|
|
||||||
align-items: flex-start;
|
|
||||||
border-top: 1px solid #C4DFE6;
|
|
||||||
|
|
||||||
&_title {
|
|
||||||
width: 100%;
|
|
||||||
gap: 16px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
div {
|
|
||||||
@include rem(18);
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: 150%;
|
|
||||||
color: #6FB98F;
|
|
||||||
|
|
||||||
&:first-child {
|
|
||||||
color: #003B46;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&_list {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&_item {
|
|
||||||
display: flex;
|
|
||||||
gap: 16px;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
.card-detail__inner {
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-detail__name {
|
|
||||||
color: #2C7873;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&__footer {
|
&__footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
|
|
|
@ -1,61 +0,0 @@
|
||||||
.b-calendar {
|
|
||||||
padding: 44px 40px !important;
|
|
||||||
|
|
||||||
&-month {
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-header {
|
|
||||||
justify-content: center;
|
|
||||||
border-bottom: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-cell {
|
|
||||||
span {
|
|
||||||
color: #66A5AD;
|
|
||||||
}
|
|
||||||
|
|
||||||
&__weekend {
|
|
||||||
span {
|
|
||||||
color: #FFBD00;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-body {
|
|
||||||
margin-bottom: -42px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-panel {
|
|
||||||
border-top: none !important;
|
|
||||||
margin-top: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-cell {
|
|
||||||
opacity: 0 !important;
|
|
||||||
|
|
||||||
&-disabled {
|
|
||||||
&::before {
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
color: rgba(0, 0, 0, 0.25) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.ant-picker-cell-in-view {
|
|
||||||
opacity: 1 !important;
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
th, td {
|
|
||||||
vertical-align: middle !important;
|
|
||||||
height: 40px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
|
||||||
color: #66A5AD !important;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,128 +0,0 @@
|
||||||
.b-datepicker {
|
|
||||||
width: 100% !important;
|
|
||||||
height: 54px !important;
|
|
||||||
|
|
||||||
&.ant-picker-filled {
|
|
||||||
background: transparent !important;
|
|
||||||
z-index: 1;
|
|
||||||
padding-top: 22px !important;
|
|
||||||
padding-left: 16px !important;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-color: #2c7873 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-input {
|
|
||||||
input {
|
|
||||||
font-size: 14px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-suffix {
|
|
||||||
margin-top: -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-wrap {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #F8F8F7;
|
|
||||||
border-radius: 8px;
|
|
||||||
|
|
||||||
&.b-datepicker__active .b-datepicker-label {
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 300;
|
|
||||||
line-height: 14px;
|
|
||||||
top: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-label {
|
|
||||||
font-size: 14px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 24px;
|
|
||||||
color: #000;
|
|
||||||
opacity: .3;
|
|
||||||
position: absolute;
|
|
||||||
left: 16px;
|
|
||||||
top: 15px;
|
|
||||||
right: 22px;
|
|
||||||
z-index: 0;
|
|
||||||
transition: all .1s ease;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
span {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-popup {
|
|
||||||
padding: 16px !important;
|
|
||||||
|
|
||||||
.ant-picker-date-panel {
|
|
||||||
padding: 16px 8px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-header-view {
|
|
||||||
color: #2c7873 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-header {
|
|
||||||
border: none !important;
|
|
||||||
|
|
||||||
.ant-picker-header-super-prev-btn, .ant-picker-header-super-next-btn {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-cell {
|
|
||||||
opacity: 0 !important;
|
|
||||||
padding: 0 !important;
|
|
||||||
|
|
||||||
&:not(.ant-picker-cell-disabled) {
|
|
||||||
color: #66A5AD !important;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
.ant-picker-cell-inner {
|
|
||||||
color: #6FB98F !important;
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-selected:not(.ant-picker-cell-disabled) .ant-picker-cell-inner {
|
|
||||||
color: #6FB98F !important;
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-disabled {
|
|
||||||
color: rgba(0, 0, 0, 0.25) !important;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.ant-picker-cell-in-view {
|
|
||||||
opacity: 1 !important;
|
|
||||||
background: transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-cell-inner::before {
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
th, td {
|
|
||||||
vertical-align: middle !important;
|
|
||||||
height: 36px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
|
||||||
color: #66A5AD !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,3 +0,0 @@
|
||||||
.ant-form-item-has-error .ant-radio-inner {
|
|
||||||
border-color: #ff4d4f !important;
|
|
||||||
}
|
|
|
@ -1,86 +0,0 @@
|
||||||
.card-room {
|
|
||||||
&__details {
|
|
||||||
width: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 120px auto;
|
|
||||||
gap: 4px 8px;
|
|
||||||
|
|
||||||
div {
|
|
||||||
@include rem(13);
|
|
||||||
font-weight: 500;
|
|
||||||
line-height: 120%;
|
|
||||||
color: #2C7873;
|
|
||||||
|
|
||||||
&:nth-child(2n) {
|
|
||||||
color: #6FB98F;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.b-users-list {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 24px;
|
|
||||||
padding: 0 16px;
|
|
||||||
|
|
||||||
&__empty {
|
|
||||||
color: gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-item {
|
|
||||||
padding: 0 0 16px;
|
|
||||||
border-bottom: 1px solid #C4DFE6;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 16px;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
border-bottom: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div {
|
|
||||||
display: flex;
|
|
||||||
gap: 16px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.b-room-form {
|
|
||||||
&__grid {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(2, 1fr);
|
|
||||||
gap: 16px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-form-item {
|
|
||||||
margin-bottom: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-detail__apply {
|
|
||||||
align-self: flex-start;
|
|
||||||
}
|
|
||||||
|
|
||||||
.b-room-switch {
|
|
||||||
label {
|
|
||||||
margin-right: 24px;
|
|
||||||
&:after {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div {
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-select-item-option-content {
|
|
||||||
span {
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,31 +0,0 @@
|
||||||
.b-schedule {
|
|
||||||
&-time {
|
|
||||||
padding: 44px 40px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 24px;
|
|
||||||
|
|
||||||
.b-button-link-big {
|
|
||||||
font-size: 24px;
|
|
||||||
line-height: 32px;
|
|
||||||
color: #6FB98F !important;
|
|
||||||
font-family: var(--font-comfortaa);
|
|
||||||
padding: 0 !important;
|
|
||||||
border: none !important;
|
|
||||||
text-transform: capitalize;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-radio-list {
|
|
||||||
.ant-radio-group {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-payment {
|
|
||||||
padding: 44px 40px;
|
|
||||||
min-height: 300px;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -3,12 +3,11 @@
|
||||||
height: 54px !important;
|
height: 54px !important;
|
||||||
|
|
||||||
.ant-select-selector {
|
.ant-select-selector {
|
||||||
background-color: transparent !important;
|
background-color: #F8F8F7 !important;
|
||||||
border-color: #F8F8F7 !important;
|
border-color: #F8F8F7 !important;
|
||||||
border-radius: 8px !important;
|
border-radius: 8px !important;
|
||||||
padding: 22px 16px 8px !important;
|
padding: 22px 16px 8px !important;
|
||||||
box-shadow: none !important;
|
box-shadow: none !important;
|
||||||
z-index: 1;
|
|
||||||
|
|
||||||
.ant-select-selection-item {
|
.ant-select-selection-item {
|
||||||
font-size: 15px !important;
|
font-size: 15px !important;
|
||||||
|
@ -18,12 +17,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.ant-select-status-error {
|
|
||||||
.ant-select-selector {
|
|
||||||
border-color: #ff4d4f !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-select-selection-overflow-item {
|
.ant-select-selection-overflow-item {
|
||||||
margin-right: 4px;
|
margin-right: 4px;
|
||||||
}
|
}
|
||||||
|
@ -42,9 +35,6 @@
|
||||||
&-wrap {
|
&-wrap {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #F8F8F7;
|
|
||||||
border-radius: 8px;
|
|
||||||
|
|
||||||
&.b-multiselect__active .b-multiselect-label {
|
&.b-multiselect__active .b-multiselect-label {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
|
@ -54,24 +44,17 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&-label {
|
&-label {
|
||||||
font-size: 14px;
|
font-size: 15px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
color: #000;
|
color: #000;
|
||||||
opacity: .4;
|
opacity: .3;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 16px;
|
left: 16px;
|
||||||
top: 15px;
|
top: 15px;
|
||||||
right: 22px;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
transition: all .1s ease;
|
transition: all .1s ease;
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
span {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -80,12 +63,11 @@
|
||||||
height: 54px !important;
|
height: 54px !important;
|
||||||
|
|
||||||
.ant-select-selector {
|
.ant-select-selector {
|
||||||
background-color: transparent !important;
|
background-color: #F8F8F7 !important;
|
||||||
border-color: #F8F8F7 !important;
|
border-color: #F8F8F7 !important;
|
||||||
border-radius: 8px !important;
|
border-radius: 8px !important;
|
||||||
padding: 22px 16px 8px !important;
|
padding: 22px 16px 8px !important;
|
||||||
box-shadow: none !important;
|
box-shadow: none !important;
|
||||||
z-index: 1;
|
|
||||||
|
|
||||||
.ant-select-selection-item {
|
.ant-select-selection-item {
|
||||||
font-size: 15px !important;
|
font-size: 15px !important;
|
||||||
|
@ -95,12 +77,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.ant-select-status-error {
|
|
||||||
.ant-select-selector {
|
|
||||||
border-color: #ff4d4f !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-select-arrow {
|
.ant-select-arrow {
|
||||||
color: #2c7873 !important;
|
color: #2c7873 !important;
|
||||||
}
|
}
|
||||||
|
@ -115,8 +91,6 @@
|
||||||
&-wrap {
|
&-wrap {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #F8F8F7;
|
|
||||||
border-radius: 8px;
|
|
||||||
|
|
||||||
&.b-select__active .b-select-label {
|
&.b-select__active .b-select-label {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
@ -132,18 +106,11 @@
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
color: #000;
|
color: #000;
|
||||||
opacity: .4;
|
opacity: .3;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 16px;
|
left: 16px;
|
||||||
top: 15px;
|
top: 15px;
|
||||||
right: 22px;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
transition: all .1s ease;
|
transition: all .1s ease;
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
span {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,59 +0,0 @@
|
||||||
.b-timepicker {
|
|
||||||
width: 100% !important;
|
|
||||||
height: 54px !important;
|
|
||||||
|
|
||||||
&.ant-picker-filled {
|
|
||||||
background: transparent !important;
|
|
||||||
z-index: 1;
|
|
||||||
padding-top: 22px !important;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-color: #2c7873 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-input {
|
|
||||||
input {
|
|
||||||
font-size: 14px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ant-picker-suffix {
|
|
||||||
margin-top: -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-wrap {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #F8F8F7;
|
|
||||||
border-radius: 8px;
|
|
||||||
|
|
||||||
&.b-timepicker__active .b-timepicker-label {
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 300;
|
|
||||||
line-height: 14px;
|
|
||||||
top: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-label {
|
|
||||||
font-size: 14px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 24px;
|
|
||||||
color: #000;
|
|
||||||
opacity: .3;
|
|
||||||
position: absolute;
|
|
||||||
left: 16px;
|
|
||||||
top: 15px;
|
|
||||||
right: 22px;
|
|
||||||
z-index: 0;
|
|
||||||
transition: all .1s ease;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
span {
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -8,9 +8,3 @@
|
||||||
@import "_buttons.scss";
|
@import "_buttons.scss";
|
||||||
@import "_practice.scss";
|
@import "_practice.scss";
|
||||||
@import "_collapse.scss";
|
@import "_collapse.scss";
|
||||||
@import "_timepicker.scss";
|
|
||||||
@import "_datepicker.scss";
|
|
||||||
@import "_calendar.scss";
|
|
||||||
@import "_schedule.scss";
|
|
||||||
@import "_radio.scss";
|
|
||||||
@import "_room.scss";
|
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import type { ChainModifiers, Entry, EntryFieldTypes, EntrySkeletonType, LocaleCode } from 'contentful'
|
import type { ChainModifiers, Entry, EntryFieldTypes, EntrySkeletonType, LocaleCode } from 'contentful'
|
||||||
|
import {BlogPostFields} from "./blogPost";
|
||||||
import {ContentImage} from "../lib/contentful/contentImage";
|
import {ContentImage} from "../lib/contentful/contentImage";
|
||||||
|
|
||||||
export interface AuthorFields {
|
export interface AuthorFields {
|
||||||
|
|
|
@ -70,24 +70,3 @@ export type ExpertDetails = {
|
||||||
associations?: Association[];
|
associations?: Association[];
|
||||||
associationLevels?: AssociationLevel[];
|
associationLevels?: AssociationLevel[];
|
||||||
};
|
};
|
||||||
|
|
||||||
export type Slot = {
|
|
||||||
startTime: string;
|
|
||||||
endTime: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export type ExpertScheduler = {
|
|
||||||
tags: Tag[],
|
|
||||||
availableSlots: Slot[];
|
|
||||||
}
|
|
||||||
|
|
||||||
export type ExpertSchedulerSession = {
|
|
||||||
sessionId: string
|
|
||||||
};
|
|
||||||
|
|
||||||
export type SignupSessionData = {
|
|
||||||
coachId: number,
|
|
||||||
tagId?: number,
|
|
||||||
startAtUtc?: string,
|
|
||||||
clientComment?: string
|
|
||||||
};
|
|
|
@ -1,3 +0,0 @@
|
||||||
export type Payment = {
|
|
||||||
amount: number;
|
|
||||||
}
|
|
|
@ -1,7 +1,8 @@
|
||||||
import { EducationDTO } from './education';
|
import { UploadFile } from 'antd';
|
||||||
import { ExpertsTags } from './tags';
|
import {EducationDTO} from "./education";
|
||||||
import { PracticeDTO } from './practice';
|
import {ExpertsTags} from "./tags";
|
||||||
import { ScheduleDTO } from './schedule';
|
import {PracticeDTO} from "./practice";
|
||||||
|
import {ScheduleDTO} from "./schedule";
|
||||||
|
|
||||||
export type ProfileData = {
|
export type ProfileData = {
|
||||||
username?: string;
|
username?: string;
|
||||||
|
@ -27,7 +28,7 @@ export type ProfileRequest = {
|
||||||
languagesLinks?: { languageId: number }[];
|
languagesLinks?: { languageId: number }[];
|
||||||
username?: string;
|
username?: string;
|
||||||
surname?: string;
|
surname?: string;
|
||||||
faceImage?: any;
|
faceImage?: UploadFile;
|
||||||
isFaceImageKeepExisting?: boolean;
|
isFaceImageKeepExisting?: boolean;
|
||||||
phone?: string;
|
phone?: string;
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,44 +0,0 @@
|
||||||
import { PublicUser, Session, SessionState } from './sessions';
|
|
||||||
import { Tag } from './tags';
|
|
||||||
import { Slot } from './experts';
|
|
||||||
|
|
||||||
export enum RoomsType {
|
|
||||||
UPCOMING = 'upcoming',
|
|
||||||
RECENT = 'recent',
|
|
||||||
NEW = 'new',
|
|
||||||
}
|
|
||||||
|
|
||||||
export type Record = {
|
|
||||||
id: number;
|
|
||||||
sessionId: number;
|
|
||||||
sid?: string;
|
|
||||||
resourceId?: string;
|
|
||||||
readyForLoad?: boolean;
|
|
||||||
cname?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export type Room = Session & { recordings?: Record[] };
|
|
||||||
|
|
||||||
export type GetUsersForRooms = {
|
|
||||||
items?: PublicUser[],
|
|
||||||
isTooManyResults?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export type RoomEdit = {
|
|
||||||
id: number,
|
|
||||||
scheduledStartAtUtc?: string,
|
|
||||||
scheduledEndAtUtc?: string,
|
|
||||||
state?: SessionState,
|
|
||||||
cost?: number,
|
|
||||||
maxClients?: number,
|
|
||||||
title?: string,
|
|
||||||
description?: string,
|
|
||||||
isNeedSupervisor?: boolean,
|
|
||||||
tagIds?: number[]
|
|
||||||
};
|
|
||||||
|
|
||||||
export type RoomEditDTO = {
|
|
||||||
item: RoomEdit;
|
|
||||||
tags?: Tag[];
|
|
||||||
availableSlots: Slot[];
|
|
||||||
};
|
|
|
@ -3,15 +3,8 @@ export type WorkingTime = {
|
||||||
startTimeUtc?: number,
|
startTimeUtc?: number,
|
||||||
endDayOfWeekUtc?: string,
|
endDayOfWeekUtc?: string,
|
||||||
endTimeUtc?: number
|
endTimeUtc?: number
|
||||||
};
|
}
|
||||||
|
|
||||||
export interface ScheduleDTO {
|
export interface ScheduleDTO {
|
||||||
workingTimes?: WorkingTime[]
|
workingTimes?: WorkingTime[]
|
||||||
}
|
}
|
||||||
|
|
||||||
export type MapWorkingTime = {
|
|
||||||
startDay?: string;
|
|
||||||
startTimeMin?: number;
|
|
||||||
endDay?: string;
|
|
||||||
endTimeMin?: number;
|
|
||||||
};
|
|
||||||
|
|
|
@ -6,8 +6,6 @@ export type PublicUser = {
|
||||||
name?: string;
|
name?: string;
|
||||||
surname?: string;
|
surname?: string;
|
||||||
faceImageUrl?: string;
|
faceImageUrl?: string;
|
||||||
coachBotId?: number;
|
|
||||||
parentId?: number;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// type User = {
|
// type User = {
|
||||||
|
@ -150,7 +148,6 @@ export type Session = {
|
||||||
themesTags?: SessionTag[];
|
themesTags?: SessionTag[];
|
||||||
coachComments?: SessionComment[];
|
coachComments?: SessionComment[];
|
||||||
clientComments?: SessionComment[];
|
clientComments?: SessionComment[];
|
||||||
creatorId?: number;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export enum SessionType {
|
export enum SessionType {
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { message } from 'antd';
|
||||||
import type { UploadFile } from 'antd';
|
import type { UploadFile } from 'antd';
|
||||||
import { i18nText } from '../i18nKeys';
|
import { i18nText } from '../i18nKeys';
|
||||||
|
|
||||||
const ROUTES = ['sessions', 'rooms', 'notifications', 'support', 'information', 'settings', 'messages', 'expert-profile'];
|
const ROUTES = ['sessions', 'notifications', 'support', 'information', 'settings', 'messages', 'expert-profile'];
|
||||||
const COUNTS: Record<string, number> = {
|
const COUNTS: Record<string, number> = {
|
||||||
sessions: 12,
|
sessions: 12,
|
||||||
notifications: 5,
|
notifications: 5,
|
||||||
|
|
|
@ -1,12 +0,0 @@
|
||||||
import { Stripe, loadStripe } from '@stripe/stripe-js';
|
|
||||||
|
|
||||||
let stripePromise: Promise<Stripe | null>;
|
|
||||||
|
|
||||||
export default function getStripe(): Promise<Stripe | null> {
|
|
||||||
if (!stripePromise)
|
|
||||||
stripePromise = loadStripe(
|
|
||||||
process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY as string,
|
|
||||||
);
|
|
||||||
|
|
||||||
return stripePromise;
|
|
||||||
}
|
|
|
@ -1,28 +0,0 @@
|
||||||
import locale_ru from 'antd/lib/calendar/locale/ru_RU';
|
|
||||||
import locale_en from 'antd/lib/calendar/locale/en_GB';
|
|
||||||
import locale_de from 'antd/lib/calendar/locale/de_DE';
|
|
||||||
import locale_it from 'antd/lib/calendar/locale/it_IT';
|
|
||||||
import locale_es from 'antd/lib/calendar/locale/es_ES';
|
|
||||||
import locale_fr from 'antd/lib/calendar/locale/fr_FR';
|
|
||||||
|
|
||||||
// for calendars
|
|
||||||
export const getLocale = (locale: string) => {
|
|
||||||
if (locale) {
|
|
||||||
switch (locale) {
|
|
||||||
case 'ru':
|
|
||||||
return locale_ru;
|
|
||||||
case 'de':
|
|
||||||
return locale_de;
|
|
||||||
case 'fr':
|
|
||||||
return locale_fr;
|
|
||||||
case 'it':
|
|
||||||
return locale_it;
|
|
||||||
case 'es':
|
|
||||||
return locale_es;
|
|
||||||
default:
|
|
||||||
return locale_en;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return locale_en;
|
|
||||||
};
|
|
|
@ -1,30 +0,0 @@
|
||||||
export function formatAmountForDisplay(
|
|
||||||
amount: number,
|
|
||||||
currency: string,
|
|
||||||
): string {
|
|
||||||
let numberFormat = new Intl.NumberFormat(["en-US"], {
|
|
||||||
style: "currency",
|
|
||||||
currency: currency,
|
|
||||||
currencyDisplay: "symbol",
|
|
||||||
});
|
|
||||||
return numberFormat.format(amount);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function formatAmountForStripe(
|
|
||||||
amount: number,
|
|
||||||
currency: string,
|
|
||||||
): number {
|
|
||||||
let numberFormat = new Intl.NumberFormat(["en-US"], {
|
|
||||||
style: "currency",
|
|
||||||
currency: currency,
|
|
||||||
currencyDisplay: "symbol",
|
|
||||||
});
|
|
||||||
const parts = numberFormat.formatToParts(amount);
|
|
||||||
let zeroDecimalCurrency: boolean = true;
|
|
||||||
for (let part of parts) {
|
|
||||||
if (part.type === "decimal") {
|
|
||||||
zeroDecimalCurrency = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return zeroDecimalCurrency ? amount : Math.round(amount * 100);
|
|
||||||
}
|
|
|
@ -1,24 +1,16 @@
|
||||||
import { MapWorkingTime, WorkingTime } from '../types/schedule';
|
import dayjs from 'dayjs';
|
||||||
|
import { WorkingTime } from '../types/schedule';
|
||||||
|
|
||||||
export const WEEK_DAY = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
|
const WEEK_DAY = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
|
||||||
const MAX_DAY_TIME = 24 * 60; // min
|
const MAX_DAY_TIME = 24 * 60; // min
|
||||||
|
|
||||||
const addWeekDay = (weekDay?: string): string => {
|
export const getCurrentTime = (data: WorkingTime) => {
|
||||||
const ind = weekDay ? WEEK_DAY.indexOf(weekDay) + 1 : 0;
|
|
||||||
return WEEK_DAY[ind >= WEEK_DAY.length ? 0 : ind];
|
|
||||||
}
|
|
||||||
|
|
||||||
const subWeekDay = (weekDay?: string): string => {
|
|
||||||
const ind = weekDay ? WEEK_DAY.indexOf(weekDay) - 1 : 0;
|
|
||||||
return WEEK_DAY[ind < 0 ? WEEK_DAY.length - 1 : ind];
|
|
||||||
}
|
|
||||||
|
|
||||||
export const getCurrentTime = (data: WorkingTime, timeZone: string): MapWorkingTime => {
|
|
||||||
let startDay = data.startDayOfWeekUtc;
|
let startDay = data.startDayOfWeekUtc;
|
||||||
let endDay = data.endDayOfWeekUtc;
|
let endDay = data.endDayOfWeekUtc;
|
||||||
|
const currentTimeZone = dayjs().format('Z');
|
||||||
const startUtc = data.startTimeUtc / (1000 * 1000 * 60);
|
const startUtc = data.startTimeUtc / (1000 * 1000 * 60);
|
||||||
const endUtc = data.endTimeUtc / (1000 * 1000 * 60);
|
const endUtc = data.endTimeUtc / (1000 * 1000 * 60);
|
||||||
const matches = timeZone.match(/(\+|-)([0-9]{2}):([0-9]{2})/) || [];
|
const matches = currentTimeZone.match(/(\+|-)([0-9]{2}):([0-9]{2})/);
|
||||||
const sign = matches[1];
|
const sign = matches[1];
|
||||||
const h = matches[2];
|
const h = matches[2];
|
||||||
const m = matches[3];
|
const m = matches[3];
|
||||||
|
@ -37,186 +29,34 @@ export const getCurrentTime = (data: WorkingTime, timeZone: string): MapWorkingT
|
||||||
endMin = endUtc - (Number(h) * 60) - Number(m);
|
endMin = endUtc - (Number(h) * 60) - Number(m);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (startMin >= MAX_DAY_TIME) {
|
if (startMin > MAX_DAY_TIME) {
|
||||||
startMin = 0;
|
startMin = startMin - MAX_DAY_TIME;
|
||||||
// startMin = startMin - MAX_DAY_TIME;
|
const ind = startDay ? WEEK_DAY.indexOf(startDay) + 1 : 0;
|
||||||
// const ind = startDay ? WEEK_DAY.indexOf(startDay) + 1 : 0;
|
startDay = WEEK_DAY[ind >= WEEK_DAY.length ? 0 : ind];
|
||||||
// startDay = WEEK_DAY[ind >= WEEK_DAY.length ? 0 : ind];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (endMin >= MAX_DAY_TIME) {
|
if (endMin > MAX_DAY_TIME) {
|
||||||
endMin = 0;
|
endMin = endMin - MAX_DAY_TIME;
|
||||||
// endMin = endMin - MAX_DAY_TIME;
|
const ind = endDay ? WEEK_DAY.indexOf(endDay) + 1 : 0;
|
||||||
// const ind = endDay ? WEEK_DAY.indexOf(endDay) + 1 : 0;
|
endDay = WEEK_DAY[ind >= WEEK_DAY.length ? 0 : ind];
|
||||||
// endDay = WEEK_DAY[ind >= WEEK_DAY.length ? 0 : ind];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (startMin <= 0) {
|
if (startMin <= 0) {
|
||||||
startMin = 0;
|
startMin = MAX_DAY_TIME - startMin;
|
||||||
// startMin = MAX_DAY_TIME - startMin;
|
const ind = startDay ? WEEK_DAY.indexOf(startDay) - 1 : 0;
|
||||||
// const ind = startDay ? WEEK_DAY.indexOf(startDay) - 1 : 0;
|
startDay = WEEK_DAY[ind < 0 ? WEEK_DAY.length - 1 : ind];
|
||||||
// startDay = WEEK_DAY[ind < 0 ? WEEK_DAY.length - 1 : ind];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (endMin <= 0) {
|
if (endMin <= 0) {
|
||||||
endMin = 0;
|
endMin = MAX_DAY_TIME - endMin;
|
||||||
// endMin = MAX_DAY_TIME - endMin;
|
const ind = endDay ? WEEK_DAY.indexOf(endDay) - 1 : 0;
|
||||||
// const ind = endDay ? WEEK_DAY.indexOf(endDay) - 1 : 0;
|
endDay = WEEK_DAY[ind < 0 ? WEEK_DAY.length - 1 : ind];
|
||||||
// endDay = WEEK_DAY[ind < 0 ? WEEK_DAY.length - 1 : ind];
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
startDay,
|
startDay,
|
||||||
startTimeMin: startMin,
|
startTime: `${(startMin - startMin % 60)/60}:${startMin % 60 || '00'}`,
|
||||||
endDay: endDay,
|
endDay: endDay,
|
||||||
endTimeMin: endMin
|
endTime: `${(endMin - endMin % 60)/60}:${endMin % 60 || '00'}`
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getTimeString = (min: number) => {
|
|
||||||
const timeH = `${(min - min % 60)/60}`;
|
|
||||||
|
|
||||||
return `${timeH.length === 1 ? `0${timeH}` : timeH}:${min % 60 || '00'}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const formattedSchedule = (workingTimes: WorkingTime[], timeZone: string): MapWorkingTime[] => (
|
|
||||||
workingTimes.map((time) => getCurrentTime(time, timeZone)) || []
|
|
||||||
);
|
|
||||||
|
|
||||||
export const getNewTime = (time: string): number => {
|
|
||||||
const timeArr = time.split(':');
|
|
||||||
|
|
||||||
return Number(timeArr[0]) * 60 + Number(timeArr[1]);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const getTimeZoneOffset = (oldTime: string, newTime: string): { sign: string, offset: number } => {
|
|
||||||
// старая таймзона
|
|
||||||
const matches1 = oldTime.match(/(\+|-)([0-9]{2}):([0-9]{2})/) || [];
|
|
||||||
const sign1 = matches1[1];
|
|
||||||
const min1 = Number(matches1[2]) * 60 + Number(matches1[3]);
|
|
||||||
// новая таймзона
|
|
||||||
const matches2 = newTime.match(/(\+|-)([0-9]{2}):([0-9]{2})/) || [];
|
|
||||||
const sign2 = matches2[1];
|
|
||||||
const min2 = Number(matches2[2]) * 60 + Number(matches2[3]);
|
|
||||||
|
|
||||||
if (sign1 === '+' && sign2 === '+') {
|
|
||||||
if (min1 < min2) {
|
|
||||||
return {
|
|
||||||
sign: '+',
|
|
||||||
offset: min2 - min1
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
sign: '-',
|
|
||||||
offset: min1 - min2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (sign1 === '-' && sign2 === '-') {
|
|
||||||
if (min1 < min2) {
|
|
||||||
return {
|
|
||||||
sign: '-',
|
|
||||||
offset: min2 - min1
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
sign: '+',
|
|
||||||
offset: min1 - min2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (sign1 === '+' && sign2 === '-') {
|
|
||||||
return {
|
|
||||||
sign: '-',
|
|
||||||
offset: min1 + min2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (sign1 === '-' && sign2 === '+') {
|
|
||||||
return {
|
|
||||||
sign: '+',
|
|
||||||
offset: min1 + min2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export const formattedTimeByOffset = (workTime: MapWorkingTime, objOffset: { sign: string, offset: number }): MapWorkingTime => {
|
|
||||||
if (objOffset.sign === '+') {
|
|
||||||
const resStartMin = workTime.startTimeMin + objOffset.offset;
|
|
||||||
const resEndMin = workTime.endTimeMin ? workTime.endTimeMin + objOffset.offset : workTime.endTimeMin;
|
|
||||||
|
|
||||||
return {
|
|
||||||
...workTime,
|
|
||||||
startTimeMin: resStartMin >= MAX_DAY_TIME ? 0 : resStartMin,
|
|
||||||
endTimeMin: resEndMin >= MAX_DAY_TIME ? 0 : resEndMin
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (objOffset.sign === '-') {
|
|
||||||
const resStartMin = workTime.startTimeMin - objOffset.offset;
|
|
||||||
const resEndMin = workTime.endTimeMin ? workTime.endTimeMin - objOffset.offset : workTime.endTimeMin;
|
|
||||||
|
|
||||||
return {
|
|
||||||
...workTime,
|
|
||||||
startTimeMin: resStartMin < 0 ? 0 : resStartMin,
|
|
||||||
endTimeMin: resEndMin < 0 ? 0 : resEndMin
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return workTime;
|
|
||||||
};
|
|
||||||
|
|
||||||
const getResultTime = (data: MapWorkingTime, timeZone: string): WorkingTime => {
|
|
||||||
let startDayOfWeekUtc = data.startDay;
|
|
||||||
let endDayOfWeekUtc = data.startDay;
|
|
||||||
const matches = timeZone.match(/(\+|-)([0-9]{2}):([0-9]{2})/) || [];
|
|
||||||
const sign = matches[1];
|
|
||||||
const offset = (Number(matches[2]) * 60) + Number(matches[3]);
|
|
||||||
let startTime = data.startTimeMin;
|
|
||||||
let endTime = data.endTimeMin === 0 ? MAX_DAY_TIME : data.endTimeMin;
|
|
||||||
|
|
||||||
if (sign === '+') {
|
|
||||||
startTime = startTime - offset;
|
|
||||||
endTime = endTime - offset;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (sign === '-') {
|
|
||||||
startTime = startTime + offset;
|
|
||||||
endTime = endTime + offset;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (startTime >= MAX_DAY_TIME) {
|
|
||||||
startTime = startTime - MAX_DAY_TIME;
|
|
||||||
startDayOfWeekUtc = addWeekDay(startDayOfWeekUtc);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (endTime >= MAX_DAY_TIME) {
|
|
||||||
endTime = endTime - MAX_DAY_TIME;
|
|
||||||
endDayOfWeekUtc = addWeekDay(endDayOfWeekUtc);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (startTime < 0) {
|
|
||||||
startTime = MAX_DAY_TIME - Math.abs(startTime || 0);
|
|
||||||
startDayOfWeekUtc = subWeekDay(startDayOfWeekUtc);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (endTime < 0) {
|
|
||||||
endTime = MAX_DAY_TIME - Math.abs(endTime || 0);
|
|
||||||
endDayOfWeekUtc = subWeekDay(endDayOfWeekUtc);
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
startDayOfWeekUtc,
|
|
||||||
startTimeUtc: startTime * 1000 * 1000 * 60,
|
|
||||||
endDayOfWeekUtc,
|
|
||||||
endTimeUtc: endTime * 1000 * 1000 * 60
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
export const formattedWorkList = (workingList: MapWorkingTime[], timeZone: string): WorkingTime[] => (
|
|
||||||
workingList
|
|
||||||
.filter(({ startTimeMin, endTimeMin }) => !(!startTimeMin && !endTimeMin))
|
|
||||||
.map((time) => getResultTime(time, timeZone)) || []
|
|
||||||
);
|
|
||||||
|
|
Loading…
Reference in New Issue