From 574b75e3f2b4411c80d959aca5ec4dae5ca1b3eb Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Sat, 15 Mar 2025 21:01:06 +0000
Subject: [PATCH] Revert to version e9419ac

---
 .gitignore                                    |  5 -
 README.md                                     |  2 +-
 backend/README.md                             |  6 +-
 backend/package.json                          |  4 +-
 backend/src/config.js                         | 11 ++-
 backend/src/db/db.config.js                   |  2 +-
 .../db/seeders/20231127130745-sample-data.js  | 93 +------------------
 backend/src/index.js                          | 12 ++-
 backend/src/services/notifications/list.js    |  2 +-
 docker/docker-compose.yml                     |  2 +-
 frontend/README.md                            |  2 +-
 frontend/src/components/AsideMenuLayer.tsx    |  2 +-
 .../components/WebPageComponents/Footer.tsx   |  2 +-
 .../components/WebPageComponents/Header.tsx   |  2 +-
 frontend/src/pages/_app.tsx                   | 14 ++-
 frontend/src/pages/index.tsx                  | 18 ++--
 frontend/src/pages/login.tsx                  | 45 ++++++++-
 frontend/src/pages/privacy-policy.tsx         |  2 +-
 frontend/src/pages/terms-of-use.tsx           |  2 +-
 frontend/src/pages/web_pages/about.tsx        | 14 +--
 frontend/src/pages/web_pages/contact.tsx      | 10 +-
 frontend/src/pages/web_pages/faq.tsx          | 10 +-
 frontend/src/pages/web_pages/home.tsx         | 18 ++--
 frontend/src/pages/web_pages/services.tsx     | 14 +--
 24 files changed, 134 insertions(+), 160 deletions(-)

diff --git a/.gitignore b/.gitignore
index d0eb167..e427ff3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,8 +1,3 @@
 node_modules/
 */node_modules/
 */build/
-
-**/node_modules/
-**/build/
-.DS_Store
-.env
\ No newline at end of file
diff --git a/README.md b/README.md
index 358b8a5..44ace3f 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
 
 
-# FLPMSUPERSTAR
+# f45f54f45f45h54
 
 ## This project was generated by [Flatlogic Platform](https://flatlogic.com).
 
diff --git a/backend/README.md b/backend/README.md
index 8fc1a6e..bf58217 100644
--- a/backend/README.md
+++ b/backend/README.md
@@ -1,4 +1,4 @@
-#FLPMSUPERSTAR - template backend,
+#f45f54f45f45h54 - template backend,
 
 #### Run App on local machine:
 
@@ -38,10 +38,10 @@
 
 - Type this command to creating a new database.
 
-  - `postgres=> CREATE DATABASE db_flpmsuperstar;`
+  - `postgres=> CREATE DATABASE db_f45f54f45f45h54;`
 
 - Then give that new user privileges to the new database then quit the `psql`.
-  - `postgres=> GRANT ALL PRIVILEGES ON DATABASE db_flpmsuperstar TO admin;`
+  - `postgres=> GRANT ALL PRIVILEGES ON DATABASE db_f45f54f45f45h54 TO admin;`
   - `postgres=> \q`
 
 ---
