feat: general improvments and additions

easyflow-software · Aug 4, 2024 · 020e215 · 020e215
1 parent 660e014
commit 020e215
Show file tree

Hide file tree

Showing 34 changed files with 303 additions and 276 deletions.
diff --git a/.dockerignore b/.dockerignore
@@ -9,5 +9,4 @@ node_modules
 example.env
 .env
 next-env.d.ts
-nodemon.json
 README.md
diff --git a/entrypoint.sh b/entrypoint.sh
@@ -3,7 +3,7 @@
 set -e
 
 #Start application
-NODE_ENV=production node dist/server/index.js &
+NODE_ENV=production npx next start &
 
 #Start nginx in the forground
 nginx -g 'daemon off;'
diff --git a/next.config.mjs b/next.config.mjs
@@ -63,6 +63,11 @@ const nextConfig = {
       },
     ];
   },
+  experimental: {
+    serverActions: {
+      allowedOrigins: ['https://easyflow.chat', 'http://localhost:3000'],
+    },
+  },
 };
 
 export default nextConfig;
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -15,6 +15,7 @@
     "@nextui-org/react": "2.4.6",
     "@phosphor-icons/react": "2.1.7",
     "axios": "1.7.2",
+    "classnames": "^2.5.1",
     "formik": "2.4.6",
     "framer-motion": "11.3.18",
     "i18next": "23.12.2",

diff --git a/public/assets/logo.svg b/public/assets/logo.svg
diff --git a/src/app/[locale]/about/page.tsx b/src/app/[locale]/about/page.tsx
@@ -1,6 +1,7 @@
+'use server';
 import { FunctionComponent, ReactElement } from 'react';
 
