Compare commits

..

1 Commits

Author SHA1 Message Date
norton81 6a9bed479a demo 2024-06-30 17:51:56 +03:00
223 changed files with 6570 additions and 13938 deletions

View File

@ -1,8 +0,0 @@
node_modules/
.next
.idea
Dockerfile
.dockerignore
npm-debug.log
README.md
.git

9
.env
View File

@ -1,9 +0,0 @@
NEXT_PUBLIC_SERVER_BASE_URL=https://api.bbuddy.expert/api
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_ACCESS_TOKEN = s99GWKfpDKkNwiEJ3pN7US_tmqsGvDlaex-sOJwpzuc
NEXT_PUBLIC_CONTENTFUL_PREVIEW_ACCESS_TOKEN = Z9WOKpLDbKNj7xVOmT_VXYNLH0AZwISFvQsq0PQlHfE

2
.gitignore vendored
View File

@ -38,3 +38,5 @@ yarn-error.log*
# typescript
*.tsbuildinfo
next-env.d.ts
certificates

View File

@ -1,23 +1,8 @@
FROM node:20.10.0 as dependencies
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci --verbose
FROM node:20.10.0 as builder
FROM node:bookworm AS build
RUN node -v
WORKDIR /app
COPY . .
COPY --from=dependencies /app/node_modules ./node_modules
RUN npm run build --debug --verbose
FROM node:20.10.0 as runner
WORKDIR /app
COPY . .
ENV NODE_ENV production
COPY --from=builder /app/public ./public
COPY --from=builder /app/package.json ./package.json
COPY --from=builder /app/.next ./.next
COPY --from=dependencies /app/node_modules ./node_modules
EXPOSE 4200
CMD ["npm", "start"]
FROM nginx
COPY --from=build /app/dist /usr/share/nginx/html/
RUN rm /etc/nginx/conf.d/default.conf
COPY _nginx/nginx.conf /etc/nginx/conf.d

View File

@ -1,34 +0,0 @@
FROM node:18-alpine AS base
FROM base AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn install --frozen-lockfile
FROM base AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .
RUN yarn build
FROM base AS runner
WORKDIR /app
ENV NODE_ENV production
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs
COPY --from=builder /app/public ./public
RUN mkdir .next
RUN chown nextjs:nodejs .next
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
USER nextjs
EXPOSE 4200
ENV PORT 4200
CMD HOSTNAME="0.0.0.0" node server.js

22
Jenkinsfile vendored
View File

@ -1,18 +1,18 @@
pipeline {
agent { label 'jenkins-nodejs-agent' }
environment {
RELEASE = "latest"
}
stages {
stage('Build static content') {
steps {
sh '''
#npm install
#npm run build
#pwd
#echo
docker build --progress=plain -t bbuddy/bbuddy_ui:${RELEASE} .
npm install
npm run build
pwd
echo
docker build --progress=plain -t bbuddy/bbuddy_ui:latest .
'''
}
}
@ -20,10 +20,10 @@ pipeline {
steps {
sh '''
sudo docker login https://harbor-wtkp3fsbv6.vertexa.devbay.tech/ -u 'robot$jenkins' -p 'ZrzsVIAeueW1p0alpAnPfM5CDtaRVVKz'
sudo docker tag bbuddy/bbuddy_ui:${RELEASE} harbor-wtkp3fsbv6.vertexa.devbay.tech/bbuddy/bbuddy_ui:${RELEASE}
sudo docker push harbor-wtkp3fsbv6.vertexa.devbay.tech/bbuddy/bbuddy_ui:${RELEASE}
sudo docker tag bbuddy/bbuddy_ui:latest harbor-wtkp3fsbv6.vertexa.devbay.tech/bbuddy/bbuddy_ui:latest
sudo docker push harbor-wtkp3fsbv6.vertexa.devbay.tech/bbuddy/bbuddy_ui:latest
'''
}
}
}
}
}

View File

