Autosave: 20260213-171617

This commit is contained in:
Flatlogic Bot 2026-02-13 17:16:18 +00:00
parent 5788b000f5
commit 9e5f09aabe
16 changed files with 11636 additions and 1252 deletions

9460
backend/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,5 @@
const UsersDBApi = require('../db/api/users'); const UsersDBApi = require('../db/api/users');
const db = require('../db/models');
const ValidationError = require('./notifications/errors/validation'); const ValidationError = require('./notifications/errors/validation');
const ForbiddenError = require('./notifications/errors/forbidden'); const ForbiddenError = require('./notifications/errors/forbidden');
const bcrypt = require('bcrypt'); const bcrypt = require('bcrypt');

View File

@ -66,6 +66,9 @@ module.exports = class Member_profilesService {
} }
static async update(data, id, currentUser) { static async update(data, id, currentUser) {
if (!id) {
throw new ValidationError('member_profiles.idRequired');
}
const transaction = await db.sequelize.transaction(); const transaction = await db.sequelize.transaction();
try { try {
let member_profiles = await Member_profilesDBApi.findBy( let member_profiles = await Member_profilesDBApi.findBy(
@ -134,5 +137,3 @@ module.exports = class Member_profilesService {
}; };

File diff suppressed because it is too large Load Diff

View File

@ -6,6 +6,7 @@ export const gradientBgPurplePink = `${gradientBgBase} from-purple-400 via-pink-
export const gradientBgViolet = `${gradientBgBase} ${colorBgBase}` export const gradientBgViolet = `${gradientBgBase} ${colorBgBase}`
export const gradientBgDark = `${gradientBgBase} from-dark-700 via-dark-900 to-dark-800`; export const gradientBgDark = `${gradientBgBase} from-dark-700 via-dark-900 to-dark-800`;
export const gradientBgPinkRed = `${gradientBgBase} from-pink-400 via-red-500 to-yellow-500` export const gradientBgPinkRed = `${gradientBgBase} from-pink-400 via-red-500 to-yellow-500`
export const gradientBgExecutive = 'bg-gradient-to-br from-white to-[#091EAA]/[0.07]'
export const colorsBgLight = { export const colorsBgLight = {
white: 'bg-white text-black', white: 'bg-white text-black',

View File

@ -6,6 +6,7 @@ type Props = {
export default function Logo({ className = '' }: Props) { export default function Logo({ className = '' }: Props) {
return ( return (
/* eslint-disable-next-line @next/next/no-img-element */
<img <img
src={"https://flatlogic.com/logo.svg"} src={"https://flatlogic.com/logo.svg"}
className={className} className={className}

View File

@ -1,6 +1,6 @@
import React, { ReactNode } from 'react' import React, { ReactNode } from 'react'
import { BgKey } from '../interfaces' import { BgKey } from '../interfaces'
import {gradientBgPurplePink, gradientBgDark, gradientBgPinkRed, gradientBgViolet} from '../colors' import {gradientBgPurplePink, gradientBgDark, gradientBgPinkRed, gradientBgViolet, gradientBgExecutive} from '../colors'
import { useAppSelector } from '../stores/hooks' import { useAppSelector } from '../stores/hooks'
type Props = { type Props = {
@ -21,6 +21,8 @@ export default function SectionFullScreen({ bg, children }: Props) {
componentClass += gradientBgPurplePink componentClass += gradientBgPurplePink
} else if (bg === 'pinkRed') { } else if (bg === 'pinkRed') {
componentClass += gradientBgPinkRed componentClass += gradientBgPinkRed
} else if (bg === 'executive') {
componentClass += gradientBgExecutive
} }
return <div className={componentClass}>{children}</div> return <div className={componentClass}>{children}</div>

View File

@ -9,6 +9,8 @@ i18n
.use(initReactI18next) .use(initReactI18next)
.init({ .init({
fallbackLng: 'en', fallbackLng: 'en',
defaultNS: 'common',
ns: ['common'],
detection: { detection: {
order: ['localStorage', 'navigator'], order: ['localStorage', 'navigator'],
lookupLocalStorage: 'app_lang_', lookupLocalStorage: 'app_lang_',
@ -19,3 +21,5 @@ i18n
}, },
interpolation: { escapeValue: false }, interpolation: { escapeValue: false },
}); });
export default i18n;

View File

@ -42,7 +42,7 @@ export type ColorButtonKey =
| 'info' | 'info'
| 'void' | 'void'
export type BgKey = 'purplePink' | 'pinkRed' | 'violet' export type BgKey = 'purplePink' | 'pinkRed' | 'violet' | 'executive'
export type TrendType = 'up' | 'down' | 'success' | 'danger' | 'warning' | 'info' export type TrendType = 'up' | 'down' | 'success' | 'danger' | 'warning' | 'info'

View File

@ -38,11 +38,11 @@ export default function Forgot() {
return ( return (
<> <>
<Head> <Head>
<title>{getPageTitle('Login')}</title> <title>{getPageTitle('Forgot Password')}</title>
</Head> </Head>
<SectionFullScreen bg='violet'> <SectionFullScreen bg='executive'>
<CardBox className='w-11/12 md:w-7/12 lg:w-6/12 xl:w-4/12'> <CardBox className='w-11/12 md:w-7/12 lg:w-6/12 xl:w-4/12 shadow-lg border-gray-100'>
<Formik <Formik
initialValues={{ initialValues={{
email: '', email: '',
@ -61,11 +61,14 @@ export default function Forgot() {
type='submit' type='submit'
label={loading ? 'Loading...' : 'Submit' } label={loading ? 'Loading...' : 'Submit' }
color='info' color='info'
className='w-full md:w-auto'
/> />
<BaseButton <BaseButton
href={'/login'} href={'/login'}
label={'Login'} label={'Login'}
color='info' color='info'
outline
className='w-full md:w-auto'
/> />
</BaseButtons> </BaseButtons>
</Form> </Form>

View File

@ -28,15 +28,15 @@ export default function Starter() {
// If not authenticated, show a minimal landing with Login CTA // If not authenticated, show a minimal landing with Login CTA
if (!token) { if (!token) {
return ( return (
<div className="min-h-screen flex flex-col items-center justify-center bg-white px-4"> <div className="min-h-screen flex flex-col items-center justify-center bg-white px-8">
<Head> <Head>
<title>{getPageTitle('The Power Suite')}</title> <title>{getPageTitle('The Power Suite')}</title>
</Head> </Head>
<div className="max-w-2xl w-full text-center space-y-8"> <div className="max-w-[800px] w-full text-center space-y-10">
<h1 className="text-4xl md:text-5xl font-bold text-[#091EAA] tracking-tight"> <h1 className="text-4xl md:text-5xl font-bold text-[#091EAA] tracking-tight">
Zetas in Corporate America: The Power Suite Zetas in Corporate America: The Power Suite
</h1> </h1>
<p className="text-xl text-gray-600 font-light"> <p className="text-lg text-[#6B7280] font-light">
A private executive directory connecting Power Suite members across industries, regions, and leadership levels. A private executive directory connecting Power Suite members across industries, regions, and leadership levels.
</p> </p>
<div className="pt-8"> <div className="pt-8">
@ -54,21 +54,21 @@ export default function Starter() {
// Option C Landing Page for Authenticated Users // Option C Landing Page for Authenticated Users
return ( return (
<div className="min-h-screen flex flex-col items-center justify-center bg-white px-4"> <div className="min-h-screen flex flex-col items-center justify-center bg-white px-8">
<Head> <Head>
<title>{getPageTitle('Home')}</title> <title>{getPageTitle('Home')}</title>
</Head> </Head>
<div className="max-w-3xl w-full text-center space-y-12"> <div className="max-w-[800px] w-full text-center space-y-12">
<div className="space-y-4"> <div className="space-y-6">
<h1 className="text-4xl md:text-6xl font-bold text-[#091EAA] tracking-tight"> <h1 className="text-4xl md:text-6xl font-bold text-[#091EAA] tracking-tight">
Zetas in Corporate America: The Power Suite Zetas in Corporate America: The Power Suite
</h1> </h1>
<p className="text-xl md:text-2xl text-gray-600 font-light max-w-2xl mx-auto"> <p className="text-lg md:text-xl text-[#6B7280] font-light max-w-2xl mx-auto">
A private executive directory connecting Power Suite members across industries, regions, and leadership levels. A private executive directory connecting Power Suite members across industries, regions, and leadership levels.
</p> </p>
</div> </div>
<div className="flex flex-col items-center space-y-6 pt-4"> <div className="flex flex-col items-center pt-4">
<Link <Link
href="/member_profiles/member_profiles-list" href="/member_profiles/member_profiles-list"
className="px-16 py-4 text-xl font-bold text-white rounded-none bg-[#091EAA] hover:bg-[#0055AA] border-none shadow-xl transition-all inline-block" className="px-16 py-4 text-xl font-bold text-white rounded-none bg-[#091EAA] hover:bg-[#0055AA] border-none shadow-xl transition-all inline-block"
@ -76,7 +76,7 @@ export default function Starter() {
Enter Executive Directory Enter Executive Directory
</Link> </Link>
<div className="flex flex-wrap justify-center gap-x-8 gap-y-4 pt-4 text-gray-500 font-medium uppercase tracking-widest text-xs"> <div className="mt-16 flex flex-wrap justify-center gap-x-8 gap-y-4 text-gray-400 font-light uppercase tracking-[0.2em] text-[10px]">
<Link href="/profile" className="hover:text-[#091EAA] transition-colors"> <Link href="/profile" className="hover:text-[#091EAA] transition-colors">
Update My Profile Update My Profile
</Link> </Link>
@ -85,7 +85,7 @@ export default function Starter() {
</Link> </Link>
<button <button
onClick={handleLogout} onClick={handleLogout}
className="hover:text-red-600 transition-colors uppercase tracking-widest text-xs font-medium" className="hover:text-red-600 transition-colors uppercase tracking-[0.2em] text-[10px] font-light"
> >
Log Out Log Out
</button> </button>

View File

@ -1,5 +1,3 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import type { ReactElement } from 'react'; import type { ReactElement } from 'react';
import Head from 'next/head'; import Head from 'next/head';
@ -20,7 +18,6 @@ import { findMe, loginUser, resetAction } from '../stores/authSlice';
import { useAppDispatch, useAppSelector } from '../stores/hooks'; import { useAppDispatch, useAppSelector } from '../stores/hooks';
import Link from 'next/link'; import Link from 'next/link';
import {toast, ToastContainer} from "react-toastify"; import {toast, ToastContainer} from "react-toastify";
import { getPexelsImage, getPexelsVideo } from '../helpers/pexels'
export default function Login() { export default function Login() {
const router = useRouter(); const router = useRouter();
@ -28,15 +25,8 @@ export default function Login() {
const textColor = useAppSelector((state) => state.style.linkColor); const textColor = useAppSelector((state) => state.style.linkColor);
const iconsColor = useAppSelector((state) => state.style.iconsColor); const iconsColor = useAppSelector((state) => state.style.iconsColor);
const notify = (type, msg) => toast(msg, { type }); const notify = (type, msg) => toast(msg, { type });
const [ illustrationImage, setIllustrationImage ] = useState({
src: undefined, const [showPassword, setShowPassword] = useState(false);
photographer: undefined,
photographer_url: undefined,
})
const [ illustrationVideo, setIllustrationVideo ] = useState({video_files: []})
const [contentType, setContentType] = useState('image');
const [contentPosition, setContentPosition] = useState('background');
const [showPassword, setShowPassword] = useState(false);
const { currentUser, isFetching, errorMessage, token, notify:notifyState } = useAppSelector( const { currentUser, isFetching, errorMessage, token, notify:notifyState } = useAppSelector(
(state) => state.auth, (state) => state.auth,
); );
@ -46,16 +36,6 @@ export default function Login() {
const title = 'Power Suite Executive Directory' const title = 'Power Suite Executive Directory'
// Fetch Pexels image/video
useEffect( () => {
async function fetchData() {
const image = await getPexelsImage()
const video = await getPexelsVideo()
setIllustrationImage(image);
setIllustrationVideo(video);
}
fetchData();
}, []);
// Fetch user data // Fetch user data
useEffect(() => { useEffect(() => {
if (token) { if (token) {
@ -100,70 +80,17 @@ export default function Login() {
})); }));
}; };
const imageBlock = (image) => (
<div className="hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3"
style={{
backgroundImage: `${image ? `url(${image.src?.original})` : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'}`,
backgroundSize: 'cover',
backgroundPosition: 'left center',
backgroundRepeat: 'no-repeat',
}}>
<div className="flex justify-center w-full bg-blue-300/20">
<a className="text-[8px]" href={image?.photographer_url} target="_blank" rel="noreferrer">Photo
by {image?.photographer} on Pexels</a>
</div>
</div>
)
const videoBlock = (video) => {
if (video?.video_files?.length > 0) {
return (
<div className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'>
<video
className='absolute top-0 left-0 w-full h-full object-cover'
autoPlay
loop
muted
>
<source src={video.video_files[0]?.link} type='video/mp4'/>
Your browser does not support the video tag.
</video>
<div className='flex justify-center w-full bg-blue-300/20 z-10'>
<a
className='text-[8px]'
href={video.user.url}
target='_blank'
rel='noreferrer'
>
Video by {video.user.name} on Pexels
</a>
</div>
</div>)
}
};
return ( return (
<div style={contentPosition === 'background' ? { <div className="min-h-screen">
backgroundImage: `${
illustrationImage
? `url(${illustrationImage.src?.original})`
: 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
}`,
backgroundSize: 'cover',
backgroundPosition: 'left center',
backgroundRepeat: 'no-repeat',
} : {}}>
<Head> <Head>
<title>{getPageTitle('Login')}</title> <title>{getPageTitle('Login')}</title>
</Head> </Head>
<SectionFullScreen bg='violet'> <SectionFullScreen bg='executive'>
<div className={`flex ${contentPosition === 'right' ? 'flex-row-reverse' : 'flex-row'} min-h-screen w-full`}> <div className='flex flex-row min-h-screen w-full'>
{contentType === 'image' && contentPosition !== 'background' ? imageBlock(illustrationImage) : null} <div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full py-12'>
{contentType === 'video' && contentPosition !== 'background' ? 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'> <CardBox id="loginRoles" className='w-full md:w-3/5 lg:w-2/3 shadow-sm border-gray-100'>
<h2 className="text-4xl font-semibold my-4">{title}</h2> <h2 className="text-4xl font-semibold my-4">{title}</h2>
@ -195,7 +122,7 @@ export default function Login() {
</div> </div>
</CardBox> </CardBox>
<CardBox className='w-full md:w-3/5 lg:w-2/3'> <CardBox className='w-full md:w-3/5 lg:w-2/3 shadow-lg border-gray-100'>
<Formik <Formik
initialValues={initialValues} initialValues={initialValues}
enableReinitialize enableReinitialize
@ -231,7 +158,7 @@ export default function Login() {
<Field type='checkbox' name='remember' /> <Field type='checkbox' name='remember' />
</FormCheckRadio> </FormCheckRadio>
<Link className={`${textColor} text-blue-600`} href={'/forgot'}> <Link className={`${textColor} text-blue-600 font-medium`} href={'/forgot'}>
Forgot password? Forgot password?
</Link> </Link>
</div> </div>
@ -248,9 +175,9 @@ export default function Login() {
/> />
</BaseButtons> </BaseButtons>
<br /> <br />
<p className={'text-center'}> <p className={'text-center text-gray-600'}>
Dont have an account yet?{' '} Dont have an account yet?{' '}
<Link className={`${textColor}`} href={'/register'}> <Link className={`${textColor} font-medium`} href={'/register'}>
New Account New Account
</Link> </Link>
</p> </p>
@ -260,9 +187,9 @@ export default function Login() {
</div> </div>
</div> </div>
</SectionFullScreen> </SectionFullScreen>
<div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'> <div className='bg-white border-t border-gray-100 text-gray-500 flex flex-col text-center justify-center md:flex-row'>
<p className='py-6 text-sm'>© 2026 <span>{title}</span>. © All rights reserved</p> <p className='py-6 text-sm'>© 2026 <span>{title}</span>. © All rights reserved</p>
<Link className='py-6 ml-4 text-sm' href='/privacy-policy/'> <Link className='py-6 ml-4 text-sm hover:text-gray-700' href='/privacy-policy/'>
Privacy Policy Privacy Policy
</Link> </Link>
</div> </div>

View File

@ -3,6 +3,7 @@ import {
mdiUpload, mdiUpload,
} from '@mdi/js'; } from '@mdi/js';
import Head from 'next/head'; import Head from 'next/head';
import Image from 'next/image';
import React, { ReactElement, useEffect, useState } from 'react'; import React, { ReactElement, useEffect, useState } from 'react';
import { ToastContainer, toast } from 'react-toastify'; import { ToastContainer, toast } from 'react-toastify';
import DatePicker from 'react-datepicker'; import DatePicker from 'react-datepicker';
@ -84,7 +85,13 @@ const EditUsers = () => {
<CardBox> <CardBox>
{currentUser?.avatar[0]?.publicUrl && <div className={'grid grid-cols-6 gap-4 mb-4'}> {currentUser?.avatar[0]?.publicUrl && <div className={'grid grid-cols-6 gap-4 mb-4'}>
<div className="col-span-1 w-80 h-80 overflow-hidden border-2 rounded-full inline-flex items-center justify-center mb-8"> <div className="col-span-1 w-80 h-80 overflow-hidden border-2 rounded-full inline-flex items-center justify-center mb-8">
<img className="w-80 h-80 max-w-full max-h-full object-cover object-center" src={`${currentUser?.avatar[0]?.publicUrl}`} alt="Avatar" /> <Image
className="w-80 h-80 max-w-full max-h-full object-cover object-center"
src={`${currentUser?.avatar[0]?.publicUrl}`}
alt="Avatar"
width={320}
height={320}
/>
</div> </div>
</div>} </div>}
<Formik <Formik

View File

@ -0,0 +1,126 @@
import React, { ReactElement, useState, useEffect } from 'react';
import Head from 'next/head';
import { useRouter } from 'next/router';
import { useAppDispatch, useAppSelector } from '../../stores/hooks';
import LayoutAuthenticated from '../../layouts/Authenticated';
import { getPageTitle } from '../../config';
import CardBox from '../../components/CardBox';
import SectionMain from '../../components/SectionMain';
import BaseButton from '../../components/BaseButton';
import { findMe } from '../../stores/authSlice';
import axios from 'axios';
import { toast } from 'react-toastify';
export default function ProfileReconfirm() {
const router = useRouter();
const dispatch = useAppDispatch();
const { currentUser } = useAppSelector((state) => state.auth);
const [loading, setLoading] = useState(false);
// Get the member profile ID
const memberProfile = currentUser?.member_profiles_user?.[0] || currentUser?.member_profiles_user;
const handleReconfirm = async () => {
if (!memberProfile?.id) {
toast.error('No member profile found. Please complete your profile first.');
router.push('/profile');
return;
}
setLoading(true);
try {
// Update existing member profile with reconfirmation date
await axios.put(`/member_profiles/${memberProfile.id}`, {
id: memberProfile.id,
data: {
last_confirmed_at: new Date(),
confirmation_expires_at: new Date(new Date().setFullYear(new Date().getFullYear() + 1)),
profile_status: 'active'
}
});
await dispatch(findMe());
toast.success('Profile reconfirmed successfully. Thank you!');
// Redirect to the home page or directory
router.push('/');
} catch (error) {
console.error(error);
toast.error('Failed to reconfirm profile. Please try again.');
} finally {
setLoading(false);
}
};
if (!currentUser) return null;
return (
<>
<Head>
<title>{getPageTitle('Annual Profile Reconfirmation')}</title>
</Head>
<SectionMain>
<div className="max-w-3xl mx-auto py-12">
<CardBox>
<div className="space-y-8 p-6">
<div className="text-center space-y-4">
<h1 className="text-3xl font-bold text-[#091EAA]">Annual Profile Reconfirmation</h1>
<p className="text-gray-600">
To ensure our Executive Directory remains accurate and valuable for all members, we require an annual reconfirmation of your professional information.
</p>
</div>
<div className="bg-blue-50 p-6 border-l-4 border-[#091EAA] space-y-4">
<h2 className="font-semibold text-blue-900">Current Profile Summary</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
<div>
<p className="text-gray-500 uppercase text-xs font-bold">Professional Title</p>
<p className="font-medium">{memberProfile?.professional_title || 'Not specified'}</p>
</div>
<div>
<p className="text-gray-500 uppercase text-xs font-bold">Organization</p>
<p className="font-medium">{memberProfile?.organization || 'Not specified'}</p>
</div>
<div>
<p className="text-gray-500 uppercase text-xs font-bold">Industry</p>
<p className="font-medium">{memberProfile?.industry || 'Not specified'}</p>
</div>
<div>
<p className="text-gray-500 uppercase text-xs font-bold">Location</p>
<p className="font-medium">{memberProfile ? `${memberProfile.city || ''}, ${memberProfile.state || ''}` : 'Not specified'}</p>
</div>
</div>
<div className="pt-4 border-t border-blue-100">
<p className="text-xs text-blue-700 italic">
If this information is incorrect, please click &quot;Update My Profile&quot; below before reconfirming.
</p>
</div>
</div>
<div className="flex flex-col md:flex-row justify-center items-center gap-4 pt-4">
<BaseButton
label={loading ? 'Processing...' : 'Confirm Information is Accurate'}
color="info"
className="px-8 py-3 bg-[#091EAA] hover:bg-[#0055AA] border-none rounded-none text-lg shadow-lg"
onClick={handleReconfirm}
disabled={loading}
/>
<BaseButton
label="Update My Profile First"
color="white"
className="px-8 py-3 border-[#091EAA] text-[#091EAA] rounded-none text-lg"
onClick={() => router.push('/profile')}
disabled={loading}
/>
</div>
</div>
</CardBox>
</div>
</SectionMain>
</>
);
}
ProfileReconfirm.getLayout = function getLayout(page: ReactElement) {
return <LayoutAuthenticated>{page}</LayoutAuthenticated>;
};

View File

@ -39,11 +39,11 @@ export default function Register() {
return ( return (
<> <>
<Head> <Head>
<title>{getPageTitle('Login')}</title> <title>{getPageTitle('Register')}</title>
</Head> </Head>
<SectionFullScreen bg='violet'> <SectionFullScreen bg='executive'>
<CardBox className='w-11/12 md:w-7/12 lg:w-6/12 xl:w-4/12'> <CardBox className='w-11/12 md:w-7/12 lg:w-6/12 xl:w-4/12 shadow-lg border-gray-100'>
<Formik <Formik
initialValues={{ initialValues={{
email: '', email: '',
@ -71,11 +71,14 @@ export default function Register() {
type='submit' type='submit'
label={loading ? 'Loading...' : 'Register' } label={loading ? 'Loading...' : 'Register' }
color='info' color='info'
className='w-full md:w-auto'
/> />
<BaseButton <BaseButton
href={'/login'} href={'/login'}
label={'Login'} label={'Login'}
color='info' color='info'
outline
className='w-full md:w-auto'
/> />
</BaseButtons> </BaseButtons>
</Form> </Form>

File diff suppressed because one or more lines are too long