-const Chat: FunctionComponent = (): ReactElement => {
+const Chat: FunctionComponent = async (): Promise<ReactElement> => {
   return <div>About</div>;
 };
 

diff --git a/src/app/[locale]/actions.ts b/src/app/[locale]/actions.ts
@@ -3,23 +3,34 @@ import { APIOperation } from '@/src/services/api-services/common';
 import { makeRequest } from '@/src/services/api-services/request';
 import { RequestResponse } from '@/src/types/request-response.type';
 import { UserResponse } from '@/src/types/response.types';
-import { cookies } from 'next/headers';
+
+export const checkLogin = async (): Promise<boolean> => {
+  const res = await makeRequest<APIOperation.CHECK_LOGIN>({
+    op: APIOperation.CHECK_LOGIN,
+  });
+  if (!res.success) {
+    return false;
+  }
+  return res.data;
+};
 
 export const getUser = async (): Promise<RequestResponse<UserResponse>> => {
-  const res = await makeRequest<APIOperation.GET_USER, UserResponse>({
+  const res = await makeRequest<APIOperation.GET_USER>({
     op: APIOperation.GET_USER,
   });
   return res;
 };
 
 export const getProfilePicture = async (): Promise<RequestResponse<string>> => {
-  const res = await makeRequest<APIOperation.GET_PROFILE_PICTURE, string>({
+  const res = await makeRequest<APIOperation.GET_PROFILE_PICTURE>({
     op: APIOperation.GET_PROFILE_PICTURE,
   });
   return res;
 };
 
-export const serverLogout = async (): Promise<void> => {
-  cookies().delete('access_token');
-  cookies().delete('refresh_token');
+export const serverLogout = async (): Promise<RequestResponse<void>> => {
+  const res = await makeRequest<APIOperation.LOGOUT>({
+    op: APIOperation.LOGOUT,
+  });
+  return res;
 };
diff --git a/src/app/[locale]/chat/page.tsx b/src/app/[locale]/chat/page.tsx
@@ -1,6 +1,14 @@
+'use sever';
+import { redirect } from 'next/navigation';
 import { FunctionComponent, ReactElement } from 'react';
+import { checkLogin } from '../actions';
+
+const Chat: FunctionComponent = async (): Promise<ReactElement> => {
+  const isLoggedIn = await checkLogin();
+  if (!isLoggedIn) {
+    redirect('/login');
+  }
 
-const Chat: FunctionComponent = (): ReactElement => {
   return <div>Chat</div>;
 };
 

diff --git a/src/app/[locale]/layout.tsx b/src/app/[locale]/layout.tsx
@@ -1,19 +1,19 @@
 import Nav from '@/src/components/nav/Nav';
 import NavWrapper from '@/src/components/nav/NavBarWrapper';
+import cx from 'classnames';
 import { dir } from 'i18next';
 import type { Metadata } from 'next';
 import { Inter } from 'next/font/google';
 import { FunctionComponent, PropsWithChildren, ReactElement } from 'react';
 import '../globals.css';
 import '../i18n';
 import Providers from '../providers';
-import { serverLogout } from './actions';
 
 const inter = Inter({ subsets: ['latin'] });
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
+  title: 'EasyFlow Chat',
+  description: 'The private chat app',
 };
 
 interface RootLayoutProps {
@@ -27,13 +27,13 @@ const RootLayout: FunctionComponent<PropsWithChildren<RootLayoutProps>> = ({
   params: { locale },
 }): ReactElement => {
   return (
-    <html lang={locale} dir={dir(locale)}>
-      <body className={'h-screen w-screen bg-background' + inter.className}>
+    <html lang={locale} dir={dir(locale)} className="h-full w-full">
+      <body className={cx('h-full w-full bg-background', inter.className)}>
         <Providers>
           <NavWrapper params={{ locale }}>
-            <Nav params={{ locale }} serverLogout={serverLogout} />
+            <Nav params={{ locale }} />
           </NavWrapper>
-          <div className="h-[calc(100vh-64px)] overflow-y-auto">{children}</div>
+          <div className="h-full overflow-y-auto">{children}</div>
         </Providers>
       </body>
     </html>

diff --git a/src/app/[locale]/login/actions.ts b/src/app/[locale]/login/actions.ts
@@ -5,8 +5,8 @@ import { makeRequest } from '@/src/services/api-services/request';
 import { RequestResponse } from '@/src/types/request-response.type';
 import { UserResponse } from '@/src/types/response.types';
 
-export const login = async (email?: string, password?: string): Promise<RequestResponse<UserResponse>> => {
-  const res = await makeRequest<APIOperation.LOGIN, UserResponse>({
+export const login = async (email: string, password: string): Promise<RequestResponse<UserResponse>> => {
+  const res = await makeRequest<APIOperation.LOGIN>({
     op: APIOperation.LOGIN,
     payload: { email, password },
   });

diff --git a/src/app/[locale]/login/layout.tsx b/src/app/[locale]/login/layout.tsx
@@ -11,7 +11,7 @@ const RootLayout = ({
   children: React.ReactNode;
   params: { locale: string };
 }>): JSX.Element => {
-  return <main className="flex h-full w-screen items-center justify-center">{children}</main>;
+  return <main className="flex min-h-[calc(100vh-65px)] w-screen items-center justify-center">{children}</main>;
 };
 
 export default RootLayout;
diff --git a/src/app/[locale]/login/page.tsx b/src/app/[locale]/login/page.tsx
@@ -1,10 +1,11 @@
+'use server';
 import LoginForm from '@/src/components/login-form/LoginForm';
 import TranslationsProvider from '@/src/providers/translation-provider/TranslationsProvider';
 import initTranslations from '@i18n';
 import { Card, CardHeader } from '@nextui-org/react';
 import { redirect } from 'next/navigation';
 import { FunctionComponent } from 'react';
-import { getUser } from '../actions';
+import { checkLogin } from '../actions';
 
 interface HomeProps {
   params: {
@@ -17,15 +18,14 @@ const i18nNamespaces = ['login', 'errors'];
 const Home: FunctionComponent<HomeProps> = async ({ params: { locale } }) => {
   const { t, resources } = await initTranslations(locale, i18nNamespaces);
 
-  // Check if user is already logged in
-  const res = await getUser();
-  if (res.success) {
+  const isLoggedIn = await checkLogin();
+  if (isLoggedIn) {
     redirect('/chat');
   }
 
   return (
     <TranslationsProvider resources={resources} locale={locale} namespaces={i18nNamespaces}>
-      <Card className="w-[80%] max-w-[500px] p-5">
+      <Card className="m-5 w-[80%] max-w-[500px] p-5">
         <CardHeader>
           <h3>{t('login:title')}</h3>
         </CardHeader>

diff --git a/src/app/[locale]/page.tsx b/src/app/[locale]/page.tsx
@@ -1,5 +1,5 @@
+'use server';
 import TranslationsProvider from '@/src/providers/translation-provider/TranslationsProvider';
-import { Button } from '@nextui-org/react';
 import { FunctionComponent } from 'react';
 import initTranslations from '../i18n';
 
@@ -12,129 +12,11 @@ interface HomeProps {
 const i18nNamespaces = ['home'];
 
 const Home: FunctionComponent<HomeProps> = async ({ params: { locale } }) => {
-  const { t, resources } = await initTranslations(locale, i18nNamespaces);
+  const { resources } = await initTranslations(locale, i18nNamespaces);
 
   return (
     <TranslationsProvider resources={resources} namespaces={i18nNamespaces} locale={locale}>
-      <div className="m-2">
-        <Button className="m-1" color="primary">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="faded">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="faded">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="faded">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="faded">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="faded">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="bordered">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="bordered">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="bordered">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="bordered">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="bordered">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="light">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="light">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="light">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="light">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="light">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="flat">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="flat">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="flat">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="flat">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="flat">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="ghost">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="ghost">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="ghost">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="ghost">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="ghost">
-          {t('home:button')}
-        </Button>
-      </div>
-      <div className="m-2">
-        <Button className="m-1" color="primary" variant="shadow">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="secondary" variant="shadow">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="success" variant="shadow">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="warning" variant="shadow">
-          {t('home:button')}
-        </Button>
-        <Button className="m-1" color="danger" variant="shadow">
-          {t('home:button')}
-        </Button>
-      </div>
+      <div>Home</div>
     </TranslationsProvider>
   );
 };

diff --git a/src/app/[locale]/pricing/page.tsx b/src/app/[locale]/pricing/page.tsx
@@ -1,6 +1,7 @@
+'use server';
 import { FunctionComponent, ReactElement } from 'react';
 
-const Pricing: FunctionComponent = (): ReactElement => {
+const Pricing: FunctionComponent = async (): Promise<ReactElement> => {
   return <div>Pricing</div>;
 };