diff --git a/backend/package.json b/backend/package.json
index 719f62f..a664768 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "flpmsuperstar",
-  "description": "FLPMSUPERSTAR - template backend",
+  "name": "f45f54f45f45h54",
+  "description": "f45f54f45f45h54 - template backend",
   "scripts": {
     "start": "npm run db:migrate && npm run db:seed && nodemon ./src/index.js",
     "db:migrate": "sequelize-cli db:migrate",
diff --git a/backend/src/config.js b/backend/src/config.js
index 4034f48..94d4c85 100644
--- a/backend/src/config.js
+++ b/backend/src/config.js
@@ -3,7 +3,7 @@ const os = require('os');
 const config = {
   gcloud: {
     bucket: 'fldemo-files',
-    hash: 'afeefb9d49f5b7977577876b99532ac7',
+    hash: '628510f17ff4fc3c44d6e6fee912d290',
   },
   bcrypt: {
     saltRounds: 12,
@@ -36,7 +36,7 @@ const config = {
   },
   uploadDir: os.tmpdir(),
   email: {
-    from: 'FLPMSUPERSTAR <app@flatlogic.app>',
+    from: 'f45f54f45f45h54 <app@flatlogic.app>',
     host: 'email-smtp.us-east-1.amazonaws.com',
     port: 587,
     auth: {
@@ -51,6 +51,13 @@ const config = {
     admin: 'Administrator',
     user: 'User',
   },
+
+  project_uuid: '7abe8e7f-14b3-4ca1-b9a7-d941ee8181aa',
+  flHost:
+    process.env.NODE_ENV === 'production' ||
+    process.env.NODE_ENV === 'dev_stage'
+      ? 'https://flatlogic.com/projects'
+      : 'http://localhost:3000/projects',
 };
 config.pexelsKey = 'Vc99rnmOhHhJAbgGQoKLZtsaIVfkeownoQNbTj78VemUjKh08ZYRbf18';
 config.pexelsQuery = 'abstract teamwork collaboration';
diff --git a/backend/src/db/db.config.js b/backend/src/db/db.config.js
index 5d34460..ca2533c 100644
--- a/backend/src/db/db.config.js
+++ b/backend/src/db/db.config.js
@@ -13,7 +13,7 @@ module.exports = {
     username: 'postgres',
     dialect: 'postgres',
     password: '',
-    database: 'db_flpmsuperstar',
+    database: 'db_f45f54f45f45h54',
     host: process.env.DB_HOST || 'localhost',
     logging: console.log,
     seederStorage: 'sequelize',
diff --git a/backend/src/db/seeders/20231127130745-sample-data.js b/backend/src/db/seeders/20231127130745-sample-data.js
index 94b9769..b823255 100644
--- a/backend/src/db/seeders/20231127130745-sample-data.js
+++ b/backend/src/db/seeders/20231127130745-sample-data.js
@@ -31,14 +31,6 @@ const CommentsData = [
 
     // type code here for "relation_one" field
   },
-
-  {
-    content: 'Testing will start next week.',
-
-    // type code here for "relation_one" field
-
-    // type code here for "relation_one" field
-  },
 ];
 
 const ProjectsData = [
@@ -73,16 +65,6 @@ const ProjectsData = [
 
     // type code here for "relation_one" field
   },
-
-  {
-    name: 'Project Delta',
-
-    description: 'Deployment and maintenance of the project management tool.',
-
-    // type code here for "relation_many" field
-
-    // type code here for "relation_one" field
-  },
 ];
 
 const TasksData = [
@@ -91,7 +73,7 @@ const TasksData = [
 
     description: 'Create wireframes and design the user interface.',
 
-    status: 'Done',
+    status: 'InProgress',
 
     // type code here for "relation_one" field
 
@@ -107,7 +89,7 @@ const TasksData = [
 
     description: 'Implement the backend services and APIs.',
 
-    status: 'ToDo',
+    status: 'InProgress',
 
     // type code here for "relation_one" field
 
@@ -133,22 +115,6 @@ const TasksData = [
 
     due_date: new Date('2023-10-25T17:00:00Z'),
   },
-
-  {
-    title: 'Conduct Testing',
-
-    description: 'Perform unit and integration testing.',
-
-    status: 'InProgress',
-
-    // type code here for "relation_one" field
-
-    // type code here for "relation_one" field
-
-    start_date: new Date('2023-10-20T09:00:00Z'),
-
-    due_date: new Date('2023-10-30T17:00:00Z'),
-  },
 ];
 
 // Similar logic for "relation_many"
@@ -186,17 +152,6 @@ async function associateCommentWithTask() {
   if (Comment2?.setTask) {
     await Comment2.setTask(relatedTask2);
   }
-
-  const relatedTask3 = await Tasks.findOne({
-    offset: Math.floor(Math.random() * (await Tasks.count())),
-  });
-  const Comment3 = await Comments.findOne({
-    order: [['id', 'ASC']],
-    offset: 3,
-  });
-  if (Comment3?.setTask) {
-    await Comment3.setTask(relatedTask3);
-  }
 }
 
 async function associateCommentWithAuthor() {
@@ -232,17 +187,6 @@ async function associateCommentWithAuthor() {
   if (Comment2?.setAuthor) {
     await Comment2.setAuthor(relatedAuthor2);
   }
-
-  const relatedAuthor3 = await Users.findOne({
-    offset: Math.floor(Math.random() * (await Users.count())),
-  });
-  const Comment3 = await Comments.findOne({
-    order: [['id', 'ASC']],
-    offset: 3,
-  });
-  if (Comment3?.setAuthor) {
-    await Comment3.setAuthor(relatedAuthor3);
-  }
 }
 
 // Similar logic for "relation_many"
@@ -280,17 +224,6 @@ async function associateProjectWithOwner() {
   if (Project2?.setOwner) {
     await Project2.setOwner(relatedOwner2);
   }
-
-  const relatedOwner3 = await Users.findOne({
-    offset: Math.floor(Math.random() * (await Users.count())),
-  });
-  const Project3 = await Projects.findOne({
-    order: [['id', 'ASC']],
-    offset: 3,
-  });
-  if (Project3?.setOwner) {
-    await Project3.setOwner(relatedOwner3);
-  }
 }
 
 async function associateTaskWithProject() {
@@ -326,17 +259,6 @@ async function associateTaskWithProject() {
   if (Task2?.setProject) {
     await Task2.setProject(relatedProject2);
   }
-
-  const relatedProject3 = await Projects.findOne({
-    offset: Math.floor(Math.random() * (await Projects.count())),
-  });
-  const Task3 = await Tasks.findOne({
-    order: [['id', 'ASC']],
-    offset: 3,
-  });
-  if (Task3?.setProject) {
-    await Task3.setProject(relatedProject3);
-  }
 }
 
 async function associateTaskWithAssignee() {
@@ -372,17 +294,6 @@ async function associateTaskWithAssignee() {
   if (Task2?.setAssignee) {
     await Task2.setAssignee(relatedAssignee2);
   }
-
-  const relatedAssignee3 = await Users.findOne({
-    offset: Math.floor(Math.random() * (await Users.count())),
-  });
-  const Task3 = await Tasks.findOne({
-    order: [['id', 'ASC']],
-    offset: 3,
-  });
-  if (Task3?.setAssignee) {
-    await Task3.setAssignee(relatedAssignee3);
-  }
 }
 
 module.exports = {
diff --git a/backend/src/index.js b/backend/src/index.js
index afa881b..739d6b3 100644
--- a/backend/src/index.js
+++ b/backend/src/index.js
@@ -15,6 +15,8 @@ const fileRoutes = require('./routes/file');
 const searchRoutes = require('./routes/search');
 const pexelsRoutes = require('./routes/pexels');
 
+const openaiRoutes = require('./routes/openai');
+
 const contactFormRoutes = require('./routes/contactForm');
 
 const usersRoutes = require('./routes/users');
@@ -34,9 +36,9 @@ const options = {
     openapi: '3.0.0',
     info: {
       version: '1.0.0',
-      title: 'FLPMSUPERSTAR',
+      title: 'f45f54f45f45h54',
       description:
-        'FLPMSUPERSTAR Online REST API for Testing and Prototyping application. You can perform all major operations with your entities - create, delete and etc.',
+        'f45f54f45f45h54 Online REST API for Testing and Prototyping application. You can perform all major operations with your entities - create, delete and etc.',
     },
     servers: [
       {
@@ -124,6 +126,12 @@ app.use(
   permissionsRoutes,
 );
 
+app.use(
+  '/api/openai',
+  passport.authenticate('jwt', { session: false }),
+  openaiRoutes,
+);
+
 app.use('/api/contact-form', contactFormRoutes);
 
 app.use(
diff --git a/backend/src/services/notifications/list.js b/backend/src/services/notifications/list.js
index 87c2cb5..d23b235 100644
--- a/backend/src/services/notifications/list.js
+++ b/backend/src/services/notifications/list.js
@@ -1,6 +1,6 @@
 const errors = {
   app: {
-    title: 'FLPMSUPERSTAR',
+    title: 'f45f54f45f45h54',
   },
 
   auth: {
diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml
index 89e2303..65e6125 100644
--- a/docker/docker-compose.yml
+++ b/docker/docker-compose.yml
@@ -15,7 +15,7 @@ services:
       - ./data/db:/var/lib/postgresql/data
     environment:
       - POSTGRES_HOST_AUTH_METHOD=trust
-      - POSTGRES_DB=db_flpmsuperstar
+      - POSTGRES_DB=db_f45f54f45f45h54
     ports:
       - "5432:5432"
   backend:
diff --git a/frontend/README.md b/frontend/README.md
index 974461a..bfb48e2 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -1,4 +1,4 @@
-# FLPMSUPERSTAR
+# f45f54f45f45h54
 
 ## This project was generated by Flatlogic Platform.
 
diff --git a/frontend/src/components/AsideMenuLayer.tsx b/frontend/src/components/AsideMenuLayer.tsx
index 39248c4..96acd81 100644
--- a/frontend/src/components/AsideMenuLayer.tsx
+++ b/frontend/src/components/AsideMenuLayer.tsx
@@ -44,7 +44,7 @@ export default function AsideMenuLayer({
         >
           <div className='text-center flex-1 lg:text-left lg:pl-6 xl:text-center xl:pl-0'>
             <Link href={'/home'}>
-              <b className='font-black'>FLPMSUPERSTAR</b>
+              <b className='font-black'>f45f54f45f45h54</b>
             </Link>
           </div>
           <button
diff --git a/frontend/src/components/WebPageComponents/Footer.tsx b/frontend/src/components/WebPageComponents/Footer.tsx
index 3833078..081158b 100644
--- a/frontend/src/components/WebPageComponents/Footer.tsx
+++ b/frontend/src/components/WebPageComponents/Footer.tsx
@@ -20,7 +20,7 @@ export default function WebSiteFooter({
 
   const style = FooterStyle.WITH_PROJECT_NAME;
 
-  const design = FooterDesigns.DEFAULT_DESIGN;
+  const design = FooterDesigns.DESIGN_DIVERSITY;
 
   return (
     <div
diff --git a/frontend/src/components/WebPageComponents/Header.tsx b/frontend/src/components/WebPageComponents/Header.tsx
index ae27257..2620306 100644
--- a/frontend/src/components/WebPageComponents/Header.tsx
+++ b/frontend/src/components/WebPageComponents/Header.tsx
@@ -19,7 +19,7 @@ export default function WebSiteHeader({
   const websiteHeder = useAppSelector((state) => state.style.websiteHeder);
   const borders = useAppSelector((state) => state.style.borders);
 
-  const style = HeaderStyle.PAGES_RIGHT;
+  const style = HeaderStyle.PAGES_LEFT;
 
   const design = HeaderDesigns.DESIGN_DIVERSITY;
   return (
diff --git a/frontend/src/pages/_app.tsx b/frontend/src/pages/_app.tsx
index db3d5bf..d1c5f26 100644
--- a/frontend/src/pages/_app.tsx
+++ b/frontend/src/pages/_app.tsx
@@ -17,6 +17,7 @@ import {
   landingSteps,
   loginSteps,
   usersSteps,
+  rolesSteps,
 } from '../stores/introSteps';
 
 export type NextPageWithLayout<P = Record<string, unknown>, IP = P> = NextPage<
@@ -70,9 +71,9 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
     }
   }, []);
 
-  const title = 'FLPMSUPERSTAR';
+  const title = 'f45f54f45f45h54';
 
-  const description = 'FLPMSUPERSTAR generated by Flatlogic';
+  const description = 'f45f54f45f45h54 generated by Flatlogic';
 
   const url = 'https://flatlogic.com/';
 
@@ -113,6 +114,15 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
         setStepName('usersSteps');
         setStepsEnabled(true);
       }, 1000);
+    } else if (
+      router.pathname === '/roles/roles-list' &&
+      !isCompleted('rolesSteps')
+    ) {
+      setTimeout(() => {
+        setSteps(rolesSteps);
+        setStepName('rolesSteps');
+        setStepsEnabled(true);
+      }, 1000);
     } else {
       setSteps([]);
       setStepsEnabled(false);
diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx
index af1118d..46a9551 100644
--- a/frontend/src/pages/index.tsx
+++ b/frontend/src/pages/index.tsx
@@ -27,7 +27,7 @@ import FaqSection from '../components/WebPageComponents/FaqComponent';
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -125,10 +125,10 @@ export default function WebSite() {
           content={`Discover our innovative project management tool designed to enhance productivity and streamline your workflow. Explore features, learn about our mission, and get in touch with us today.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team collaborating on project tasks']}
           mainText={`Revolutionize Your Workflow with ${projectName}`}
           subTitle={`${projectName} is your ultimate project management tool, designed to streamline tasks, enhance collaboration, and boost productivity. Experience seamless project handling like never before.`}
@@ -137,9 +137,9 @@ export default function WebSite() {
         />
 
         <FeaturesSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Dashboard showcasing project overview']}
-          withBg={0}
+          withBg={1}
           features={features_points}
           mainText={`Explore ${projectName} Features`}
           subTitle={`Discover the powerful features of ${projectName} that simplify project management and enhance team collaboration.`}
@@ -147,7 +147,7 @@ export default function WebSite() {
         />
 
         <AboutUsSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team brainstorming innovative solutions']}
           mainText={`Discover the Vision Behind ${projectName}`}
           subTitle={`At ${projectName}, we are committed to transforming the way teams manage projects. Our mission is to provide intuitive tools that empower teams to achieve their goals efficiently and effectively.`}
@@ -156,21 +156,21 @@ export default function WebSite() {
         />
 
         <FaqSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={FaqDesigns.ACCORDION || ''}
           faqs={faqs}
           mainText={`Frequently Asked Questions about ${projectName} `}
         />
 
         <ContactFormSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={ContactFormDesigns.WITH_IMAGE || ''}
           image={['Person typing on a laptop']}
           mainText={`Get in Touch with ${projectName} `}
           subTitle={`We're here to help! Reach out to us anytime, and we'll respond promptly to assist you with any inquiries or support you need.`}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }
diff --git a/frontend/src/pages/login.tsx b/frontend/src/pages/login.tsx
index 577566e..fae3941 100644
--- a/frontend/src/pages/login.tsx
+++ b/frontend/src/pages/login.tsx
@@ -50,7 +50,7 @@ export default function Login() {
     remember: true,
   });
 
-  const title = 'FLPMSUPERSTAR';
+  const title = 'f45f54f45f45h54';
 
   // Fetch Pexels image/video
   useEffect(() => {
@@ -189,6 +189,49 @@ export default function Login() {
             ? videoBlock(illustrationVideo)
             : null}
           <div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
+            <CardBox id='loginRoles' className='w-full md:w-3/5 lg:w-2/3'>
+              <Link href={'/home'}>
+                <h2 className='text-4xl font-semibold my-4'>
+                  {' '}
+                  f45f54f45f45h54
+                </h2>
+              </Link>
+
+              <div className='flex flex-row text-gray-500 justify-between'>
+                <div>
+                  <p className='mb-2'>
+                    Use{' '}
+                    <code
+                      className={`cursor-pointer ${textColor} `}
+                      onClick={(e) => setLogin(e.target)}
+                    >
+                      admin@flatlogic.com
+                    </code>{' '}
+                    to login as Admin
+                  </p>
+                  <p>
+                    Use{' '}
+                    <code
+                      className={`cursor-pointer ${textColor} `}
+                      onClick={(e) => setLogin(e.target)}
+                    >
+                      client@hello.com
+                    </code>{' '}
+                    to login as User
+                  </p>
+                </div>
+                <div>
+                  <BaseIcon
+                    className={`${iconsColor}`}
+                    w='w-16'
+                    h='h-16'
+                    size={48}
+                    path={mdiInformation}
+                  />
+                </div>
+              </div>
+            </CardBox>
+
             <CardBox className='w-full md:w-3/5 lg:w-2/3'>
               <Formik
                 initialValues={initialValues}
diff --git a/frontend/src/pages/privacy-policy.tsx b/frontend/src/pages/privacy-policy.tsx
index b55cc0e..cf8f203 100644
--- a/frontend/src/pages/privacy-policy.tsx
+++ b/frontend/src/pages/privacy-policy.tsx
@@ -5,7 +5,7 @@ import LayoutGuest from '../layouts/Guest';
 import { getPageTitle } from '../config';
 
 export default function PrivacyPolicy() {
-  const title = 'FLPMSUPERSTAR';
+  const title = 'f45f54f45f45h54';
   const [projectUrl, setProjectUrl] = useState('');
 
   useEffect(() => {
diff --git a/frontend/src/pages/terms-of-use.tsx b/frontend/src/pages/terms-of-use.tsx
index 0955e80..c386bca 100644
--- a/frontend/src/pages/terms-of-use.tsx
+++ b/frontend/src/pages/terms-of-use.tsx
@@ -5,7 +5,7 @@ import LayoutGuest from '../layouts/Guest';
 import { getPageTitle } from '../config';
 
 export default function PrivacyPolicy() {
-  const title = 'FLPMSUPERSTAR';
+  const title = 'f45f54f45f45h54';
   const [projectUrl, setProjectUrl] = useState('');
 
   useEffect(() => {
diff --git a/frontend/src/pages/web_pages/about.tsx b/frontend/src/pages/web_pages/about.tsx
index 97cc895..72dac08 100644
--- a/frontend/src/pages/web_pages/about.tsx
+++ b/frontend/src/pages/web_pages/about.tsx
@@ -24,7 +24,7 @@ import ContactFormSection from '../../components/WebPageComponents/ContactFormCo
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -89,10 +89,10 @@ export default function WebSite() {
           content={`Discover the story behind ${projectName}, our mission, and the dedicated team working to revolutionize project management. Explore our features and get in touch with us.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team collaborating in modern office']}
           mainText={`Unveiling the Story of ${projectName}`}
           subTitle={`Discover the journey and vision behind ${projectName}. Learn about our mission to transform project management and meet the team dedicated to your success.`}
@@ -101,7 +101,7 @@ export default function WebSite() {
         />
 
         <AboutUsSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team brainstorming innovative ideas']}
           mainText={`Meet the Innovators Behind ${projectName}`}
           subTitle={`At ${projectName}, our passion drives us to create cutting-edge solutions for project management. Our team is committed to delivering excellence and empowering your success.`}
@@ -110,7 +110,7 @@ export default function WebSite() {
         />
 
         <FeaturesSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Dashboard displaying key features']}
           withBg={0}
           features={features_points}
@@ -120,14 +120,14 @@ export default function WebSite() {
         />
 
         <ContactFormSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={ContactFormDesigns.HIGHLIGHTED || ''}
           image={['Person typing on a laptop']}
           mainText={`Connect with ${projectName} Today `}
           subTitle={`Have questions or need assistance? Reach out to us anytime, and our team will respond promptly to support your needs.`}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }
diff --git a/frontend/src/pages/web_pages/contact.tsx b/frontend/src/pages/web_pages/contact.tsx
index 173733e..7b6d410 100644
--- a/frontend/src/pages/web_pages/contact.tsx
+++ b/frontend/src/pages/web_pages/contact.tsx
@@ -18,7 +18,7 @@ import ContactFormSection from '../../components/WebPageComponents/ContactFormCo
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -62,10 +62,10 @@ export default function WebSite() {
           content={`Reach out to ${projectName} for any inquiries, support, or feedback. Our team is here to assist you with all your project management needs.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Customer support team assisting clients']}
           mainText={`Connect with ${projectName} Today`}
           subTitle={`We're here to help you with any questions or support you need. Reach out to ${projectName} and let us assist you in achieving your project goals.`}
@@ -74,14 +74,14 @@ export default function WebSite() {
         />
 
         <ContactFormSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={ContactFormDesigns.WITH_IMAGE || ''}
           image={['Person typing on a laptop']}
           mainText={`Get in Touch with ${projectName} `}
           subTitle={`We're available 24/7 to assist you. Send us a message, and our team will respond promptly to address your inquiries and support needs.`}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }
diff --git a/frontend/src/pages/web_pages/faq.tsx b/frontend/src/pages/web_pages/faq.tsx
index 844c157..94b014e 100644
--- a/frontend/src/pages/web_pages/faq.tsx
+++ b/frontend/src/pages/web_pages/faq.tsx
@@ -18,7 +18,7 @@ import FaqSection from '../../components/WebPageComponents/FaqComponent';
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -95,10 +95,10 @@ export default function WebSite() {
           content={`Find answers to common questions about ${projectName}. Learn more about our features, services, and how we can help streamline your project management.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Person reading FAQ on laptop']}
           mainText={`Your Questions Answered with ${projectName}`}
           subTitle={`Explore our comprehensive FAQ section to find answers to your most pressing questions about ${projectName}. We're here to help you make the most of our project management tool.`}
@@ -107,13 +107,13 @@ export default function WebSite() {
         />
 
         <FaqSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={FaqDesigns.ACCORDION || ''}
           faqs={faqs}
           mainText={`Common Questions About ${projectName} `}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }
diff --git a/frontend/src/pages/web_pages/home.tsx b/frontend/src/pages/web_pages/home.tsx
index d1cb998..a4029a2 100644
--- a/frontend/src/pages/web_pages/home.tsx
+++ b/frontend/src/pages/web_pages/home.tsx
@@ -27,7 +27,7 @@ import FaqSection from '../../components/WebPageComponents/FaqComponent';
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -125,10 +125,10 @@ export default function WebSite() {
           content={`Discover our innovative project management tool designed to enhance productivity and streamline your workflow. Explore features, learn about our mission, and get in touch with us today.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team collaborating on project tasks']}
           mainText={`Revolutionize Your Workflow with ${projectName}`}
           subTitle={`${projectName} is your ultimate project management tool, designed to streamline tasks, enhance collaboration, and boost productivity. Experience seamless project handling like never before.`}
@@ -137,9 +137,9 @@ export default function WebSite() {
         />
 
         <FeaturesSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Dashboard showcasing project overview']}
-          withBg={1}
+          withBg={0}
           features={features_points}
           mainText={`Explore ${projectName} Features`}
           subTitle={`Discover the powerful features of ${projectName} that simplify project management and enhance team collaboration.`}
@@ -147,7 +147,7 @@ export default function WebSite() {
         />
 
         <AboutUsSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team brainstorming innovative solutions']}
           mainText={`Discover the Vision Behind ${projectName}`}
           subTitle={`At ${projectName}, we are committed to transforming the way teams manage projects. Our mission is to provide intuitive tools that empower teams to achieve their goals efficiently and effectively.`}
@@ -156,21 +156,21 @@ export default function WebSite() {
         />
 
         <FaqSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={FaqDesigns.ACCORDION || ''}
           faqs={faqs}
           mainText={`Frequently Asked Questions about ${projectName} `}
         />
 
         <ContactFormSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={ContactFormDesigns.WITH_IMAGE || ''}
           image={['Person typing on a laptop']}
           mainText={`Get in Touch with ${projectName} `}
           subTitle={`We're here to help! Reach out to us anytime, and we'll respond promptly to assist you with any inquiries or support you need.`}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }
diff --git a/frontend/src/pages/web_pages/services.tsx b/frontend/src/pages/web_pages/services.tsx
index 1ceaa31..910f0af 100644
--- a/frontend/src/pages/web_pages/services.tsx
+++ b/frontend/src/pages/web_pages/services.tsx
@@ -21,7 +21,7 @@ import FeaturesSection from '../../components/WebPageComponents/FeaturesComponen
 export default function WebSite() {
   const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
   const bgColor = useAppSelector((state) => state.style.bgLayoutColor);
-  const projectName = 'FLPMSUPERSTAR';
+  const projectName = 'f45f54f45f45h54';
 
   useEffect(() => {
     const darkElement = document.querySelector('body .dark');
@@ -86,10 +86,10 @@ export default function WebSite() {
           content={`Explore the range of services offered by ${projectName} to streamline your project management processes. Discover how our features can enhance productivity and collaboration for your team.`}
         />
       </Head>
-      <WebSiteHeader projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteHeader projectName={'f45f54f45f45h54'} pages={pages} />
       <main className={`flex-grow    bg-white  rounded-none  `}>
         <HeroSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Team working on project plans']}
           mainText={`Transform Your Projects with ${projectName}`}
           subTitle={`Discover the comprehensive services offered by ${projectName} to elevate your project management experience. From seamless integration to real-time collaboration, we have you covered.`}
@@ -98,9 +98,9 @@ export default function WebSite() {
         />
 
         <FeaturesSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           image={['Features displayed on a screen']}
-          withBg={0}
+          withBg={1}
           features={features_points}
           mainText={`Discover ${projectName} Services`}
           subTitle={`Explore the powerful features of ${projectName} designed to streamline your project management and enhance team productivity.`}
@@ -108,14 +108,14 @@ export default function WebSite() {
         />
 
         <ContactFormSection
-          projectName={'FLPMSUPERSTAR'}
+          projectName={'f45f54f45f45h54'}
           design={ContactFormDesigns.HIGHLIGHTED || ''}
           image={['Person typing on a laptop']}
           mainText={`Reach Out to ${projectName} `}
           subTitle={`Have questions or need assistance? Contact us anytime, and our team will respond promptly to support your project management needs.`}
         />
       </main>
-      <WebSiteFooter projectName={'FLPMSUPERSTAR'} pages={pages} />
+      <WebSiteFooter projectName={'f45f54f45f45h54'} pages={pages} />
     </div>
   );
 }