@ -1,10 +1,20 @@
{
"Header": {
"registration": "Registration",
"enter": "Enter",
"account": "My Account",
"menu": {
"bb-client": "Start grow with BB",
"bb-expert": "Become BB Expert",
"blog": "Blog&News"
}
},
"Main": {
"title": "Bbuddy - Main",
"description": "Bbuddy desc",
"header": "BBuddy: Plattform für persönlichen und beruflichen Erfolg",
"header-desc": "Erhalten Sie Beratungen von führenden Coaches und Mentoren auf BBuddy. Unsere Experten helfen Ihnen, sich zu entwickeln, zu lernen und Ihre persönlichen und beruflichen Ziele zu erreichen. Nutzen Sie unsere Web-Plattform und mobile App für professionelle Unterstützung und Wachstum.",
"news": "Fachartikel & Projektneuigkeiten",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
"BbClient": {
@ -79,7 +89,7 @@
}
},
"Experts": {
"title": "Einen Experten finden",
"title": "Find a expert",
"filter": {
"price": "Price from {from}€ to {to}€",
"duration": "Duration from {from}min to {to}min",

View File

@ -2,8 +2,8 @@
"Main": {
"title": "Bbuddy - Main",
"description": "Bbuddy desc",
"header": "BBuddy: Platform for Personal and Career Success",
"header-desc": "Receive consultations from leading coaches and mentors on BBuddy. Our experts will help you develop, learn, and achieve your personal and career goals. Use our web platform and mobile app for professional support and growth.",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
@ -69,7 +69,7 @@
}
},
"Experts": {
"title": "Find an expert",
"title": "Find a expert",
"filter": {
"price": "Price from {from}€ to {to}€",
"duration": "Duration from {from}min to {to}min",

View File

@ -1,10 +1,20 @@
{
"Header": {
"registration": "Registration",
"enter": "Enter",
"account": "My Account",
"menu": {
"bb-client": "Start grow with BB",
"bb-expert": "Become BB Expert",
"blog": "Blog&News"
}
},
"Main": {
"title": "Bbuddy - Main",
"description": "Bbuddy desc",
"header": "BBuddy: Plataforma para el éxito personal y profesional",
"header-desc": "Reciba consultas de entrenadores y mentores líderes en BBuddy. Nuestros expertos le ayudarán a desarrollarse, aprender y alcanzar sus objetivos personales y profesionales. Utilice nuestra plataforma web y aplicación móvil para apoyo profesional y crecimiento.",
"news": "Artículos profesionales y Noticias de proyectos",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
"BbClient": {
@ -79,7 +89,7 @@
}
},
"Experts": {
"title": "Encontrar un experto",
"title": "Find a expert",
"filter": {
"price": "Price from {from}€ to {to}€",
"duration": "Duration from {from}min to {to}min",

View File

@ -1,10 +1,20 @@
{
"Header": {
"registration": "Registration",
"enter": "Enter",
"account": "My Account",
"menu": {
"bb-client": "Start grow with BB",
"bb-expert": "Become BB Expert",
"blog": "Blog&News"
}
},
"Main": {
"title": "Bbuddy - Main",
"description": "Bbuddy desc",
"header": "BBuddy: Plateforme pour le succès personnel et professionnel",
"header-desc": "Recevez des consultations de coachs et mentors de premier plan sur BBuddy. Nos experts vous aideront à développer, apprendre et atteindre vos objectifs personnels et professionnels. Utilisez notre plateforme web et notre application mobile pour un soutien professionnel et une croissance.",
"news": "Articles professionnels et actualités des projets",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
"BbClient": {
@ -79,7 +89,7 @@
}
},
"Experts": {
"title": "Trouver un expert",
"title": "Find a expert",
"filter": {
"price": "Price from {from}€ to {to}€",
"duration": "Duration from {from}min to {to}min",

View File

@ -1,10 +1,20 @@
{
"Header": {
"registration": "Registration",
"enter": "Enter",
"account": "My Account",
"menu": {
"bb-client": "Start grow with BB",
"bb-expert": "Become BB Expert",
"blog": "Blog&News"
}
},
"Main": {
"title": "Bbuddy - Main",
"description": "Bbuddy desc",
"header": "BBuddy: Piattaforma per il successo personale e professionale",
"header-desc": "Ricevi consulenze da coach e mentori leader su BBuddy. I nostri esperti ti aiuteranno a svilupparti, imparare e raggiungere i tuoi obiettivi personali e professionali. Usa la nostra piattaforma web e l'app mobile per supporto professionale e crescita.",
"news": "Articoli professionali e novità sui progetti",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
"BbClient": {
@ -79,7 +89,7 @@
}
},
"Experts": {
"title": "Trova un esperto",
"title": "Find a expert",
"filter": {
"price": "Price from {from}€ to {to}€",
"duration": "Duration from {from}min to {to}min",

View File

@ -1,10 +1,20 @@
{
"Header": {
"registration": "Регистрация",
"enter": "Вход",
"account": "Мой аккаунт",
"menu": {
"bb-client": "Начни вместе с BB",
"bb-expert": "Стань BB экспертом",
"blog": "Блог&Новости"
}
},
"Main": {
"title": "Bbuddy - Главная",
"description": "Bbuddy описание",
"header": "BBuddy: Платформа для Личного и Карьерного Успеха",
"header-desc": "Получайте консультации от ведущих коучей и менторов в BBuddy. Наши эксперты помогут вам развиваться, обучаться и достигать личных и карьерных целей. Используйте нашу веб-платформу и мобильное приложение для получения профессиональной поддержки и роста.",
"news": "Профессиональные статьи и новости проекта",
"header": "Mentorship, Career\nDevelopment & Coaching.",
"header-desc": "The ins-and-outs of building a career in tech, gaining experience from a mentor, and getting your feet wet with coaching.",
"news": "Professional Articles & Project News",
"popular": "Popular Topics"
},
"BbClient": {

View File

@ -1,7 +1,6 @@
// @ts-check
const withNextIntl = require('next-intl/plugin')();
const path = require('path');
const json = require('./package.json');
/** @type {import('next').NextConfig} */
const nextConfig = {
@ -15,9 +14,6 @@ const nextConfig = {
sassOptions: {
includePaths: [path.join(__dirname, 'styles')],
},
env: {
version: json.version
},
typescript: {
// !! WARN !!
// Dangerously allow production builds to successfully complete even if
@ -32,9 +28,11 @@ const nextConfig = {
taint: true,
// typedRoutes: true
},
// output: 'standalone',
output: 'export',
distDir: 'dist',
poweredByHeader: false,
productionBrowserSourceMaps: true
productionBrowserSourceMaps: true,
trailingSlash: true
};
module.exports = withNextIntl(nextConfig);

7715
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,37 +1,31 @@
{
"name": "bbuddy-ui",
"version": "0.2.3",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "next dev -p 4200",
"build": "next build",
"start": "next start -p 4200",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@ant-design/cssinjs": "^1.18.1",
"@ant-design/icons": "^5.2.6",
"@ant-design/nextjs-registry": "^1.0.0",
"@contentful/rich-text-react-renderer": "^15.22.9",
"@stripe/react-stripe-js": "^2.7.3",
"@stripe/stripe-js": "^4.1.0",
"agora-rtc-react": "2.1.0",
"agora-rtc-sdk-ng": "^4.20.2",
"@greatsumini/react-facebook-login": "^3.3.3",
"@react-oauth/google": "^0.12.1",
"antd": "^5.12.1",
"antd-img-crop": "^4.21.0",
"antd-style": "^3.6.2",
"axios": "^1.6.5",
"contentful": "^10.13.3",
"dayjs": "^1.11.10",
"lodash": "^4.17.21",
"next": "14.0.3",
"next-intl": "^3.3.1",
"react": "^18",
"react-apple-login": "^1.1.6",
"react-dom": "^18",
"react-slick": "^0.29.0",
"react-stripe-js": "^1.1.5",
"slick-carousel": "^1.8.1",
"stripe": "^16.2.0",
"styled-components": "^6.1.1"
},
"devDependencies": {

View File

@ -1,11 +0,0 @@
{
"applinks": {
"apps": [],
"details": [
{
"appID": "GTYAM4FYH3.com.bbuddy.whistle",
"paths": ["/en/experts/*"]
}
]
}
}

View File

@ -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"
]
}
}
]

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 25 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 106 KiB

View File

@ -1,14 +1,26 @@
import { apiRequest } from './helpers';
import { AxiosResponse } from 'axios';
import { apiClient } from '../lib/apiClient';
export const getAuth = (locale: string, data: { login: string, password: string }): Promise<{ jwtToken: string }> => apiRequest({
url: '/auth/login',
method: 'post',
data,
locale
});
export const getAuth = (locale: string, data: { login: string, password: string }): Promise<AxiosResponse<{ jwtToken: string }>> => (
apiClient.post(
'/auth/login',
data,
{
headers: {
'X-User-Language': locale
}
}
)
);
export const getRegister = (locale: string): Promise<{ jwtToken: string }> => apiRequest({
url: '/auth/register',
method: 'post',
locale
});
export const getRegister = (locale: string): Promise<AxiosResponse<{ jwtToken: string }>> => (
apiClient.post(
'/auth/register',
{},
{
headers: {
'X-User-Language': locale
}
}
)
);

View File

@ -1,31 +1,30 @@
import { apiRequest } from './helpers';
import { GeneralFilter, ExpertsData, ExpertDetails, ExpertScheduler, ExpertSchedulerSession, SignupSessionData } from '../types/experts';
import { apiClient } from '../lib/apiClient';
import { GeneralFilter, ExpertsData, ExpertDetails } from '../types/experts';
export const getExpertsList = (locale: string, filter?: GeneralFilter): Promise<ExpertsData> => apiRequest({
url: '/home/coachsearch1',
method: 'post',
data: { ...filter },
locale
});
export const getExpertsList = async (filter: GeneralFilter, locale: string) => {
const response = await apiClient.post(
'/home/coachsearch1',
{ ...filter },
{
headers: {
'X-User-Language': locale
}
}
);
export const getExpertById = (id: string, locale: string): Promise<ExpertDetails> => apiRequest({
url: '/home/coachdetails',
method: 'post',
data: { id },
locale
});
return response.data as ExpertsData || null;
};
export const getSchedulerByExpertId = (id: string, locale: string): Promise<ExpertScheduler> => apiRequest({
url: '/home/sessionsignupdata',
method: 'post',
data: { id },
locale
});
export const getExpertById = async (id: string, locale: string) => {
const response = await apiClient.post(
'/home/coachdetails',
{ id },
{
headers: {
'X-User-Language': locale
}
}
);
export const getSchedulerSession = (data: SignupSessionData, locale: string, token: string): Promise<ExpertSchedulerSession> => apiRequest({
url: '/home/sessionsignupsubmit',
method: 'post',
data,
locale,
token
});
return response.data as ExpertDetails || null;
};

View File

@ -1,44 +0,0 @@
import { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios';
import { apiClient } from '../lib/apiClient';
type RequiredConfigParams<D = any> = Required<Pick<AxiosRequestConfig, 'url' | 'method'>> & Pick<AxiosRequestConfig<D>, 'data'>;
export type PageRequestConfig<D = any> = RequiredConfigParams<D> & Partial<Pick<AxiosRequestConfig, 'headers'>> & { locale?: string, token?: string };
export const apiRequest = async <T = any, K = any>(
baseParams: PageRequestConfig<T>,
): Promise<K> => {
try {
const config = {
url: baseParams.url,
method: baseParams.method,
data: baseParams?.data,
headers: {
'X-User-Language': baseParams?.locale || 'en',
'X-Referrer-Channel': 'site',
...(baseParams?.token ? { Authorization: `Bearer ${baseParams.token}` } : {}),
...(baseParams.headers || {})
}
};
const response: AxiosResponse<K> = await apiClient.request<any, AxiosResponse<K>, T>(config as AxiosRequestConfig<T>);
return response.data;
} catch (err) {
// const {
// response: {
// status: responseCode = null,
// statusText = '',
// data: { message = '', status: errorKey = '' } = {},
// } = {},
// code: statusCode = '',
// } = err as AxiosError;
//
// throw new Error(
// JSON.stringify({
// statusCode,
// statusMessage: message || statusText,
// responseCode,
// errorKey,
// }),
// );
}
};

View File

@ -1,37 +1,40 @@
'use client'
import { useCallback, useState } from 'react';
import { ProfileData, ProfileRequest } from '../../types/profile';
import { getPersonalData, setPersonData } from '../profile';
import { useCallback, useEffect, useState } from 'react';
import { Profile } from '../../types/profile';
import { getPersonalData } from '../profile';
import { useLocalStorage } from '../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY } from '../../constants/common';
export const useProfileSettings = (locale: string) => {
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
const [profileSettings, setProfileSettings] = useState<ProfileData | undefined>();
const [profileSettings, setProfileSettings] = useState<Profile | undefined>();
const [fetchLoading, setFetchLoading] = useState<boolean>(false);
const [saveLoading, setSaveLoading] = useState<boolean>(false);
const fetchProfileSettings = () => {
useEffect(() => {
if (jwt) {
getPersonalData(locale, jwt)
.then((data) => {
.then(({ data }) => {
setProfileSettings(data);
})
.catch((err) => {
console.log(err);
})
.finally(() => {
setFetchLoading(false);
});
}
};
}, []);
const save = useCallback((data: ProfileRequest) => setPersonData(data, locale, jwt), []);
const save = useCallback(() => {
}, []);
return {
fetchLoading,
fetchProfileSettings,
save,
saveLoading,
profileSettings
};
};

View File

@ -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
};
};

View File

@ -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 { Session } from '../../types/sessions';
import { getSessionDetails } from '../sessions';
export const useSessionDetails = (locale: string, sessionId: number) => {
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
const [session, setSession] = useState<Session>();
const [errorData, setErrorData] = useState<any>();
const [loading, setLoading] = useState<boolean>(false);
const fetchData = useCallback(() => {
setLoading(true);
setErrorData(undefined);
setSession(undefined);
getSessionDetails(locale, jwt, sessionId)
.then((session) => {
setSession(session);
})
.catch((err) => {
setErrorData(err);
})
.finally(() => {
setLoading(false);
})
}, []);
useEffect(() => {
fetchData();
}, []);
return {
fetchData,
loading,
session,
errorData
};
};

View File

@ -1,46 +0,0 @@
'use client'
import { useCallback, useEffect, useRef } from 'react';
import { useLocalStorage } from '../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY } from '../../constants/common';
import { trackingStartSession } from '../sessions';
const DURATION = 30000;
export const useSessionTracking = (locale: string, sessionId: number) => {
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
const timer = useRef<number>();
const fetchData = useCallback(() => {
trackingStartSession(locale, jwt, sessionId)
.then(() => {
console.log('tracking success');
})
.catch((err) => {
console.log('tracking error', err);
})
}, []);
useEffect(() => {
return () => {
window.clearInterval(timer.current);
}
}, []);
const start = () => {
window.clearInterval(timer.current);
timer.current = window.setInterval(() => {
fetchData();
}, DURATION);
};
const stop = () => {
window.clearInterval(timer.current);
};
return {
start,
stop
};
};

View File

@ -1,103 +1,75 @@
import { PayInfo, Profile, ProfileRequest, ProfileData } from '../types/profile';
import { ExpertsTags } from '../types/tags';
import { EducationData, EducationDTO } from '../types/education';
import { PracticeData, PracticeDTO } from '../types/practice';
import { ScheduleDTO } from '../types/schedule';
import { apiRequest } from './helpers';
import { AxiosResponse } from 'axios';
import { apiClient } from '../lib/apiClient';
import { Profile } from '../types/profile';
import { Session, SessionsFilter } from '../types/sessions';
export const getUserData = (locale: string, token: string): Promise<Profile> => apiRequest({
url: '/home/userdata',
method: 'post',
locale,
token
});
export const setPersonData = (person: { login: string, password: string, role: string, languagesLinks: any[] }, locale: string, jwt: string): Promise<AxiosResponse<{ userData: Profile }>> => (
apiClient.post(
'/home/applyperson1',
{ ...person },
{
headers: {
'X-User-Language': locale,
Authorization: `Bearer ${jwt}`
}
}
)
);
export const getPersonalData = (locale: string, token: string): Promise<ProfileData> => apiRequest({
url: '/home/person1',
method: 'post',
locale,
token
});
export const getPersonalData = (locale: string, jwt: string): Promise<AxiosResponse<Profile>> => (
apiClient.post(
'/home/userdata',
{},
{
headers: {
'X-User-Language': locale,
Authorization: `Bearer ${jwt}`
}
}
)
);
export const setPersonData = (data: ProfileRequest, locale: string, token: string): Promise<{ userData: Profile }> => apiRequest({
url: '/home/applyperson1',
method: 'post',
data,
locale,
token
});
export const getUpcomingSessions = (locale: string, jwt: string, filter?: SessionsFilter): Promise<AxiosResponse<Session[]>> => (
apiClient.post(
'/home/upcomingsessionsall',
{
sessionType: 'session',
...(filter || {})
},
{
headers: {
'X-User-Language': locale,
Authorization: `Bearer ${jwt}`
}
}
)
);
export const getEducation = (locale: string, token: string): Promise<EducationDTO> => apiRequest({
url: '/home/person2',
method: 'post',
locale,
token
});
export const getRequestedSessions = (locale: string, jwt: string): Promise<AxiosResponse<{ requestedSessions: Session[] }>> => (
apiClient.post(
'/home/coachhomedata',
{},
{
headers: {
'X-User-Language': locale,
Authorization: `Bearer ${jwt}`
}
}
)
);
export const setEducation = (locale: string, token: string, data: EducationData): Promise<EducationData> => apiRequest({
url: '/home/applyperson2',
method: 'post',
data,
locale,
token
});
export const getTags = (locale: string, token: string): Promise<ExpertsTags> => apiRequest({
url: '/home/person3',
method: 'post',
locale,
token
});
export const setTags = (locale: string, token: string, data: ExpertsTags): Promise<ExpertsTags> => apiRequest({
url: '/home/applyperson3',
method: 'post',
data,
locale,
token
});
export const getPractice = (locale: string, token: string): Promise<PracticeDTO> => apiRequest({
url: '/home/person4',
method: 'post',
locale,
token
});
export const setPractice = (locale: string, token: string, data: PracticeData): Promise<PracticeDTO> => apiRequest({
url: '/home/applyperson4',
method: 'post',
data,
locale,
token
});
export const getSchedule = (locale: string, token: string): Promise<ScheduleDTO> => apiRequest({
url: '/home/person51',
method: 'post',
locale,
token
});
export const setSchedule = (locale: string, token: string, data: ScheduleDTO): Promise<ScheduleDTO> => apiRequest({
url: '/home/applyperson51',
method: 'post',
data,
locale,
token
});
export const getPayData = (locale: string, token: string): Promise<{ person6Data?: PayInfo }> => apiRequest({
url: '/home/person6',
method: 'post',
locale,
token
});
export const setPayData = (locale: string, token: string, data: PayInfo): Promise<PayInfo> => apiRequest({
url: '/home/applyperson6',
method: 'post',
data,
locale,
token
});
export const getRecentSessions = (locale: string, jwt: string, filter?: SessionsFilter): Promise<AxiosResponse<Session[]>> => (
apiClient.post(
'/home/historicalmeetings ',
{
sessionType: 'session',
...(filter || {})
},
{
headers: {
'X-User-Language': locale,
Authorization: `Bearer ${jwt}`
}
}
)
);

View File

@ -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
});

View File

@ -1,101 +0,0 @@
import { DeclineSessionData, Session, SessionsFilter, SessionCommentData } from '../types/sessions';
import { apiRequest } from './helpers';
export const getUpcomingSessions = (locale: string, token: string, filter?: SessionsFilter): Promise<Session[]> => apiRequest({
url: '/home/upcomingsessionsall',
method: 'post',
data: {
sessionType: 'session',
...(filter || {})
},
locale,
token
});
export const getRequestedSessions = (locale: string, token: string): Promise<{ requestedSessions: Session[] }> => apiRequest({
url: '/home/coachhomedata',
method: 'post',
locale,
token
});
export const getRecentSessions = (locale: string, token: string, filter?: SessionsFilter): Promise<Session[]> => apiRequest({
url: '/home/historicalmeetings',
method: 'post',
data: {
sessionType: 'session',
...(filter || {})
},
locale,
token
});
export const getSessionDetails = (locale: string, token: string, id: number): Promise<Session> => apiRequest({
url: '/home/session',
method: 'post',
data: { id },
locale,
token
});
export const approveRequestedSession = (locale: string, token: string, sessionId: number): Promise<any> => apiRequest({
url: '/home/approverequestedsession',
method: 'post',
data: { sessionId },
locale,
token
});
export const declineRequestedSession = (locale: string, token: string, { sessionId, reason }: DeclineSessionData): Promise<any> => apiRequest({
url: '/home/declinerequestedsession',
method: 'post',
data: {
sessionId,
coachDeclineReason: reason
},
locale,
token
});
export const cancelUpcomingSession = (locale: string, token: string, { sessionId, reason }: DeclineSessionData): Promise<any> => apiRequest({
url: '/home/cancelupcomingsession',
method: 'post',
data: {
sessionId,
coachCancelReason: reason
},
locale,
token
});
export const addSessionComment = (locale: string, token: string, data: SessionCommentData): Promise<any> => apiRequest({
url: '/home/session_comment',
method: 'post',
data,
locale,
token
});
export const trackingStartSession = (locale: string, token: string, id: number): Promise<any> => apiRequest({
url: '/home/sessiontracking',
method: 'post',
data: { id },
locale,
token
});
export const finishSession = (locale: string, token: string, sessionId: number): Promise<any> => apiRequest({
url: '/home/finishsession',
method: 'post',
data: { sessionId },
locale,
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
});

View File

@ -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);

View File

@ -1,14 +1,29 @@
import { apiClient } from '../lib/apiClient';
import { SearchData, Languages } from '../types/tags';
import { apiRequest } from './helpers';
export const getTagList = (locale: string): Promise<SearchData> => apiRequest({
url: '/home/searchdata',
method: 'post',
locale
});
export const getTagList = async (locale: string) => {
const response = await apiClient.post(
'/home/searchdata',
{},
{
headers: {
'X-User-Language': locale
}
}
);
export const getLanguages = (locale: string): Promise<Languages> => apiRequest({
url: '/home/languages',
method: 'get',
locale
});
return response.data as SearchData || null;
};
export const getLanguages = async (locale: string) => {
const response = await apiClient.get(
'/home/languages',
{
headers: {
'X-User-Language': locale
}
}
);
return response.data as Languages || null;
};

View File

@ -1,13 +0,0 @@
import { ExpertDocument } from '../types/file';
import { apiRequest } from './helpers';
export const setUploadFile = (locale: string, token: string, data: any): Promise<ExpertDocument> => apiRequest({
url: '/home/uploadfile',
method: 'post',
data,
locale,
token,
headers: {
'Content-Type': 'multipart/form-data'
}
});

View File

@ -1,9 +1,6 @@
import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
export default function Directions({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
export default function Directions() {
return (
<div className="main-popular">
<div className="b-inner">

View File

@ -1,10 +1,8 @@
import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { Experts } from '../../../../components/Experts/Experts';
export default function ExpertsPage({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
export default function ExpertsPage({ params }: { params: { locale: string } }) {
const t = useTranslations('Experts');
return (
@ -16,7 +14,7 @@ export default function ExpertsPage({ params: { locale } }: { params: { locale:
<img src="/images/options-outline.svg" className="" alt=""/>
</div>
</div>
<Experts locale={locale} />
<Experts locale={params.locale} />
</div>
</div>
);

View File

@ -1,40 +1,65 @@
import React from 'react';
// import { useTranslations } from 'next-intl';
import Link from 'next/link';
import { getTranslations, unstable_setRequestLocale } from 'next-intl/server';
import { i18nText } from '../../../../i18nKeys';
import { fetchBlogPosts } from '../../../../lib/contentful/blogPosts';
export default async function News({params: {locale}}: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const t = await getTranslations('Main');
const { data, total } = await fetchBlogPosts({preview: false, sticky: true})
export default function News() {
return (
<div className="main-articles">
<div className="b-inner">
<h2 className="title-h2">{t('news')}</h2>
<h2 className="title-h2">Professional Articles & Project News</h2>
<div className="row">
{data.map((item, i) => (
<div className="col-lg-4 col-md-6 col-sm-6" key={'news' + i}>
<div className="b-article">
<div className="b-article__image">
<img className="" src={item.listImage?.src} alt={item.listImage?.alt}/>
</div>
<div className="b-article__inner">
<div className="b-article__title">{item.title}</div>
<div className="b-article__text">
{item.excerpt}
</div>
<Link href={`/${locale}/blog/${item.slug}`} className="b-article__link">
{i18nText('readMore', locale)}
<img className="" src="/images/chevron-forward.svg" alt=""/>
</Link>
<div className="col-lg-4 col-md-6 col-sm-6">
<div className="b-article">
<div className="b-article__image">
<img className="" src="/images/article.png" alt=""/>
</div>
<div className="b-article__inner">
<div className="b-article__title">News Headline</div>
<div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div>
<a href="#" className="b-article__link">Read more
<img className="" src="/images/chevron-forward.svg" alt=""/>
</a>
</div>
</div>
))}
</div>
<div className="col-lg-4 d-none d-lg-block">
<div className="b-article">
<div className="b-article__image">
<img className="" src="/images/article.png" alt=""/>
</div>
<div className="b-article__inner">
<div className="b-article__title">News Headline</div>
<div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div>
<a href="#" className="b-article__link">Read more
<img className="" src="/images/chevron-forward.svg" alt=""/>
</a>
</div>
</div>
</div>
<div className="col-lg-4 d-none d-lg-block">
<div className="b-article">
<div className="b-article__image">
<img className="" src="/images/article.png" alt=""/>
</div>
<div className="b-article__inner">
<div className="b-article__title">News Headline</div>
<div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div>
<a href="#" className="b-article__link">Read more
<img className="" src="/images/chevron-forward.svg" alt=""/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -12,17 +12,18 @@ import React, { ReactNode } from 'react';
// };
// }
export default function MainLayout({ children, news, experts }: {
export default function MainLayout({ children, news, directions, experts }: {
children: ReactNode,
news: ReactNode,
experts: ReactNode,
payment: ReactNode
directions: ReactNode,
experts: ReactNode
}) {
return (
<>
{children}
{news}
{directions}
{experts}
</>
);
}
};

View File

@ -1,70 +0,0 @@
'use client'
import { useEffect, useState } from 'react';
import { message } from 'antd';
// import { unstable_setRequestLocale } from 'next-intl/server';
import { ExpertData } from '../../../../../types/profile';
import { AUTH_TOKEN_KEY } from '../../../../../constants/common';
import { useLocalStorage } from '../../../../../hooks/useLocalStorage';
import {
getEducation,
getPersonalData,
getTags,
getPractice,
getSchedule,
getPayData,
getUserData
} from '../../../../../actions/profile';
import { ExpertProfile } from '../../../../../components/ExpertProfile';
import { Loader } from '../../../../../components/view/Loader';
export default function ExpertProfilePage({ params: { locale } }: { params: { locale: string } }) {
// unstable_setRequestLocale(locale);
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
const [loading, setLoading] = useState<boolean>(false);
const [data, setData] = useState<ExpertData | undefined>();
const [isFull, setIsFull] = useState<boolean>(false);
useEffect(() => {
if (jwt) {
setLoading(true);
Promise.all([
getUserData(locale, jwt),
getPersonalData(locale, jwt),
getEducation(locale, jwt),
getTags(locale, jwt),
getPractice(locale, jwt),
getSchedule(locale, jwt),
getPayData(locale, jwt)
])
.then(([profile, person, education, tags, practice, schedule, payData]) => {
setIsFull(profile.fillProgress === 'full');
setData({
person,
education,
tags,
practice,
schedule,
payData
});
})
.catch(() => {
message.error('Не удалось загрузить данные эксперта');
})
.finally(() => {
setLoading(false);
})
}
}, [jwt]);
return data ? (
<Loader isLoading={loading}>
<ExpertProfile
isFull={isFull}
locale={locale}
data={data}
updateData={setData}
/>
</Loader>
) : null;
};

View File

@ -1,6 +1,5 @@
import React from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { i18nText } from '../../../../../i18nKeys';
@ -10,7 +9,6 @@ export const metadata: Metadata = {
};
export default function Information({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const t = useTranslations('Account.LegalInformation');
return (

View File

@ -2,19 +2,34 @@
import React, { ReactNode } from 'react';
import { AccountMenu } from '../../../../components/Account';
import { i18nText } from '../../../../i18nKeys';
type AccountInnerLayoutProps = {
children: ReactNode;
params: { locale: string };
};
const ROUTES = ['sessions', 'notifications', 'support', 'information', 'settings', 'messages', 'work-with-us'];
const COUNTS: Record<string, number> = {
sessions: 12,
notifications: 5,
messages: 113
};
export default function AccountInnerLayout({ children, params: { locale } }: AccountInnerLayoutProps) {
const getMenuConfig = () => ROUTES.map((path) => ({
path,
title: i18nText(`accountMenu.${path}`, locale),
count: COUNTS[path] || undefined
}));
return (
<div className="page-account">
<div className="b-inner">
<div className="row">
<div className="col-xl-3 col-lg-4 d-none d-lg-block">
<AccountMenu locale={locale} />
<AccountMenu menu={getMenuConfig()} locale={locale} />
</div>
<div className="col-xl-9 col-lg-8 ">
<div className="page-account__inner">

View File

@ -1,5 +1,5 @@
import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { Link } from '../../../../../../navigation';
import { i18nText } from '../../../../../../i18nKeys';
@ -17,7 +17,7 @@ export function generateStaticParams({
}
export default function Message({ params }: { params: { locale: string, textId: string } }) {
unstable_setRequestLocale(params.locale);
const t = useTranslations('Account.Messages');
return (
<>

View File

@ -1,11 +1,17 @@
import React, { Suspense } from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import type { Metadata } from 'next';
import { useTranslations } from 'next-intl';
import { Link } from '../../../../../navigation';
import { CustomInput } from '../../../../../components/view/CustomInput';
import { i18nText } from '../../../../../i18nKeys';
export const metadata: Metadata = {
title: 'Bbuddy - Account - Messages',
description: 'Bbuddy desc messages'
};
export default function Messages({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const t = useTranslations('Account.Messages');
return (
<>
@ -18,7 +24,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
<div className="messages-session">
<Link
className="card-profile"
href={'messages/1' as any}
href={'1' as any}
>
<div className="card-profile__header">
<div className="card-profile__header__portrait">
@ -42,7 +48,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
</Link>
<Link
className="card-profile"
href={'messages/2' as any}
href={'2' as any}
>
<div className="card-profile__header">
<div className="card-profile__header__portrait">
@ -63,7 +69,7 @@ export default function Messages({ params: { locale } }: { params: { locale: str
</Link>
<Link
className="card-profile"
href={'messages/3' as any}
href={'3' as any}
>
<div className="card-profile__header">
<div className="card-profile__header__portrait">

View File

@ -1,6 +1,5 @@
import React from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import dayjs from 'dayjs';
import 'dayjs/locale/ru';
import 'dayjs/locale/en';
@ -16,7 +15,6 @@ export const metadata: Metadata = {
};
export default function Notifications({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const date = dayjs('2022-05-22').locale(locale);
return (

View File

@ -0,0 +1,21 @@
import React, { Suspense } from 'react';
import type { Metadata } from 'next';
import { useTranslations } from 'next-intl';
import { SessionsTabs } from '../../../../../components/Account';
export const metadata: Metadata = {
title: 'Bbuddy - Account - Sessions',
description: 'Bbuddy desc sessions'
};
export default function Sessions({ params: { locale } }: { params: { locale: string } }) {
const t = useTranslations('Account.Sessions');
return (
<Suspense fallback={<p>Loading...</p>}>
<SessionsTabs
locale={locale}
/>
</Suspense>
);
}

View File

@ -1,11 +1,8 @@
import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import { Link } from '../../../../../../navigation';
import { i18nText } from '../../../../../../i18nKeys/';
export default function ChangePassword({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
return (
<>
<ol className="breadcrumb">

View File

@ -1,10 +1,16 @@
import React, { Suspense } from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import type { Metadata } from 'next';
import { useTranslations } from 'next-intl';
import { ProfileSettings } from '../../../../../components/Account';
import { i18nText } from '../../../../../i18nKeys';
export const metadata: Metadata = {
title: 'Bbuddy - Account - Profile Settings',
description: 'Bbuddy desc Profile settings'
};
export default function Settings({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const t = useTranslations('Account.Settings');
return (
<>

View File

@ -1,5 +1,4 @@
import React from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import type { Metadata } from 'next';
import { i18nText } from '../../../../../i18nKeys';
@ -9,8 +8,6 @@ export const metadata: Metadata = {
};
export default function Support({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
return (
<>
<ol className="breadcrumb">

View File

@ -1,18 +1,18 @@
import React from 'react';
import { Link } from '../../../../../../navigation';
import { CustomSelect } from '../../../../../../components/view/CustomSelect';
import { Link } from '../../../../../../../navigation';
import { CustomSelect } from '../../../../../../../components/view/CustomSelect';
export default function AddOffer() {
return (
<>
<ol className="breadcrumb">
<li className="breadcrumb-item">
<Link href={'/account/expert-profile' as any}>
<Link href={'/account/work-with-us' as any}>
Work With Us
</Link>
</li>
<li className="breadcrumb-item">
<Link href={'/account/expert-profile/coaching' as any}>
<Link href={'/account/work-with-us/coaching' as any}>
Coaching
</Link>
</li>

View File

@ -0,0 +1,131 @@
import React from 'react';
import { Link } from '../../../../../../navigation';
export default function Coaching() {
return (
<>
<ol className="breadcrumb">
<li className="breadcrumb-item">
<Link href={'/account/work-with-us' as any}>
Work With Us
</Link>
</li>
<li className="breadcrumb-item active" aria-current="page">Coaching</li>
</ol>
<div className="coaching-info">
<div className="card-profile">
<div className="card-profile__header">
<div className="card-profile__header__portrait">
<img src="/images/person.png" className="" alt="" />
</div>
<div className="card-profile__header__inner">
<div className="card-profile__header__name">
David
</div>
<div className="card-profile__header__title">
12 Practice hours
</div>
<div className="card-profile__header__title ">
15 Supervision per year
</div>
</div>
</div>
</div>
<div className="coaching-info__wrap-btn">
<a href="#" className="btn-edit">Edit</a>
<a href="#" className="btn-apply">Add Offer</a>
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
My Offers
</h2>
<div className="coaching-section__desc">
<div className="coaching-offer">
<div className="coaching-offer__header">
<div className="coaching-offer__title">
Senior Software Engineer
</div>
<div className="coaching-offer__wrap-btn">
<a href="#" className="link-edit">Edit</a>
<a href="#" className="link-remove">Remove</a>
</div>
</div>
<div className="coaching-offer__price">
45$ <span>/ 45min</span>
</div>
<div className="skills__list">
<div className="skills__list__item">Engineering & Data</div>
<div className="skills__list__item">Engineering & Data</div>
<div className="skills__list__more">+6</div>
</div>
<div className="coaching-offer__desc">
I have worked across a variety of organizations, lead teams, and delivered quality software
for 8 years. In that time I've worked as an independent consultant, at agencies as a team
lead, and as a senior engineer at Auth0. I also host a podcast
https://anchor.fm/work-in-programming where I break down how …
</div>
</div>
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
About Coach
</h2>
<div className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
Education
</h2>
<div className="coaching-section__desc">
<h3 className="title-h3">Psychologist </h3>
<div className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
</div>
<div className="sertific">
<img src="/images/sertific.png" className="" alt="" />
</div>
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
Professional Certification
</h2>
<div className="coaching-section__desc">
<div className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
</div>
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
Trainings | Seminars | Courses
</h2>
<div className="coaching-section__desc">
<div className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
</div>
</div>
</div>
<div className="coaching-section">
<h2 className="title-h2">
MBA Information
</h2>
<div className="coaching-section__desc">
<div className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
</div>
</div>
</div>
</>
);
}

View File

@ -7,7 +7,7 @@ export default function NewTopic() {
<>
<ol className="breadcrumb">
<li className="breadcrumb-item">
<Link href={'/account/expert-profile' as any}>
<Link href={'/account/work-with-us' as any}>
Work With Us
</Link>
</li>

View File

@ -0,0 +1,29 @@
import React from 'react';
import type { Metadata } from 'next';
import { useTranslations } from 'next-intl';
import { i18nText } from '../../../../../i18nKeys';
export const metadata: Metadata = {
title: 'Bbuddy - Account - Work with us',
description: 'Bbuddy desc work with us'
};
export default function WorkWithUs({ params: { locale } }: { params: { locale: string } }) {
const t = useTranslations('Account.WorkWithUs');
return (
<>
<ol className="breadcrumb">
<li className="breadcrumb-item active" aria-current="page">{i18nText('accountMenu.work-with-us', locale)}</li>
</ol>
<div className="b-info">
<div className="image-info">
<img className="" src="/images/info.png" alt="" />
</div>
<div className="b-info__title">{i18nText('insertInfo', locale)}</div>
<button className="btn-apply">{i18nText('getStarted', locale)}</button>
<div className="base-text">{i18nText('changeUserData', locale)}</div>
</div>
</>
);
}

View File

@ -1,17 +0,0 @@
import React, { ReactNode } from 'react';
type AccountSimpleLayoutProps = {
children: ReactNode;
};
export default function AccountSimpleLayout({ children }: AccountSimpleLayoutProps) {
return (
<div className="page-account">
<div className="b-inner">
<div className="row">
{children}
</div>
</div>
</div>
);
};

View File

@ -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();
};

View File

@ -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;
};

View File

@ -1,57 +0,0 @@
import React, { Suspense } from 'react';
import { unstable_setRequestLocale } from 'next-intl/server';
import { notFound } from 'next/navigation';
import { AccountMenu, SessionDetails, SessionsTabs } from '../../../../../../components/Account';
import { SessionType } from '../../../../../../types/sessions';
const SESSION_ROUTES = [SessionType.UPCOMING, SessionType.REQUESTED, SessionType.RECENT];
export async function generateStaticParams({
params: { locale },
}: { params: { locale: string } }) {
return [{ locale, slug: [SessionType.UPCOMING] }];
}
export default function SessionDetailItem({ params: { locale, slug } }: { params: { locale: string, slug?: string[] } }) {
unstable_setRequestLocale(locale);
const sessionType: string = slug?.length > 0 && slug[0] || '';
const sessionId: number | null = slug?.length > 1 && Number(slug[1]) || null;
if (!slug?.length || slug?.length > 2) {
notFound();
}
if (SESSION_ROUTES.includes(sessionType as SessionType) && Number.isInteger(sessionId)) {
return (
<Suspense fallback={<p>Loading...</p>}>
<SessionDetails
locale={locale}
sessionId={sessionId as number}
activeType={sessionType as SessionType}
/>
</Suspense>
);
}
if (SESSION_ROUTES.includes(sessionType as SessionType) && !Number.isInteger(sessionId)) {
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>}>
<SessionsTabs
locale={locale}
activeTab={sessionType as SessionType}
/>
</Suspense>
</div>
</div>
</>
);
}
return notFound();
};

View File

@ -1,12 +0,0 @@
'use client';
import { redirect } from 'next/navigation';
import { useLocalStorage } from '../../../../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY } from '../../../../../constants/common';
import { SessionType } from '../../../../../types/sessions';
export default function SessionsMainPage() {
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
return token ? redirect(`sessions/${SessionType.UPCOMING}`) : null;
};

View File

@ -1,14 +1,18 @@
'use client';
import { ReactNode } from 'react';
import dynamic from 'next/dynamic';
import { ReactNode, useEffect } from 'react';
import { redirect, notFound } from 'next/navigation';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY } from '../../../constants/common';
const Account = dynamic(() => import('../../../components/Account/AccountWrapper'), { ssr: false });
export default function AccountLayout({ children }: { children: ReactNode }) {
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
export default function AccountBaseLayout({ children }: { children: ReactNode }) {
return (
<Account>
{children}
</Account>
);
useEffect(() => {
if(!token){
notFound();
}
}, []);
return children;
};

View File

@ -1,5 +1,6 @@
'use client';
import React from 'react';
import { redirect } from 'next/navigation';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY } from '../../../constants/common';

View File

@ -0,0 +1,40 @@
'use client'
import React from 'react';
import { useEffect, useRef } from 'react';
import { apiClient } from '../../../lib/apiClient';
export default function BbAppleLogIn() {
const urlParams = new URLSearchParams(location.search);
var code = urlParams.getAll('code')[0];
const ref = useRef(false);
var makeRequest = async (c) => {
if(ref.current) {
return;
}
ref.current = true;
try {
var result = await apiClient.post('http://192.168.0.106:5090/api/auth/registerexternalappleweb', {
code: c
});
localStorage.setItem('bbuddy_token_test', result.data.jwtToken);
window.location.href="/";
}
catch (err) {
/*process*/
}
}
useEffect(() => {
makeRequest(code);
},[code]);
return (
<>
</>
);
};

View File

@ -0,0 +1,40 @@
'use client'
import React from 'react';
import { useEffect, useRef } from 'react';
import { apiClient } from '../../../lib/apiClient';
export default function BbAppleLogIn() {
const urlParams = new URLSearchParams(location.search);
var code = urlParams.getAll('code')[0];
const ref = useRef(false);
var makeRequest = async (c) => {
if(ref.current) {
return;
}
ref.current = true;
try {
var result = await apiClient.post('http://192.168.0.106:5090/api/auth/tryloginexternalappleweb', {
code: c
});
localStorage.setItem('bbuddy_token_test', result.data.jwtToken);
window.location.href="/";
}
catch (err) {
/*process*/
}
}
useEffect(() => {
makeRequest(code);
},[code]);
return (
<>
</>
);
};

View File

@ -1,6 +1,5 @@
import React from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { GeneralTopSection } from '../../../components/Page';
@ -9,8 +8,7 @@ export const metadata: Metadata = {
description: 'Bbuddy desc Take the lead with BB'
};
export default function BbClientPage({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
export default function BbClientPage() {
const t = useTranslations('BbClient');
return (

View File

@ -1,17 +1,15 @@
import React from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { GeneralTopSection } from '../../../components/Page';
import { ScreenCarousel } from '../../../components/Page/ScreenCarousel';
import { ScreenCarousel } from '../../../components/Page/ScreenCarousel/index';
export const metadata: Metadata = {
title: 'Bbuddy - Become a BB expert',
description: 'Bbuddy desc Become a BB expert'
};
export default function BbExpertPage({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
export default function BbExpertPage() {
const t = useTranslations('BbExpert');
return (

View File

@ -0,0 +1,150 @@
import React from 'react';
import type { Metadata } from 'next';
import { notFound } from 'next/navigation';
export const metadata: Metadata = {
title: 'Bbuddy - Blog item',
description: 'Bbuddy desc blog item'
};
export function generateStaticParams() {
return [{ blogId: 'news-1' }, { blogId: 'news-2' }];
}
export default function BlogItem({ params }: { params: { blogId: string } }) {
if (!params?.blogId) notFound();
return (
<div className="b-news-page">
<div className="b-inner">
<h1 className="b-news-page__title">6 learnings from Shivpuri to Silicon Valley</h1>
<div className="news-item__badge">Leadership & Management</div>
<div className="b-news-page__text">
{`news id ${params.blogId}`}<br />
Im excited to kick off this series of newsletters where Ill be sharing my experiences, learnings,
and best practices which helped me to grow both in my personal and professional life. My hope is to
give back to the community and help anyone connect directly with me who may have got impacted with
recent layoffs, dealing with immigration challenges.
</div>
<div className="b-news-page__image">
<img className="" src="/images/news1.png" alt="" />
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<img className="" src="/images/author.png" alt="" />
<div className="news-item__info__author__inner">
<div className="news-item__info__name">Sonali Garg</div>
<div className="news-item__info__date">February 6th, 2023</div>
</div>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt="" />
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt="" />
Share
</div>
</div>
</div>
<div className="b-news-page__inner">
<h2 className="title-h2">
This is not about layoffs, it's about living with whatever life throws at you..
</h2>
<p className="b-news-page__text">
Over the past few months, as the macro-economic events have unfolded, I have heard voices filled
with anxiety, helplessness and general lack of confidence to deal with this ambiguity from my
mentees, colleagues, friends and family. I was laid off from Meta last November and I firmly
believe this is nothing but a bump in the road that might seem like a steep climb in the
short-term. I may not have all the answers but this has inspired me to share my story. If you
are looking for a sob story, you can stop reading now. Ever wondered what it takes for a girl
born into a conservative family in a small sleepy town in India, who lost one of her parents at
age 17, earned her living while pursuing engineering, moved to the UK by herself and ended up
working in big tech in Silicon valley? My goal with this series of posts is to inspire and share
my mental models that helped me throughout my professional and personal life.
</p>
<p className="b-news-page__text">
After completing my engineering, I started my career at a small software company in Bhopal and
then worked for TCS(Tata Consultancy Services), one of the largest IT-outsourcing companies in
the world for almost 5 years. Over the past 14 years, I have worked for big tech companies like
Meta (Facebook) and Google, wore multiple hats, led strategic programs, scaled multi
billion-dollar businesses, built teams and helped achieve business operational excellence.
Throughout my career, Ive dealt with several challenges from execution to scale to building a
high performance team. A lot of my early struggles were about how to assimilate in a new
culture, create a network in a new environment, earn trust, create and nurture work
relationships into fruitful friendships and so on.
</p>
<p className="b-news-page__text">
I was born in a conservative family in a small town called Shivpuri, also known as Mini
Kashmir because of its natural beauty. My father was a civil engineer working on Madikheda Dam
on Sindh river and was a strict disciplinarian. He was gone from dawn to dusk and was always
focused. My mother was a teacher in a school that was about 30 kms from our home. We (me and my
sister) would often be left with neighbors to be taken care of and this led us to become
independent at an early age. Our otherwise slow paced, simple life with only a few families
around in the government quarters that were set up to support construction of the dam was filled
with natural beauty, wildlife and a community of close friends. Our lives were balanced and
while my parents worked hard to provide basic needs, we were satisfied. There were only a few
schools with Hindi being the prevalent language as the medium of teaching. There were no
colleges for advanced studies and most girls did not go to college often married off by their
18th birthday. Generally speaking, we had a joyous childhood with just the basics. While most
folks we interacted with were not highly educated nor ambitious, earned lower middle class
salaries and lacked exposure to the outside world but there was plenty to learn from them.
People had learnt to stick together in good and bad times. They embodied the old school
qualities of hard work, dedication and commitment. Be willing to give it all- hard work,
dedication and commitment.
</p>
<p className="b-news-page__text">
In 2003, my father passed away suddenly and we found ourselves in crisis. My mother was a
teacher and she did not have time to deal with her grief. Rather, she was struggling to garner
support to get transferred to a school in Bhopal, capital of Madhya Pradesh to be closer to our
maternal grandparents. As we uprooted ourselves from Shivpuri to Bhopal, one of my fathers
loyal friends came to help load the moving truck. While he had nothing to gain out of us, he
continued to serve us until the last day in Shivpuri. Remember, in crisis your team matters more
than any other time. Advocate for them ruthlessly in good and bad times, they will come through
in crisis.
</p>
<p className="b-news-page__text">
Eventually we found our footing, my mothers job was transferred to a local school in Bhopal and
I got admission in a government engineering college. My sister was still attending high school
and both of us were teaching tuition classes to middle school students in the evenings to make
ends meet. I also started a tiffin service for a few out of town students while attending
college to pay for my transportation and cost of supplies. We refused to give up. Persevere when
all else fails.
</p>
<p className="b-news-page__text">
Our 5 years went by quickly in Bhopal as we worked towards improving our financial situation and
I completed my Bachelors in Computer Science. This was the time I first stepped out to live in a
metropolitan city, Mumbai for my job at TCS. This was a paradigm shift from Bhopal and I was
blown away to meet so many talented folks in Mumbai. In my head, I did not belong in this place.
I had imposter syndrome and felt like an outsider trying to make it in a new city. Most people I
met were fluent in more than 1 language, well-dressed, communicated openly and with confidence,
and presented themselves well. I was always in a dilemma when it came to adopting values. It
took me a while to adjust to it but I was still not confident about my work and communication
while my hard skills that I learnt in engineering were top notch. I kept questioning my
abilities but persisted. This was not the first time I was out of my comfort zone. Persist, when
in discomfort.
</p>
<p className="b-news-page__text">
I worked with multiple global companies who were clients of TCS and was presented an opportunity
to move to Scotland, UK for an year to work for GE, who was also a client. This was my first
opportunity to explore a different culture, food, music, languages etc. I remember working on my
english when in Mumbai, in preparation for my UK trip. It was really difficult to understand the
accent in the UK, even though language was not a barrier. I still remember certain words would
just not get across no matter how hard some of my colleagues tried and they would end up using
signs to convey. Be prepared, opportunities come to those who are prepared.
</p>
<p className="b-news-page__text">
In 2013, I came to the US on a dependent visa after marriage and quickly realized the curse of
H4 visa. I paved my path by going back to school at UC Berkeley and then jumped back into
building my career from scratch. While working in the US over the past years, I realized college
degrees with good grades and certifications definitely help you to get your foot in the door but
are not enough to be successful in your career. As I was again starting from scratch in a new
culture, determined to do whatever it takes, having done this a few times before, it doesnt
scare me as much. Never be afraid to start from zero again!
</p>
</div>
</div>
</div>
);
};

View File

@ -1,112 +0,0 @@
import React from 'react';
import type {Metadata, ResolvingMetadata} from 'next';
import { draftMode } from 'next/headers'
import { notFound } from 'next/navigation';
import {fetchBlogPost, fetchBlogPosts, Widget} from "../../../../lib/contentful/blogPosts";
import Util from "node:util";
import RichText from "../../../../lib/contentful/RichText";
import Link from "next/link";
interface BlogPostPageParams {
slug: string
locale: string
}
interface BlogPostPageProps {
params: BlogPostPageParams
}
export async function generateMetadata({ params }: BlogPostPageProps, parent: ResolvingMetadata): Promise<Metadata> {
const blogPost = await fetchBlogPost({ slug: params.slug, preview: draftMode().isEnabled })
if (!blogPost) {
return notFound()
}
return {
title: blogPost.title,
description: blogPost.metaDescription
}
}
function renderWidget (widget: Widget, index: number) {
switch (widget.type){
case 'widgetParagraph':
return (
<div key={'widget'+index} >
<h2 className="title-h2">
{widget.widget.subTitle}
</h2>
<RichText document={widget.widget.body} />
</div>
)
case 'widgetMedia':
return (
<img key={'widget'+index} src={widget.widget.file?.src}/>
)
}
}
export default async function BlogItem({params}: { params: BlogPostPageParams }) {
const item = await fetchBlogPost({slug: params.slug, preview: draftMode().isEnabled })
console.log('BLOG POST')
console.log(Util.inspect(item, {showHidden: false, depth: null, colors: true}))
if (!item) notFound();
return (
<div className="b-news-page">
<div className="b-inner">
<h1 className="b-news-page__title">{item.title}</h1>
<div className="news-item__badge">{item.category}</div>
<div className="b-news-page__text">
</div>
<div className="b-news-page__image">
<img className="" src="/images/news1.png" alt=""/>
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<Link href={`/${params.locale}/experts/${item.author?.expertId}`} className="news-item">
<img className="" src={item.author.avatar.src} alt=""/>
<div className="news-item__info__author__inner">
<div className="news-item__info__name">{item.author?.name}</div>
<div className="news-item__info__date">{item.createdAt}</div>
</div>
</Link>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt=""/>
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt=""/>
Share
</div>
</div>
</div>
<div className="b-news-page__inner">
{item.body.map(renderWidget)}
</div>
</div>
<div className="b-inner" style={ {marginTop: '40px'}}>
<nav className="min-h-6 pb-6">
<Link href='/'>
Home
</Link>
&nbsp;>&nbsp;
<Link href={`/${params.locale}/blog/category/${item.categorySlug}`}>
{item.category}
</Link>
&nbsp;>&nbsp;
<span>
{item.title}
</span>
</nav>
</div>
</div>
);
};

View File

@ -1,29 +0,0 @@
import React from 'react';
import type { Metadata } from 'next';
import { draftMode } from 'next/headers'
import {unstable_setRequestLocale} from "next-intl/server";
import Link from "next/link";
import {fetchBlogPosts} from "../../../../../lib/contentful/blogPosts";
import {fetchBlogPostCategories} from "../../../../../lib/contentful/blogPostsCategories";
import {BlogPosts} from "../../../../../components/BlogPosts/BlogPosts";
export const metadata: Metadata = {
title: 'Bbuddy - Blog',
description: 'Bbuddy desc blog'
};
interface BlogPostPageParams {
slug: string
locale: string
}
interface BlogPostPageProps {
params: BlogPostPageParams
}
export default async function Blog({params, searchParams}: { params: BlogPostPageParams, searhParams?: {page: number} }) {
unstable_setRequestLocale(params.locale);
const page = searchParams.page || undefined
return (
<BlogPosts basePath={'/'+params.locale+'/blog/'} locale={params.locale} currentCat={params.slug} page={page}/>
);
}

View File

@ -1,42 +1,213 @@
import React from 'react';
import type { Metadata } from 'next';
import * as Util from "node:util";
import {fetchBlogPosts} from "../../../lib/contentful/blogPosts";
import {unstable_setRequestLocale} from "next-intl/server";
import Link from "next/link";
import {fetchBlogPostCategories} from "../../../lib/contentful/blogPostsCategories";
import {CustomPagination} from "../../../components/view/CustomPagination";
import {DEFAULT_PAGE_SIZE} from "../../../constants/common";
import {BlogPosts} from "../../../components/BlogPosts/BlogPosts";
interface BlogPostPageParams {
slug: string
}
export const metadata: Metadata = {
title: 'Bbuddy - Blog',
description: 'Bbuddy desc blog'
};
interface BlogPostPageProps {
params: BlogPostPageParams
}
export async function generateStaticParams(): Promise<BlogPostPageParams[]> {
const blogPosts = await fetchBlogPosts({ preview: false })
return blogPosts.data.map((post) => ({ slug: post.slug }))
}
export default async function Blog({ params: { locale }, searchParams }: { params: { locale: string }, searhParams?: {page: number} }) {
unstable_setRequestLocale(locale);
const pageSize = DEFAULT_PAGE_SIZE
const page = searchParams.page || undefined
// BlogPosts('/'+locale+'/blog/', locale, pageSize)
export default function Blog() {
return (
<BlogPosts
basePath={'/'+locale+'/blog/'}
locale={locale}
pageSize={pageSize}
page={page}
>
</BlogPosts>
<div className="b-news">
<div className="b-news__header">
<div className="b-inner">
<h1 className="title-h1">
Mentorship, Career <br />
Development & Coaching.
</h1>
<div className="wrap-text">
<p className="">The ins-and-outs of building a career in tech, gaining <br /> experience</p>
<p className="">from a mentor, and getting your feet wet with coaching.</p>
</div>
<div className="b-news__header__img">
<img className="" src="/images/news-top.png" alt="" />
</div>
</div>
</div>
<div className="b-news__filter ">
<div className="b-inner">
<div className="wrap-filter">
<a href="#" className="filter-item">Leadership & Management</a>
<a href="#" className="filter-item">Professional Development</a>
<a href="#" className="filter-item">Research & Insights</a>
<a href="#" className="filter-item">Well-Being</a>
<a href="#" className="filter-item">Diversity & Inclusion</a>
<a href="#" className="filter-item">Culture</a>
<a href="#" className="filter-item">Sales</a>
<a href="#" className="filter-item">Collaboration</a>
<a href="#" className="filter-item">Hiring</a>
<a href="#" className="filter-item active">BBuddy product</a>
<a href="#" className="filter-item">Customer Stories</a>
<a href="#" className="filter-item">Coaching</a>
</div>
</div>
</div>
<div className="b-news__result-list">
<div className="b-inner">
<div className="news-list">
<a href="#" className="news-item">
<div className="news-item__image">
<img className="" src="/images/news.png" alt="" />
</div>
<div className="news-item__inner">
<div className="">
<div className="news-item__title">
6 learnings from Shivpuri to Silicon Valley
</div>
<div className="news-item__badge">Leadership & Management</div>
<div className="news-item__text">
Im excited to kick off this series of newsletters where Ill be sharing my
experiences,
learnings, and best practices which helped me to grow both in my personal and
professional life. My hope is to give back to the community and help anyone
connect directly with me who may have got impacted with recent layoffs,
dealing with immigration challenges.
</div>
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<img className="" src="/images/author.png" alt="" />
<div className="news-item__info__author__inner">
<div className="news-item__info__name">Sonali Garg</div>
<div className="news-item__info__date">February 6th, 2023</div>
</div>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt="" />
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt="" />
Share
</div>
</div>
</div>
</div>
</a>
<a href="#" className="news-item">
<div className="news-item__image">
<img className="" src="/images/news.png" alt="" />
</div>
<div className="news-item__inner">
<div className="">
<div className="news-item__title">
6 learnings from Shivpuri to Silicon Valley
</div>
<div className="news-item__badge">Leadership & Management</div>
<div className="news-item__text">
Im excited to kick off this series of newsletters where Ill be sharing my
experiences,
learnings, and best practices which helped me to grow both in my personal and
professional life. My hope is to give back to the community and help anyone
connect directly with me who may have got impacted with recent layoffs,
dealing with immigration challenges.
</div>
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<img className="" src="/images/author.png" alt="" />
<div className="news-item__info__author__inner">
<div className="news-item__info__name">Sonali Garg</div>
<div className="news-item__info__date">February 6th, 2023</div>
</div>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt="" />
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt="" />
Share
</div>
</div>
</div>
</div>
</a>
<a href="#" className="news-item">
<div className="news-item__image">
<img className="" src="/images/news.png" alt="" />
</div>
<div className="news-item__inner">
<div className="">
<div className="news-item__title">
6 learnings from Shivpuri to Silicon Valley
</div>
<div className="news-item__badge">Leadership & Management</div>
<div className="news-item__text">
Im excited to kick off this series of newsletters where Ill be sharing my
experiences,
learnings, and best practices which helped me to grow both in my personal and
professional life. My hope is to give back to the community and help anyone
connect directly with me who may have got impacted with recent layoffs,
dealing with immigration challenges.
</div>
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<img className="" src="/images/author.png" alt="" />
<div className="news-item__info__author__inner">
<div className="news-item__info__name">Sonali Garg</div>
<div className="news-item__info__date">February 6th, 2023</div>
</div>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt="" />
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt="" />
Share
</div>
</div>
</div>
</div>
</a>
<a href="#" className="news-item">
<div className="news-item__image">
<img className="" src="/images/news.png" alt="" />
</div>
<div className="news-item__inner">
<div className="">
<div className="news-item__title">
6 learnings from Shivpuri to Silicon Valley
</div>
<div className="news-item__badge">Leadership & Management</div>
<div className="news-item__text">
Im excited to kick off this series of newsletters where Ill be sharing my
experiences,
learnings, and best practices which helped me to grow both in my personal and
professional life. My hope is to give back to the community and help anyone
connect directly with me who may have got impacted with recent layoffs,
dealing with immigration challenges.
</div>
</div>
<div className="news-item__info">
<div className="news-item__info__author">
<img className="" src="/images/author.png" alt="" />
<div className="news-item__info__author__inner">
<div className="news-item__info__name">Sonali Garg</div>
<div className="news-item__info__date">February 6th, 2023</div>
</div>
</div>
<div className="news-item__info__counter">
<div className="news-item__info__like">
<img className="" src="/images/heart-outline.svg" alt="" />
165
</div>
<div className="news-item__info__share">
<img className="" src="/images/share-social.svg" alt="" />
Share
</div>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
);
}

View File

@ -1,16 +1,15 @@
import React, { Suspense } from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { notFound } from 'next/navigation';
import { getExpertById, getExpertsList } from '../../../../actions/experts';
import {
ExpertCard,
ExpertCertificate,
ExpertInformation,
ExpertPractice
} from '../../../../components/Experts/ExpertDetails';
import { Details } from '../../../../types/education';
import { Details } from '../../../../types/experts';
import { BackButton } from '../../../../components/view/BackButton';
import { i18nText } from '../../../../i18nKeys';
export const metadata: Metadata = {
title: 'Bbuddy - Experts item',
@ -20,9 +19,16 @@ export const metadata: Metadata = {
export async function generateStaticParams({
params: { locale },
}: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
const result: { locale: string, expertId: string }[] = [];
const experts = await getExpertsList(locale, { themesTagIds: [] });
const experts = await getExpertsList({
"themesTagIds": [
1,2,3,4,5,6,7,8
],
"priceFrom": null,
"priceTo": null,
"durationFrom": null,
"durationTo": null
}, locale);
experts?.coaches?.forEach(({ id }) => {
result.push({ locale, expertId: id.toString() });
@ -31,7 +37,7 @@ export async function generateStaticParams({
return result;
}
export default async function ExpertItem({ params: { expertId = '', locale } }: { params: { expertId: string, locale: string } }) {
export default async function ExpertItem({ params: { expertId = '', locale} }: { params: { expertId: string, locale: string } }) {
if (!expertId) notFound();
const expert = await getExpertById(expertId, locale);
@ -75,15 +81,16 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
<div className="b-inner">
<div className="b-page__back">
<Suspense>
<BackButton className="btn-back btn-back__auto">
<BackButton className="btn-back">
<img src="/images/arrow-back.svg" className="" alt="" />
{i18nText('backToExperts', locale)}
Back to experts list
</BackButton>
</Suspense>
</div>
<ExpertCard expert={expert} locale={locale} expertId={expertId}/>
<ExpertCard expert={expert} />
<ExpertInformation expert={expert} locale={locale} />
<h2 className="title-h2">{i18nText('expertBackground', locale)}</h2>
<h2 className="title-h2">Expert Background</h2>
<p className="base-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
malesuada, ligula sem tempor risus, non posuere urna diam a libero.
@ -91,7 +98,7 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
{expert?.publicCoachDetails?.educations && expert.publicCoachDetails.educations?.map(generateDescription)}
{expert?.publicCoachDetails?.certificates && expert.publicCoachDetails.certificates.length > 0 && (
<div>
<h3 className="title-h3">{i18nText('profCertification', locale)}</h3>
<h3 className="title-h3">Professional Certification</h3>
{expert.publicCoachDetails.certificates?.map((cert) => (
<div key={cert.id}>
<p className="base-text">
@ -109,13 +116,9 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
{expert?.publicCoachDetails?.trainings && expert.publicCoachDetails.trainings?.map(generateDescription)}
{expert?.publicCoachDetails?.mbas && expert.publicCoachDetails.mbas?.map(generateDescription)}
{expert?.publicCoachDetails?.experiences && expert.publicCoachDetails.experiences?.map(generateDescription)}
<ExpertPractice
themes={expert?.publicCoachDetails?.themesGroups}
cases={expert?.publicCoachDetails?.practiceCases}
locale={locale}
/>
<ExpertPractice expert={expert} />
{/* <h2 className="title-h2">All Offers by this Expert</h2>
<h2 className="title-h2">All Offers by this Expert</h2>
<div className="offers-list">
<div className="card-profile">
<div className="card-profile__skills">
@ -161,7 +164,7 @@ export default async function ExpertItem({ params: { expertId = '', locale } }:
</a>
</div>
</div>
</div> */}
</div>
</div>
</div>
);

View File

@ -1,6 +1,5 @@
import React from 'react';
import type { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { useTranslations } from 'next-intl';
import { Experts } from '../../../components/Experts/Experts';
@ -9,8 +8,7 @@ export const metadata: Metadata = {
description: 'Bbuddy desc experts'
};
export default function ExpertsPage({ params: { locale } }: { params: { locale: string } }) {
unstable_setRequestLocale(locale);
export default function ExpertsPage({ params }: { params: { locale: string } }) {
const t = useTranslations('Experts');
return (
@ -24,7 +22,7 @@ export default function ExpertsPage({ params: { locale } }: { params: { locale:
</div>
</div>
<Experts
locale={locale}
locale={params.locale}
basePath="/experts"
/>
</div>

View File

@ -1,4 +1,4 @@
import React, { ReactNode, Suspense } from 'react';
import React, { ReactNode } from 'react';
import { Metadata } from 'next';
import { unstable_setRequestLocale } from 'next-intl/server';
import { notFound } from 'next/navigation';
@ -6,7 +6,10 @@ import { ConfigProvider } from 'antd';
import { AntdRegistry } from '@ant-design/nextjs-registry';
import theme from '../../constants/theme';
import { ALLOWED_LOCALES } from '../../constants/locale';
import { Header, Footer, AppConfig } from '../../components/Page';
import { Header, Footer } from '../../components/Page';
import { GoogleOAuthProvider } from '@react-oauth/google';
import { SessionProvider } from "next-auth/react"
type LayoutProps = {
children: ReactNode;
@ -28,18 +31,17 @@ export default function LocaleLayout({ children, params: { locale } }: LayoutPro
return (
<AntdRegistry>
<ConfigProvider theme={theme}>
<GoogleOAuthProvider clientId='909563069647-03rivr8k1jmirf382bcfehegamthcfg4.apps.googleusercontent.com'>
<ConfigProvider theme={theme}>
<div className="b-wrapper">
<Suspense fallback={null}>
<AppConfig />
</Suspense>
<div className="b-content">
<Header locale={locale} />
{children}
</div>
<Footer locale={locale} />
</div>
</ConfigProvider>
</ConfigProvider>
</GoogleOAuthProvider>
</AntdRegistry>
);
}
};

View File

@ -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 });
}

View File

@ -1,5 +1,4 @@
import React, { ReactNode } from 'react';
import type { Metadata } from 'next';
import { comfortaa, inter } from './fonts';
import '../styles/style.scss';
@ -8,11 +7,6 @@ type RootLayoutProps = {
params: { locale: string };
};
export const metadata: Metadata = {
title: 'Bbuddy',
description: 'Bbuddy'
};
export default function RootLayout({ children, params: { locale } }: RootLayoutProps) {
return (
<html lang={locale} className={`${comfortaa.variable} ${inter.variable}`}>

View File

@ -6,4 +6,4 @@ export default function Loading() {
...loading
</div>
);
};
}

View File

@ -1,27 +0,0 @@
import { fetchBlogPosts } from '../lib/contentful/blogPosts';
export default async function sitemap() {
const paths = [
{
url: process.env.NEXT_PUBLIC_HOST,
lastModified: new Date(),
changeFrequency: "monthly",
priority: 1
}
]
const blogPosts = await fetchBlogPosts({ preview: false })
blogPosts.data.forEach((item) => {
paths.push({
url: `${process.env.NEXT_PUBLIC_HOST}${item.slug}`,
lastModified: item.createdAt.split('T')[0],
changeFrequency: 'daily',
priority: '1.0'
})
})
return paths
}

View File

@ -1,18 +1,29 @@
'use client';
import React from 'react';
import styled from 'styled-components';
import { Button } from 'antd';
import { useSelectedLayoutSegment, usePathname } from 'next/navigation';
import { Link } from '../../navigation';
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../constants/common';
import { deleteStorageKey } from '../../hooks/useLocalStorage';
import { i18nText } from '../../i18nKeys';
import { getMenuConfig } from '../../utils/account';
export const AccountMenu = ({ locale }: { locale: string }) => {
const Logout = styled(Button)`
width: 100%;
height: 49px !important;
color: #D93E5C !important;
font-style: normal;
font-weight: 600 !important;
padding: 0 !important;
font-size: 1.125rem !important;
text-align: left !important;
`;
export const AccountMenu = ({ menu, locale }: { menu: { path: string, title: string, count?: number }[], locale: string }) => {
const selectedLayoutSegment = useSelectedLayoutSegment();
const pathname = selectedLayoutSegment || '';
const paths = usePathname();
const menu: { path: string, title: string, count?: number }[] = getMenuConfig(locale);
const onLogout = () => {
deleteStorageKey(AUTH_TOKEN_KEY);
@ -20,6 +31,10 @@ export const AccountMenu = ({ locale }: { locale: string }) => {
window?.location?.replace(`/${paths.split('/')[1]}/`);
};
const onDeleteAccount = () => {
console.log('delete');
};
return (
<ul className="list-sidebar">
{menu.map(({ path, title, count }) => (
@ -33,13 +48,20 @@ export const AccountMenu = ({ locale }: { locale: string }) => {
</li>
))}
<li className="list-sidebar__item">
<Button
<Logout
type="link"
onClick={onLogout}
className="b-button__logout"
>
{i18nText('logout', locale)}
</Button>
</Logout>
</li>
<li className="list-sidebar__item">
<Logout
type="link"
onClick={onDeleteAccount}
>
{i18nText('deleteAcc', locale)}
</Logout>
</li>
</ul>
);

View File

@ -1,20 +0,0 @@
'use client'
import { ReactNode, useEffect } from 'react';
import { notFound } from 'next/navigation';
import { AUTH_TOKEN_KEY } from '../../constants/common';
import { useLocalStorage } from '../../hooks/useLocalStorage';
function AccountWrapper ({ children }: { children: ReactNode }) {
const [token] = useLocalStorage(AUTH_TOKEN_KEY, '');
useEffect(() => {
if(!token){
return notFound();
}
}, []);
return children;
}
export default AccountWrapper;

View File

@ -1,36 +1,25 @@
'use client';
import React, { FC, useEffect, useState } from 'react';
import { Form, message, Upload } from 'antd';
import type { UploadFile } from 'antd';
import { Form, Upload, Button } from 'antd';
import type { UploadFile, UploadProps } from 'antd';
import ImgCrop from 'antd-img-crop';
import { CameraOutlined, DeleteOutlined } from '@ant-design/icons';
import { useRouter } from '../../navigation';
import { i18nText } from '../../i18nKeys';
import { ProfileRequest } from '../../types/profile';
import { validateImage } from '../../utils/account';
import { useProfileSettings } from '../../actions/hooks/useProfileSettings';
import { CameraOutlined } from '@ant-design/icons';
import { Link } from '../../navigation';
import { CustomInput } from '../view/CustomInput';
import { OutlinedButton } from '../view/OutlinedButton';
import { FilledSquareButton, FilledYellowButton } from '../view/FilledButton';
import { DeleteAccountModal } from '../Modals/DeleteAccountModal';
import { Loader } from '../view/Loader';
import { Profile } from '../../types/profile';
import { useProfileSettings } from '../../actions/hooks/useProfileSettings';
import { i18nText } from '../../i18nKeys';
type ProfileSettingsProps = {
locale: string;
};
export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
const [form] = Form.useForm<ProfileRequest>();
const { profileSettings, fetchProfileSettings, save, fetchLoading } = useProfileSettings(locale);
const [showDeleteModal, setShowDeleteModal] = useState<boolean>(false);
const [saveLoading, setSaveLoading] = useState<boolean>(false);
const [photo, setPhoto] = useState<UploadFile | undefined>();
const router = useRouter();
// type FileType = Parameters<GetProp<UploadProps, 'beforeUpload'>>[0];
useEffect(() => {
fetchProfileSettings()
}, []);
export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
const [form] = Form.useForm<Profile>();
const { profileSettings } = useProfileSettings(locale);
useEffect(() => {
if (profileSettings) {
@ -38,162 +27,72 @@ export const ProfileSettings: FC<ProfileSettingsProps> = ({ locale }) => {
}
}, [profileSettings]);
const onSave = (newProfile: ProfileRequest) => {
setSaveLoading(true);
save(newProfile)
.then(() => {
fetchProfileSettings();
})
.catch(() => {
message.error('Не удалось сохранить изменения');
})
.finally(() => {
setSaveLoading(false);
})
}
const [fileList, setFileList] = useState<UploadFile[]>();
const onSaveProfile = () => {
form.validateFields()
.then(({ login, surname, username }) => {
const { phone, role, languagesLinks } = profileSettings || {};
const newProfile: ProfileRequest = {
phone,
role,
login,
surname,
username,
isPasswordKeepExisting: true,
isFaceImageKeepExisting: true,
languagesLinks: languagesLinks?.map(({ languageId }) => ({ languageId })) || []
};
const onChange: UploadProps['onChange'] = ({ fileList: newFileList }) => {
setFileList(newFileList);
};
if (photo) {
const reader = new FileReader();
reader.readAsDataURL(photo as File);
reader.onloadend = () => {
const newReg = new RegExp('data:image/(png|jpg|jpeg);base64,')
newProfile.faceImage = reader?.result?.replace(newReg, '');
newProfile.isFaceImageKeepExisting = false;
onSave(newProfile);
}
} else {
onSave(newProfile);
}
})
}
const beforeCrop = (file: UploadFile) => {
return validateImage(file, true);
}
const beforeUpload = (file: UploadFile) => {
const isValid = validateImage(file);
if (isValid) {
setPhoto(file);
}
return false;
}
const onDeleteAccount = () => setShowDeleteModal(true);
const onPreview = async (file: UploadFile) => {
// let src = file.url as string;
// if (!src) {
// src = await new Promise((resolve) => {
// const reader = new FileReader();
// reader.readAsDataURL(file.originFileObj as FileType);
// reader.onload = () => resolve(reader.result as string);
// });
// }
// const image = new Image();
// image.src = src;
// const imgWindow = window.open(src);
// imgWindow?.document.write(image.outerHTML);
};
return (
<Loader isLoading={fetchLoading} refresh={fetchProfileSettings}>
<Form form={form} className="form-settings">
<ImgCrop
modalTitle="Редактировать"
modalOk="Сохранить"
modalCancel="Отмена"
modalProps={{
okButtonProps: { className: 'b-button__filled_yellow' },
cancelButtonProps: { className: 'b-button__outlined' }
}}
beforeCrop={beforeCrop}
<Form form={form} className="form-settings">
<div className="user-avatar">
<div className="user-avatar__edit" style={profileSettings?.faceImageUrl ? { backgroundImage: `url(${profileSettings.faceImageUrl})` } : undefined}>
<input className="" type="file" id="input-file" />
<label htmlFor="input-file" className="form-label" />
</div>
<div className="user-avatar__text">{i18nText('photoDesc', locale)}</div>
</div>
{/* <ImgCrop rotationSlider>
<Upload
action="https://run.mocky.io/v3/435e224c-44fb-4773-9faf-380c5e6a2188"
fileList={fileList}
onChange={onChange}
onPreview={onPreview}
>
<Upload
fileList={photo ? [photo] : profileSettings?.faceImageUrl ? [
{
uid: profileSettings.faceImageUrl,
name: profileSettings.faceImageUrl,
status: 'done',
url: profileSettings.faceImageUrl
}
] : undefined}
accept=".jpg,.jpeg,.png"
beforeUpload={beforeUpload}
multiple={false}
showUploadList={false}
>
<div className="user-avatar">
<div className="user-avatar__edit" style={photo
? { backgroundImage: `url(${URL.createObjectURL(photo)})` }
: profileSettings?.faceImageUrl ? { backgroundImage: `url(${profileSettings.faceImageUrl})`} : undefined }>
<FilledSquareButton
type="primary"
icon={<CameraOutlined style={{ fontSize: 28 }} />}
/>
</div>
<div className="user-avatar__text">{i18nText('photoDesc', locale)}</div>
</div>
</Upload>
</ImgCrop>
<div className="form-fieldset">
<div className="form-field">
<Form.Item name="username" rules={[
{
required: true,
message: 'Поле не должно быть пустым'
}
]}>
<CustomInput placeholder={i18nText('name', locale)} />
</Form.Item>
</div>
<div className="form-field">
<Form.Item name="surname">
<CustomInput placeholder={i18nText('surname', locale)} />
</Form.Item>
</div>
{/* <div className="form-field">
<Form.Item name="birthday">
<CustomInput placeholder={i18nText('birthday', locale)} />
</Form.Item>
</div> */}
<div className="form-field">
<Form.Item name="login" rules={[
{
required: true,
message: 'Поле не должно быть пустым'
}
]}>
<CustomInput type="email" placeholder="E-mail" />
</Form.Item>
</div>
</div>
<div className="form-actions">
<FilledYellowButton
onClick={onSaveProfile}
loading={saveLoading}
>
{i18nText('save', locale)}
</FilledYellowButton>
<OutlinedButton onClick={() => router.push('settings/change-password')}>
{i18nText('changePass', locale)}
</OutlinedButton>
<OutlinedButton
onClick={onDeleteAccount}
icon={<DeleteOutlined />}
danger
>
{i18nText('deleteAcc', locale)}
</OutlinedButton>
</div>
<DeleteAccountModal
open={showDeleteModal}
handleCancel={() => setShowDeleteModal(false)}
/>
</Form>
</Loader>
<Button icon={<CameraOutlined />}>Click to Upload</Button>
</Upload>
</ImgCrop> */}
<div className="form-field">
<Form.Item name="username">
<CustomInput placeholder={i18nText('name', locale)} />
</Form.Item>
</div>
<div className="form-field">
<Form.Item name="surname">
<CustomInput placeholder={i18nText('surname', locale)} />
</Form.Item>
</div>
{/* <div className="form-field">
<Form.Item name="birthday">
<CustomInput placeholder={i18nText('birthday', locale)} />
</Form.Item>
</div> */}
<div className="form-field">
<Form.Item name="login">
<CustomInput type="email" placeholder="E-mail" />
</Form.Item>
</div>
<div className="form-link">
<Link href={'change-password' as any}>
{i18nText('changePass', locale)}
</Link>
</div>
<button className="btn-apply">{i18nText('save', locale)}</button>
</Form>
);
};

View File

@ -1,6 +1,6 @@
'use client';
import React, { useCallback, useEffect, useState, MouseEvent } from 'react';
import React, { useCallback, useEffect, useState } from 'react';
import { Empty, Space } from 'antd';
import dayjs from 'dayjs';
import 'dayjs/locale/ru';
@ -9,29 +9,21 @@ import 'dayjs/locale/de';
import 'dayjs/locale/it';
import 'dayjs/locale/fr';
import 'dayjs/locale/es';
import { Loader } from '../../view/Loader';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../../constants/common';
import { getRecentSessions, getRequestedSessions, getUpcomingSessions } from '../../../actions/sessions';
import { Session, Sessions, SessionType } from '../../../types/sessions';
import { useRouter, usePathname } from '../../../navigation';
import { i18nText } from '../../../i18nKeys';
import { Loader } from '../view/Loader';
import { useLocalStorage } from '../../hooks/useLocalStorage';
import { AUTH_TOKEN_KEY, AUTH_USER } from '../../constants/common';
import { getRecentSessions, getRequestedSessions, getUpcomingSessions } from '../../actions/profile';
import { Session, Sessions, SessionType } from '../../types/sessions';
import { i18nText } from '../../i18nKeys';
type SessionsTabsProps = {
locale: string;
activeTab: SessionType;
};
export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
export const SessionsTabs = ({ locale }: { locale: string }) => {
const [activeTab, setActiveTab] = useState<number>(0);
const [sort, setSort] = useState<string>();
const [sessions, setSessions] = useState<Sessions>();
const [loading, setLoading] = useState<boolean>(true);
const [errorData, setErrorData] = useState<any>();
const [jwt] = useLocalStorage(AUTH_TOKEN_KEY, '');
const [userData] = useLocalStorage(AUTH_USER, '');
const { id: userId = 0 } = userData ? JSON.parse(userData) : {};
const router = useRouter();
const pathname = usePathname();
const [userId] = useLocalStorage(AUTH_USER, '');
const fetchData = () => {
setErrorData(undefined);
@ -43,9 +35,9 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
])
.then(([upcoming, requested, recent]) => {
setSessions({
[SessionType.UPCOMING]: upcoming || [],
[SessionType.REQUESTED]: requested?.requestedSessions || [],
[SessionType.RECENT]: recent || []
[SessionType.UPCOMING]: upcoming.data || [],
[SessionType.REQUESTED]: requested.data?.requestedSessions || [],
[SessionType.RECENT]: recent.data || []
});
})
.catch((err) => {
@ -64,12 +56,6 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
setSort(value);
}, [sort]);
const onClickSession = (event: MouseEvent<HTMLDivElement>, id: number) => {
event.stopPropagation();
event.preventDefault();
router.push(`${pathname}/${id}`);
};
const getChildren = (list?: Session[]) => (
<>
{/* <div className="filter-session">
@ -96,7 +82,7 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
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 key={id} className="card-profile session__item">
<div className="card-profile__header">
<div className="card-profile__header__portrait">
<img src={current?.faceImageUrl || '/images/person.png'} className="" alt="" />
@ -116,7 +102,7 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
</div>
)
}) : (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={i18nText('noData', locale)} />
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
)}
</div>
</>
@ -157,17 +143,17 @@ export const SessionsTabs = ({ locale, activeTab }: SessionsTabsProps) => {
refresh={fetchData}
>
<div className="tabs-session">
{tabs.map(({ key, label }) => (
{tabs.map((tab, index) => (
<Space
key={key}
className={`tabs-session__item ${key === activeTab ? 'active' : ''}`}
onClick={() => router.push(`/account/sessions/${key}`)}
key={index}
className={`tabs-session__item ${index === activeTab ? 'active' : ''}`}
onClick={() => setActiveTab(index)}
>
{label}
{tab.label}
</Space>
))}
</div>
{tabs.filter(({ key }) => key === activeTab)[0].children}
{tabs[activeTab].children}
</Loader>
);
};

View File

@ -1,59 +0,0 @@
'use client'
import { useJoin } from 'agora-rtc-react';
import { useEffect, useState } from 'react';
import { MediaControl } from './view';
import { LocalUserPanel, RemoteUserPanel } from './components';
import { PublicUser } from '../../../types/sessions';
type AgoraProps = {
sessionId: number;
secret?: string;
stopCalling: () => void;
remoteUser?: PublicUser;
};
export const Agora = ({ sessionId, secret, stopCalling, remoteUser }: 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: `${sessionId}-${secret}`,
token: null,
},
calling,
);
const stop = () => {
stopCalling();
setCalling(false);
};
return (
<div className="b-agora__wrap b-agora__wrap__single">
<RemoteUserPanel calling={calling} user={remoteUser} />
<div className="b-agora__panel">
<MediaControl
calling={calling}
cameraOn={cameraOn}
micOn={micOn}
setCalling={stop}
setCamera={() => setCamera(a => !a)}
setMic={() => setMic(a => !a)}
/>
<LocalUserPanel
calling={calling}
cameraOn={cameraOn}
micOn={micOn}
/>
</div>
</div>
);
};

View File

@ -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>
</>
);
};

View File

@ -1,30 +0,0 @@
import { useEffect } from 'react';
import { ICameraVideoTrack, LocalVideoTrack, LocalVideoTrackProps, MaybePromiseOrNull } from 'agora-rtc-react';
import { useAwaited } from '../../../../utils/agora/tools';
interface CameraVideoTrackProps extends LocalVideoTrackProps {
/**
* A camera video track which can be created by `createCameraVideoTrack()`.
*/
readonly track?: MaybePromiseOrNull<ICameraVideoTrack>;
/**
* Device ID, which can be retrieved by calling `getDevices()`.
*/
readonly deviceId?: string;
}
export const CameraVideoTrack = ({
track: maybeTrack,
deviceId,
...props
}: CameraVideoTrackProps) => {
const track = useAwaited(maybeTrack);
useEffect(() => {
if (track && deviceId != null) {
track.setDevice(deviceId).catch(console.warn);
}
}, [deviceId, track]);
return <LocalVideoTrack track={maybeTrack} {...props} />;
};

View File

@ -1,108 +0,0 @@
import { HTMLProps, ReactNode } from 'react';
import { ICameraVideoTrack, IMicrophoneAudioTrack, MaybePromiseOrNull } from 'agora-rtc-react';
import { UserCover } from '../components';
import { MicrophoneAudioTrack } from './MicrophoneAudioTrack';
import { CameraVideoTrack } from './CameraVideoTrack';
interface LocalUserProps extends HTMLProps<HTMLDivElement> {
/**
* Whether to turn on the local user's microphone. Default false.
*/
readonly micOn?: boolean;
/**
* Whether to turn on the local user's camera. Default false.
*/
readonly cameraOn?: boolean;
/**
* A microphone audio track which can be created by `createMicrophoneAudioTrack()`.
*/
readonly audioTrack?: MaybePromiseOrNull<IMicrophoneAudioTrack>;
/**
* A camera video track which can be created by `createCameraVideoTrack()`.
*/
readonly videoTrack?: MaybePromiseOrNull<ICameraVideoTrack>;
/**
* Whether to play the local user's audio track. Default follows `micOn`.
*/
readonly playAudio?: boolean;
/**
* Whether to play the local user's video track. Default follows `cameraOn`.
*/
readonly playVideo?: boolean;
/**
* Device ID, which can be retrieved by calling `getDevices()`.
*/
readonly micDeviceId?: string;
/**
* Device ID, which can be retrieved by calling `getDevices()`.
*/
readonly cameraDeviceId?: string;
/**
* The volume. The value ranges from 0 (mute) to 1000 (maximum). A value of 100 is the current volume.
*/
readonly volume?: number;
/**
* Render cover image if playVideo is off.
*/
readonly cover?: string;
/**
* Children is rendered on top of the video canvas.
*/
readonly children?: ReactNode;
}
/**
* Play/Stop local user camera and microphone track.
*/
export function LocalUser({
micOn,
cameraOn,
audioTrack,
videoTrack,
playAudio = false,
playVideo,
micDeviceId,
cameraDeviceId,
volume,
cover,
children,
style,
...props
}: LocalUserProps) {
playVideo = playVideo ?? !!cameraOn;
playAudio = playAudio ?? !!micOn;
return (
<div {...props} style={{
position: "relative",
width: "100%",
height: "100%",
overflow: "hidden",
background: "#000",
...style
}}>
<CameraVideoTrack
deviceId={cameraDeviceId}
disabled={!cameraOn}
play={playVideo}
track={videoTrack}
/>
<MicrophoneAudioTrack
deviceId={micDeviceId}
disabled={!micOn}
play={playAudio}
track={audioTrack}
volume={volume}
/>
{cover && !cameraOn && <UserCover cover={cover} />}
<div style={{
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%",
overflow: "hidden",
zIndex: 2,
}}>{children}</div>
</div>
);
};

View File

@ -1,43 +0,0 @@
import { useLocalMicrophoneTrack, useLocalCameraTrack, usePublish, useIsConnected } from 'agora-rtc-react';
import { UserOutlined } from '@ant-design/icons';
import { useLocalStorage } from '../../../../hooks/useLocalStorage';
import { AUTH_USER } from '../../../../constants/common';
import { LocalUser } from './LocalUser';
type LocalUserPanelProps = {
calling: boolean;
micOn: boolean;
cameraOn: boolean;
};
export const LocalUserPanel = ({
calling,
micOn,
cameraOn
}: LocalUserPanelProps) => {
const isConnected = useIsConnected();
const [userData] = useLocalStorage(AUTH_USER, '');
const { faceImageUrl: userImage = '' } = userData ? JSON.parse(userData) : {};
const { localMicrophoneTrack } = useLocalMicrophoneTrack(micOn);
const { localCameraTrack } = useLocalCameraTrack(cameraOn);
usePublish([localMicrophoneTrack, localCameraTrack]);
return calling && isConnected ? (
<div className="b-agora__local_user">
{!cameraOn && (
<div className="b-agora__local_base">
<div className="b-agora__call_avatar" style={userImage ? { backgroundImage: `url(${userImage})` } : undefined}>
{!userImage && (<UserOutlined style={{ fontSize: 40, color: '#2C7873' }}/>)}
</div>
</div>
)}
<LocalUser
audioTrack={localMicrophoneTrack}
cameraOn={cameraOn}
micOn={micOn}
videoTrack={localCameraTrack}
/>
</div>
) : null;
};

View File

@ -1,32 +0,0 @@
import { ReactNode, useEffect } from 'react';
import { IMicrophoneAudioTrack, LocalAudioTrack, LocalAudioTrackProps, MaybePromiseOrNull } from 'agora-rtc-react';
import { useAwaited } from '../../../../utils/agora/tools';
interface MicrophoneAudioTrackProps extends LocalAudioTrackProps {
/**
* A microphone audio track which can be created by `createMicrophoneAudioTrack()`.
*/
readonly track?: MaybePromiseOrNull<IMicrophoneAudioTrack>;
/**
* Device ID, which can be retrieved by calling `getDevices()`.
*/
readonly deviceId?: string;
readonly children?: ReactNode;
}
export const MicrophoneAudioTrack = ({
track: maybeTrack,
deviceId,
...props
}: MicrophoneAudioTrackProps) => {
const track = useAwaited(maybeTrack);
useEffect(() => {
if (track && deviceId != null) {
track.setDevice(deviceId).catch(console.warn);
}
}, [deviceId, track]);
return <LocalAudioTrack track={maybeTrack} {...props} />;
};

View File

@ -1,36 +0,0 @@
import { UserOutlined } from '@ant-design/icons';
import {
useIsConnected,
useRemoteAudioTracks,
useRemoteUsers,
useRemoteVideoTracks
} from 'agora-rtc-react';
import { RenderRemoteUsers } from './RemoteUsers';
import { PublicUser } from '../../../../types/sessions';
export const RemoteUserPanel = ({ calling, user }: { calling: boolean, user?: PublicUser }) => {
const isConnected = useIsConnected();
const remoteUsers = useRemoteUsers();
const { videoTracks } = useRemoteVideoTracks(remoteUsers);
const { audioTracks } = useRemoteAudioTracks(remoteUsers);
audioTracks.map(track => track.play());
return calling && isConnected ? (
<div className="b-agora__remote_user">
{videoTracks?.length > 0 ? (
<RenderRemoteUsers videoTracks={videoTracks} />
) : (
<div className="b-agora__remote_base">
{remoteUsers?.length === 0 && (
<div className="b-agora__remote_warning">
Ожидайте подключения собеседника
</div>
)}
<div className="b-agora__call_avatar" style={user?.faceImageUrl ? { backgroundImage: `url(${user.faceImageUrl})` } : undefined}>
{!user?.faceImageUrl && (<UserOutlined style={{ fontSize: 40, color: '#2C7873' }}/>)}
</div>
</div>
)}
</div>
) : null;
}

View File

@ -1,12 +0,0 @@
import type { IRemoteVideoTrack } from 'agora-rtc-react';
import { RemoteVideoPlayer } from './RemoteVideoPlayer';
export function RenderRemoteUsers({ videoTracks }: { videoTracks: IRemoteVideoTrack[] }) {
return (
<>
{videoTracks.map((track: IRemoteVideoTrack) => (
<RemoteVideoPlayer key={track.getUserId()} track={track} className="b-agora__video_remote" />
))}
</>
);
}

View File

@ -1,68 +0,0 @@
import type { HTMLProps, ReactNode } from 'react';
import type { IAgoraRTCClient, IRemoteVideoTrack } from 'agora-rtc-react';
import { RemoteVideoTrack, useRTCClient } from 'agora-rtc-react';
import { UserCover } from '../components';
export interface RemoteVideoPlayerProps extends HTMLProps<HTMLDivElement> {
/**
* A remote track
*/
readonly track?: IRemoteVideoTrack;
/**
* Whether to play the remote user's video track. Default follows `user.hasVideo`.
*/
readonly playVideo?: boolean;
/**
* Render cover image if playVideo is off.
*/
readonly cover?: string | (() => ReactNode);
/**
* Children is rendered on top of the video canvas.
*/
readonly children?: ReactNode;
/**
* client instance
*/
readonly client?: IAgoraRTCClient | null;
}
/**
* Subscribe and play remote user video track.
* An `IRemoteVideoTrack` can only be own by one `RemoteVideoPlayer`.
*/
export function RemoteVideoPlayer({
track,
playVideo,
cover,
client,
style,
children,
...props
}: RemoteVideoPlayerProps) {
const resolvedClient = useRTCClient(client);
const hasVideo = resolvedClient.remoteUsers?.find(user => user.uid === track?.getUserId())?.hasVideo;
playVideo = playVideo ?? hasVideo;
return (
<div {...props} style={{
position: "relative",
width: "100%",
height: "100%",
overflow: "hidden",
background: "#000",
...style
}}>
<RemoteVideoTrack play={playVideo} track={track} />
{cover && !playVideo && <UserCover cover={cover} />}
<div style={{
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%",
overflow: "hidden",
zIndex: 2,
}}>{children}</div>
</div>
);
};

View File

@ -1,56 +0,0 @@
import type { CSSProperties, ReactNode } from 'react';
export const FloatBoxStyle: CSSProperties = {
position: "absolute",
top: 0,
left: 0,
width: "100%",
height: "100%",
overflow: "hidden",
zIndex: 2,
};
const CoverBlurStyle: CSSProperties = {
width: "100%",
height: "100%",
background: "#1a1e21 center/cover no-repeat",
filter: "blur(16px) brightness(0.4)",
};
const CoverImgStyle: CSSProperties = {
position: "absolute",
top: "50%",
left: "50%",
maxWidth: "50%",
maxHeight: "50%",
aspectRatio: "1",
transform: "translate(-50%, -50%)",
borderRadius: "50%",
overflow: "hidden",
objectFit: "cover",
};
export interface UserCoverProps {
/**
* Cover image url or a custom render function.
*/
cover: string | (() => ReactNode);
}
/**
* User Cover image with blur background
*/
export function UserCover({ cover }: UserCoverProps) {
return (
<div style={FloatBoxStyle}>
{typeof cover === "string" ? (
<>
<div style={{ ...CoverBlurStyle, backgroundImage: `url(${cover})` }} />
<img src={cover} style={CoverImgStyle} />
</>
) : (
cover()
)}
</div>
);
}

View File

@ -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;
}

View File

@ -1,6 +0,0 @@
export * from './RemoteVideoPlayer';
export * from './UserCover';
export * from './RemoteUsers';
export * from './LocalUserPanel';
export * from './RemoteUserPanel';
export * from './UsersGroupPanel';

View File

@ -1,61 +0,0 @@
'use client'
import React from 'react';
import Icon from '@ant-design/icons';
import type { GetProps } from 'antd';
type CustomIconComponentProps = GetProps<typeof Icon>;
const MicOnSvg = () => (
<svg viewBox="0 0 24 24" width="1em" height="1em" fill="none">
<path d="M9 21H15M18 9.75V11.25C18 14.55 15.3 17.25 12 17.25C8.7 17.25 6 14.55 6 11.25V9.75M12 17.25V21" stroke="currentColor" strokeMiterlimit="10" strokeLinecap="square"/>
<path d="M12 15C11.505 14.9989 11.0153 14.8983 10.56 14.7042C10.1046 14.5102 9.6929 14.2266 9.34925 13.8703C8.64573 13.1608 8.2507 12.2023 8.25003 11.2032V6.00003C8.24811 5.50703 8.34379 5.01853 8.53157 4.5627C8.71934 4.10686 8.99549 3.6927 9.34409 3.34409C9.6927 2.99549 10.1069 2.71934 10.5627 2.53157C11.0185 2.34379 11.507 2.24811 12 2.25003C14.1028 2.25003 15.75 3.89722 15.75 6.00003V11.2032C15.75 13.2966 14.0677 15 12 15Z" fill="currentColor"/>
</svg>
);
const MicOffSvg = () => (
<svg width="1em" height="1em" viewBox="0 0 25 25" fill="none">
<path d="M10 22H16M19 10.75V12.25C19 15.55 16.3 18.25 13 18.25C9.7 18.25 7 15.55 7 12.25V10.75M13 18.25V22" stroke="currentColor" strokeMiterlimit="10" strokeLinecap="square"/>
<path d="M13 16C12.505 15.9989 12.0153 15.8983 11.56 15.7042C11.1046 15.5102 10.6929 15.2266 10.3492 14.8703C9.64573 14.1608 9.2507 13.2023 9.25003 12.2032V7.00003C9.24811 6.50703 9.34379 6.01853 9.53157 5.5627C9.71934 5.10686 9.99549 4.6927 10.3441 4.34409C10.6927 3.99549 11.1069 3.71934 11.5627 3.53157C12.0185 3.34379 12.507 3.24811 13 3.25003C15.1028 3.25003 16.75 4.89722 16.75 7.00003V12.2032C16.75 14.2966 15.0677 16 13 16Z" fill="currentColor"/>
<rect x="23.3135" y="0.476074" width="2" height="32" rx="1" transform="rotate(45 23.3135 0.476074)" fill="currentColor"/>
</svg>
);
const CameraOnSvg = () => (
<svg width="1em" height="1em" viewBox="0 0 24 14" fill="none">
<path d="M21.75 13.0183C21.54 13.0181 21.3324 12.9739 21.1406 12.8884C21.096 12.8686 21.0534 12.8444 21.0136 12.8162L17.1366 10.0872C16.9399 9.94878 16.7795 9.76513 16.6687 9.55172C16.5579 9.33831 16.5001 9.10139 16.5 8.86094V5.13906C16.5001 4.89861 16.5579 4.66169 16.6687 4.44828C16.7795 4.23487 16.9399 4.05122 17.1366 3.91281L21.0136 1.18375C21.0534 1.15555 21.096 1.13137 21.1406 1.11156C21.369 1.01003 21.6191 0.967168 21.8683 0.986876C22.1174 1.00658 22.3577 1.08824 22.5673 1.22441C22.7769 1.36059 22.9491 1.54697 23.0683 1.76663C23.1875 1.98629 23.25 2.23226 23.25 2.48219V11.5178C23.25 11.9156 23.092 12.2972 22.8107 12.5785C22.5294 12.8598 22.1478 13.0178 21.75 13.0178V13.0183ZM12.5625 13.75H3.9375C3.09239 13.7491 2.28214 13.413 1.68456 12.8154C1.08697 12.2179 0.750869 11.4076 0.75 10.5625V3.4375C0.750869 2.59239 1.08697 1.78214 1.68456 1.18456C2.28214 0.586973 3.09239 0.250869 3.9375 0.25H12.585C13.4241 0.250992 14.2286 0.584765 14.8219 1.1781C15.4152 1.77144 15.749 2.57589 15.75 3.415V10.5625C15.7491 11.4076 15.413 12.2179 14.8154 12.8154C14.2179 13.413 13.4076 13.7491 12.5625 13.75Z" fill="currentColor"/>
</svg>
);
const CameraOffSvg = () => (
<svg width="1em" height="1em" viewBox="0 0 25 25" fill="none">
<path d="M22.75 19.0183C22.54 19.0181 22.3324 18.9739 22.1406 18.8884C22.096 18.8686 22.0534 18.8444 22.0136 18.8162L18.1366 16.0872C17.9399 15.9488 17.7795 15.7651 17.6687 15.5517C17.5579 15.3383 17.5001 15.1014 17.5 14.8609V11.1391C17.5001 10.8986 17.5579 10.6617 17.6687 10.4483C17.7795 10.2349 17.9399 10.0512 18.1366 9.91281L22.0136 7.18375C22.0534 7.15555 22.096 7.13137 22.1406 7.11156C22.369 7.01003 22.6191 6.96717 22.8683 6.98688C23.1174 7.00658 23.3577 7.08824 23.5673 7.22441C23.7769 7.36059 23.9491 7.54697 24.0683 7.76663C24.1875 7.98629 24.25 8.23226 24.25 8.48219V17.5178C24.25 17.9156 24.092 18.2972 23.8107 18.5785C23.5294 18.8598 23.1478 19.0178 22.75 19.0178V19.0183ZM13.5625 19.75H4.9375C4.09239 19.7491 3.28214 19.413 2.68456 18.8154C2.08697 18.2179 1.75087 17.4076 1.75 16.5625V9.4375C1.75087 8.59239 2.08697 7.78214 2.68456 7.18456C3.28214 6.58697 4.09239 6.25087 4.9375 6.25H13.585C14.4241 6.25099 15.2286 6.58477 15.8219 7.1781C16.4152 7.77144 16.749 8.57589 16.75 9.415V16.5625C16.7491 17.4076 16.413 18.2179 15.8154 18.8154C15.2179 19.413 14.4076 19.7491 13.5625 19.75Z" fill="currentColor"/>
<rect x="23.3135" y="0.476074" width="2" height="32" rx="1" transform="rotate(45 23.3135 0.476074)" fill="currentColor"/>
</svg>
);
const PhoneSvg = () => (
<svg width="1em" height="1em" viewBox="0 0 26 11" fill="none">
<path d="M1.10074 4.05002C1.74774 3.40302 2.89061 2.72817 5.01193 2.12757C7.59496 1.40069 9.73186 0.97742 13.0196 0.973112C16.1926 0.972117 17.9918 1.22668 21.0395 2.11266C24.4813 3.11233 25.4373 4.48456 25.7021 5.21476C26.0196 6.08649 25.9663 6.85116 25.7906 7.73283C25.687 8.22986 25.5379 8.71628 25.3451 9.18594C25.3262 9.23334 25.309 9.27775 25.2937 9.31752C25.2036 9.55551 25.0667 9.9158 24.6325 10.1114C24.3435 10.2426 23.9944 10.2688 23.4107 10.2725C22.2145 10.2807 20.0687 9.7809 19.1154 9.43486C18.4737 9.20085 18.0498 9.04673 17.7253 8.72289C17.3457 8.34337 17.244 7.85978 17.1598 7.31221C17.1439 7.20946 17.1303 7.10969 17.117 7.01291C17.0378 6.42921 16.9974 6.27807 16.7899 6.1435C16.3723 5.87369 14.7978 5.4017 12.9881 5.40369C11.1783 5.40568 9.66822 5.88297 9.24959 6.15444C9.03315 6.29464 8.99305 6.4501 8.91217 7.05335C8.90057 7.13986 8.88897 7.22902 8.87505 7.3205C8.78456 7.93668 8.69142 8.40171 8.32085 8.77228L8.31886 8.77427C7.99636 9.09677 7.58038 9.233 6.89228 9.45972C5.99469 9.75538 3.81968 10.3056 2.61914 10.3003C2.03545 10.298 1.68643 10.2731 1.39739 10.1425C0.962193 9.94597 0.826959 9.586 0.734482 9.34702C0.719235 9.30725 0.702662 9.2635 0.683438 9.21577C0.492311 8.7456 0.344854 8.25885 0.242933 7.76167C0.0682546 6.88231 0.0172117 6.11731 0.335741 5.24393C0.497017 4.79315 0.7586 4.38491 1.10074 4.05002Z" fill="currentColor"/>
</svg>
);
export const MicOnIcon = (props: Partial<CustomIconComponentProps>) => (
<Icon component={MicOnSvg} {...props} />
);
export const MicOffIcon = (props: Partial<CustomIconComponentProps>) => (
<Icon component={MicOffSvg} {...props} />
);
export const CameraOnIcon = (props: Partial<CustomIconComponentProps>) => (
<Icon component={CameraOnSvg} {...props} />
);
export const CameraOffIcon = (props: Partial<CustomIconComponentProps>) => (
<Icon component={CameraOffSvg} {...props} />
);
export const PhoneIcon = (props: Partial<CustomIconComponentProps>) => (
<Icon component={PhoneSvg} {...props} />
);

View File

@ -1,38 +0,0 @@
'use client'
import AgoraRTC, { AgoraRTCProvider } from 'agora-rtc-react';
import { Session } from '../../../types/sessions';
import { Room } from '../../../types/rooms';
import { Agora } from './Agora';
import { AgoraGroup } from './AgoraGroup';
export const AgoraClient = ({ session, stopCalling, isCoach }: { session?: Session, stopCalling: () => void, isCoach: boolean }) => {
const remoteUser = isCoach ? (session?.clients?.length ? session?.clients[0] : undefined) : session?.coach;
return session ? (
<AgoraRTCProvider client={AgoraRTC.createClient({ mode: "rtc", codec: "vp8" })}>
{session && (
<Agora
sessionId={session.id}
secret={session.secret}
stopCalling={stopCalling}
remoteUser={remoteUser}
/>
)}
</AgoraRTCProvider>
) : 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;
};

View File

@ -1,49 +0,0 @@
import { Button } from 'antd';
import { MicOffIcon, MicOnIcon, CameraOnIcon, CameraOffIcon, PhoneIcon } from '../icons';
interface MediaControlProps {
calling: boolean;
micOn: boolean;
cameraOn: boolean;
setMic: () => void;
setCamera: () => void;
setCalling: () => void;
}
export const MediaControl = ({
calling,
micOn,
cameraOn,
setMic,
setCamera,
setCalling,
}: MediaControlProps) => (
<div className="b-agora__controls">
<Button
className="b-agora__control"
type="primary"
shape="circle"
icon={micOn ? <MicOnIcon style={{ fontSize: 24, color: '#66A5AD' }} /> : <MicOffIcon style={{ fontSize: 24, color: '#fff' }} />}
danger={!micOn}
size="medium"
onClick={setMic}
/>
<Button
className="b-agora__control_big"
type="primary"
shape="circle"
icon={<PhoneIcon style={{ fontSize: 36, color: calling ? '#fff' : '#66A5AD' }} />}
danger={calling}
onClick={setCalling}
/>
<Button
className="b-agora__control"
type="primary"
shape="circle"
icon={cameraOn ? <CameraOnIcon style={{ fontSize: 24, color: '#66A5AD' }} /> : <CameraOffIcon style={{ fontSize: 24, color: '#fff' }} />}
danger={!cameraOn}
size="medium"
onClick={setCamera}
/>
</div>
);

View File

@ -1 +0,0 @@
export * from "./MediaControl";

View File

@ -1,6 +1,5 @@
'use client'
export { AccountMenu } from './AccountMenu';
export { SessionsTabs } from './SessionsTabs';
export { ProfileSettings } from './ProfileSettings';
export * from './sessions';
export * from './rooms';

View File

@ -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>
)
};

View File

@ -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>
);
};

View File

@ -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>
</>
);
};

View File

@ -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>
);
};

View File

@ -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>
);
};

View File

@ -1,6 +0,0 @@
'use client'
export * from './RoomDetails';
export * from './RoomsTabs';
export * from './RoomDetailsContent';
export * from './CreateRoom';

View File

@ -1,77 +0,0 @@
'use client'
import React, { useState, useEffect } from 'react';
import { SessionType } from '../../../types/sessions';
import { AUTH_USER } from '../../../constants/common';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { Loader } from '../../view/Loader';
import { useSessionDetails } from "../../../actions/hooks/useSessionDetails";
import { AgoraClient } from '../agora';
import { AccountMenu } from '../AccountMenu';
import { SessionDetailsContent } from './SessionDetailsContent';
import { useSessionTracking } from '../../../actions/hooks/useSessionTracking';
type SessionDetailsProps = {
locale: string;
sessionId: number;
activeType: SessionType;
};
export const SessionDetails = ({ sessionId, locale, activeType }: SessionDetailsProps) => {
const { session, errorData, loading, fetchData } = useSessionDetails(locale, sessionId);
const tracking = useSessionTracking(locale, sessionId);
const [isCalling, setIsCalling] = useState<boolean>(false);
const [userData] = useLocalStorage(AUTH_USER, '');
const { id: userId = 0 } = userData ? JSON.parse(userData) : {};
const client = session?.clients?.length ? session?.clients[0] : null;
const isCoach = +userId !== client?.id;
useEffect(() => {
if (isCalling) {
tracking.start();
} else {
tracking.stop();
}
}, [isCalling]);
const stopCalling = () => {
setIsCalling(false);
fetchData()
}
return isCalling
? (
<AgoraClient
session={session}
stopCalling={stopCalling}
isCoach={isCoach}
/>
) : (
<>
<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}
>
{session && (
<SessionDetailsContent
locale={locale}
session={session}
activeType={activeType}
startSession={() => setIsCalling(true)}
refresh={fetchData}
isCoach={isCoach}
/>
)}
</Loader>
</div>
</div>
</>
);
};

Some files were not shown because too many files have changed in this diff Show More