Yusuf-Sabuwala/profen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

final promist link up

Browse Source
This commit is contained in:
Yusuf Sabuwala
2026-07-23 09:43:04 +00:00
parent a3cb825878
commit 4ccf898068
4 changed files with 115 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/App.jsx
View File

@@ -9,6 +9,8 @@ import ServiceDetail from './pages/ServiceDetail'
import Project from './pages/Project'
import Contact from './pages/Contact'
const PAGE_LOAD = performance.now()
function NotFound() {
return (
<div style={{ padding: '120px 24px', textAlign: 'center' }}>
@@ -21,12 +23,19 @@ function NotFound() {
export default function App() {
useEffect(() => {
const preloader = document.getElementById("preloader")
if (preloader) {
preloader.classList.add("loaded")
setTimeout(() => preloader.remove(), 500)
}
const el = document.getElementById("preloader")
if (!el) return
const elapsed = performance.now() - PAGE_LOAD
const minShow = 1500 // ms — let user perceive the brand
const delay = Math.max(0, minShow - elapsed)
setTimeout(() => {
el.classList.add("loaded")
setTimeout(() => el.remove(), 500)
}, delay)
}, [])
return (
<BrowserRouter>
<ErrorBoundary>

10
src/components/home/HomeServicesSection.jsx
View File

@@ -2,7 +2,7 @@ import { Link } from "react-router-dom";
const SERVICES = [
{ slug: "adiabatic-pre-cooling-system", title: "Adiabatic Pre-Cooling System", img: "/assets/images/img-1.jpg", icon: "/assets/images/service_block_4.svg" },
{ slug: "misting-solutions", title: "Promist Misting Solutions", img: "/assets/images/IMG-9.jpg", icon: "/assets/images/why_feature_6.svg" },
{ slug: "misting-solutions", title: "Promist Misting Solutions", img: "/assets/images/IMG-9.jpg", icon: "/assets/images/why_feature_6.svg", external: true },
{ slug: "chiller-hot-cool-solutions", title: "Chiller Hot &amp; Cool Solution", img: "/assets/images/IMG-4.jpg", icon: "/assets/images/title_icon2.svg" },
{ slug: "building-management-system", title: "Building Management System", img: "/assets/images/bms.jpg", icon: "/assets/images/why_feature_2.svg" },
{ slug: "interior-fit-out-works", title: "Interior &amp; Fit-Out Work", img: "/assets/images/IMG-6.jpg", icon: "/assets/images/why_feature_1.svg" },
@@ -73,7 +73,13 @@ export default function HomeServicesSection() {
<img className="service-bg" decoding="async" src={s.img} alt={s.title} />
<div className="service-overlay"></div>
<div className="service-content">
<h3 className="service-title"><Link to={`/service/${s.slug}`}>{s.title}</Link></h3>
<h3 className="service-title">
{s.external ? (
<a href="http://promist.profen.openexplorer.xyz" target="_blank" rel="noopener noreferrer">{s.title}</a>
) : (
<Link to={`/service/${s.slug}`}>{s.title}</Link>
)}
</h3>
</div>
</div>
</div>

69
src/components/sections/ContactForm.jsx
View File

@@ -1,30 +1,65 @@
import { useState } from 'react'
export default function ContactForm({ heading, subtitle, style = 'default' }) {
const light = style === 'light'
const wrapperClass = light
? 'input-light ajax-contact pb-30 pb-md-0'
: 'ajax-contact'
const [form, setForm] = useState({ name: '', email: '', phone: '', subject: '', message: '' })
const handleChange = (e) => {
setForm(prev => ({ ...prev, [e.target.name]: e.target.value }))
}
const handleSubmit = (e) => {
e.preventDefault()
const { name, email, phone, subject, message } = form
const body = encodeURIComponent(
`Name: ${name}\nEmail: ${email}\nPhone: ${phone}\nSubject: ${subject}\n\n${message}`
)
const mailto = `mailto:info@profeng.ae?subject=${encodeURIComponent(subject || 'Contact Form')}&body=${body}`
window.location.href = mailto
}
return (
<div className={wrapperClass}>
<div className={light ? 'input-light ajax-contact pb-30 pb-md-0' : 'ajax-contact'}>
{heading && <h2 className="sec-title">{heading}</h2>}
<div className="wpcf7 no-js" id="wpcf7-f523-p48-o1" lang="en-US" dir="ltr" data-wpcf7-id="523">
<div className="screen-reader-response"><p role="status" aria-live="polite" aria-atomic="true"></p><ul></ul></div>
<form action="/contact" method="post" className="wpcf7-form init" aria-label="Contact form" noValidate="noValidate" data-status="init">
<form onSubmit={handleSubmit}>
<div className="row">
<div className="form-group col-md-6">
<span className="wpcf7-form-control-wrap"><input size="40" maxLength="400" className="wpcf7-form-control wpcf7-text wpcf7-validates-as-required form-control" aria-required="true" aria-invalid="false" placeholder="Your Name" type="text" name="name" /></span>
<span className="wpcf7-form-control-wrap">
<input
className="wpcf7-form-control wpcf7-text wpcf7-validates-as-required form-control"
aria-required="true" placeholder="Your Name" type="text" name="name"
value={form.name} onChange={handleChange} required
/>
</span>
{light ? <i className="fas fa-user"></i> : <i className="fal fa-user"></i>}
</div>
<div className="form-group col-md-6">
<span className="wpcf7-form-control-wrap"><input size="40" maxLength="400" className="wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email form-control" aria-required="true" aria-invalid="false" placeholder="Email Address" type="email" name="email" /></span>
<span className="wpcf7-form-control-wrap">
<input
className="wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email form-control"
aria-required="true" placeholder="Email Address" type="email" name="email"
value={form.email} onChange={handleChange} required
/>
</span>
{light ? <i className="fas fa-envelope"></i> : <i className="fal fa-envelope"></i>}
</div>
<div className="form-group col-md-6">
<span className="wpcf7-form-control-wrap"><input className="wpcf7-form-control wpcf7-number wpcf7-validates-as-required wpcf7-validates-as-number form-control" aria-required="true" aria-invalid="false" placeholder="Phone Number" type="number" name="phone" /></span>
<span className="wpcf7-form-control-wrap">
<input
className="wpcf7-form-control wpcf7-number wpcf7-validates-as-required wpcf7-validates-as-number form-control"
aria-required="true" placeholder="Phone Number" type="tel" name="phone"
value={form.phone} onChange={handleChange} required
/>
</span>
{light ? <i className="fas fa-phone"></i> : <i className="fal fa-phone"></i>}
</div>
<div className="form-group col-md-6">
<span className="wpcf7-form-control-wrap">
<select className="wpcf7-form-control wpcf7-select wpcf7-validates-as-required form-select nice-select" aria-required="true" aria-invalid="false" name="subject">
<select
className="wpcf7-form-control wpcf7-select wpcf7-validates-as-required form-select nice-select"
aria-required="true" name="subject"
value={form.subject} onChange={handleChange} required
>
<option value="">Select Subject</option>
<option value="General Query">General Query</option>
<option value="Help Support">Help Support</option>
@@ -34,15 +69,21 @@ export default function ContactForm({ heading, subtitle, style = 'default' }) {
{light ? <i className="fas fa-chevron-down"></i> : <i className="fal fa-chevron-down"></i>}
</div>
<div className="form-group col-12">
<span className="wpcf7-form-control-wrap"><textarea cols="40" rows="10" maxLength="2000" className="wpcf7-form-control wpcf7-textarea wpcf7-validates-as-required form-control" aria-required="true" aria-invalid="false" placeholder="Your Message" name="message"></textarea></span>
<span className="wpcf7-form-control-wrap">
<textarea
cols="40" rows="10" maxLength="2000"
className="wpcf7-form-control wpcf7-textarea wpcf7-validates-as-required form-control"
aria-required="true" placeholder="Your Message" name="message"
value={form.message} onChange={handleChange} required
></textarea>
</span>
{light ? <i className="fas fa-pencil"></i> : <i className="fal fa-pencil"></i>}
</div>
<div className="form-btn col-12">
<button className="th-btn">Send Message Now<i className="far fa-arrow-right ms-2"></i></button>
<button className="th-btn" type="submit">Send Message Now<i className="far fa-arrow-right ms-2"></i></button>
</div>
</div>
</form>
</div>
</div>
)
}

12
src/components/sections/Header.jsx
View File

@@ -12,7 +12,7 @@ const NAV_ITEMS = [
const SERVICE_SUBITEMS = [
{ label: 'Adiabatic Pre-Cooling System', slug: 'adiabatic-pre-cooling-system' },
{ label: 'Promist Misting Solutions', slug: 'misting-solutions' },
{ label: 'Promist Misting Solutions', slug: 'misting-solutions', external: true },
{ label: 'Chiller Hot & Cool Solution', slug: 'chiller-hot-cool-solutions' },
{ label: 'Building Management System', slug: 'building-management-system' },
{ label: 'Interior & Fit-Out Work', slug: 'interior-fit-out-works' },
@@ -62,7 +62,11 @@ export default function Header() {
<ul className="sub-menu" style={{ display: mobileServicesOpen ? 'block' : 'none' }}>
{SERVICE_SUBITEMS.map(s => (
<li key={s.slug} className={`menu-item${pathname === `/service/${s.slug}` ? ' current-menu-item' : ''}`}>
{s.external ? (
<a href="http://promist.profen.openexplorer.xyz" target="_blank" rel="noopener noreferrer">{s.label}</a>
) : (
<Link to={`/service/${s.slug}`}>{s.label}</Link>
)}
</li>
))}
</ul>
@@ -140,7 +144,11 @@ export default function Header() {
<ul className="sub-menu">
{SERVICE_SUBITEMS.map(s => (
<li key={s.slug} className={`menu-item${pathname === `/service/${s.slug}` ? ' current-menu-item' : ''}`}>
{s.external ? (
<a href="http://promist.profen.openexplorer.xyz" target="_blank" rel="noopener noreferrer">{s.label}</a>
) : (
<Link to={`/service/${s.slug}`}>{s.label}</Link>
)}
</li>
))}
</ul>
@@ -160,7 +168,7 @@ export default function Header() {
</div>
<div className="col-auto d-none d-xl-block">
<div className="header-button">
<a href="/service/misting-solutions">
<a href="http://promist.profen.openexplorer.xyz" target="_blank" rel="noopener noreferrer">
<img src="/assets/images/Promist-Logo-1.png" alt="Promist" style={{ height: '40px' }} />
</a>
</div>