Skip to content

Commit 0bc1073

Browse files
author
root
committed
fix cors issues and add favicon , remove gsap for perfomance issues
2 parents 52f553d + e53e38d commit 0bc1073

10 files changed

Lines changed: 187 additions & 191 deletions

File tree

‎backend/src/auth-service/src/main.ts‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,21 @@ async function bootstrap() {
3838
}),
3939
);
4040

41+
// Allow one or more comma-separated origins via FRONTEND_URL, e.g.
42+
// "https://rihla.tech,https://137.184.159.183". Requests with no Origin
43+
// (same-origin, curl, health checks) are always allowed.
44+
const allowedOrigins = (process.env.FRONTEND_URL || 'https://rihla.tech')
45+
.split(',')
46+
.map((o) => o.trim())
47+
.filter(Boolean);
48+
4149
app.enableCors({
42-
origin: process.env.FRONTEND_URL || 'https://rihla.tech',
50+
origin: (origin, callback) => {
51+
if (!origin || allowedOrigins.includes(origin)) {
52+
return callback(null, true);
53+
}
54+
return callback(new Error(`Origin ${origin} not allowed by CORS`), false);
55+
},
4356
credentials: true,
4457
allowedHeaders: ['Content-Type', 'Authorization', 'X-CSRF-Token'],
4558
});

‎frontend/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<!-- <link rel="icon" type="image/png" href="/Vector.png"> -->
6+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
77
<title>Rihla</title>
88
<link rel="preconnect" href="https://fonts.googleapis.com">
99
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

‎frontend/package-lock.json‎

Lines changed: 0 additions & 5 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
"@tailwindcss/vite": "^4.1.18",
1414
"class-variance-authority": "^0.7.1",
1515
"clsx": "^2.1.1",
16-
"gsap": "^3.14.2",
1716
"lucide-react": "^0.563.0",
1817
"radix-ui": "^1.4.3",
1918
"react": "^19.2.0",

‎frontend/public/favicon.svg‎

Lines changed: 9 additions & 0 deletions
Loading

‎frontend/src/components/shared/GlassNavBar.css‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,9 +205,26 @@
205205
font-weight: 500;
206206
letter-spacing: 0.01em;
207207
white-space: nowrap;
208-
width: 0;
208+
max-width: 0;
209+
margin-left: 0;
209210
opacity: 0;
210211
overflow: hidden;
212+
/* Expand/collapse driven purely by the `.active` class (replaces GSAP). */
213+
transition: max-width 0.4s cubic-bezier(0.22, 0.61, 0.36, 1),
214+
margin-left 0.4s cubic-bezier(0.22, 0.61, 0.36, 1),
215+
opacity 0.35s ease;
216+
}
217+
218+
.glass-nav-item.active .nav-label {
219+
max-width: 8rem;
220+
margin-left: 0.5rem;
221+
opacity: 1;
222+
}
223+
224+
@media (prefers-reduced-motion: reduce) {
225+
.glass-nav-item .nav-label {
226+
transition: none;
227+
}
211228
}
212229

213230
@media (max-width: 768px) {

‎frontend/src/components/shared/GlassNavBar.tsx‎

Lines changed: 2 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { useRef, useState, useEffect, useCallback } from "react";
1+
import { useState, useEffect } from "react";
22
import { Home, Users, Bell, MessageCircle } from "lucide-react";
3-
import gsap from "gsap";
43
import "./GlassNavBar.css";
54

65
interface NavItem {
@@ -24,7 +23,6 @@ function GlassNavBar({
2423
/** Orange activity dots (e.g. unread / pending). */
2524
badges?: Partial<Record<GlassNavBadgeKey, boolean>> | undefined;
2625
}) {
27-
const labelRefs = useRef<(HTMLSpanElement | null)[]>([]);
2826
const [activeIndex, setActiveIndex] = useState<number>(0);
2927

3028
const navItems: NavItem[] = [
@@ -34,54 +32,17 @@ function GlassNavBar({
3432
{ id: "notifications", icon: <Bell size={28} />, label: "Notification" },
3533
];
3634

37-
const expandLabel = useCallback((index: number) => {
38-
const label = labelRefs.current[index];
39-
if (label) {
40-
gsap.killTweensOf(label);
41-
gsap.to(label, {
42-
width: "auto",
43-
opacity: 1,
44-
marginLeft: "0.5rem",
45-
duration: 0.4,
46-
ease: "power3.out",
47-
});
48-
}
49-
}, []);
50-
51-
const collapseLabel = useCallback((index: number) => {
52-
const label = labelRefs.current[index];
53-
if (label) {
54-
gsap.killTweensOf(label);
55-
gsap.to(label, {
56-
width: 0,
57-
opacity: 0,
58-
marginLeft: 0,
59-
duration: 0.35,
60-
ease: "power2.inOut",
61-
});
62-
}
63-
}, []);
64-
6535
useEffect(() => {
6636
const idx = navItems.findIndex((item) => item.id === activeId);
6737
if (idx !== -1) {
6838
setActiveIndex(idx);
6939
}
7040
}, [activeId]);
7141

72-
useEffect(() => {
73-
navItems.forEach((_, i) => {
74-
if (i === activeIndex) expandLabel(i);
75-
else collapseLabel(i);
76-
});
77-
}, [activeIndex, expandLabel, collapseLabel]);
78-
7942
const handleClick = (index: number) => {
8043
if (index === activeIndex) return;
8144

82-
collapseLabel(activeIndex);
8345
setActiveIndex(index);
84-
expandLabel(index);
8546

8647
const navItem = navItems[index];
8748
if (navItem && handleNavigation) {
@@ -104,10 +65,7 @@ function GlassNavBar({
10465
<span className="glass-nav-badge" aria-hidden />
10566
) : null}
10667
</span>
107-
<span
108-
className="nav-label"
109-
ref={(el) => { labelRefs.current[index] = el; }}
110-
>
68+
<span className="nav-label">
11169
{item.label}
11270
</span>
11371
</button>

‎frontend/src/lib/api.ts‎

Lines changed: 26 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,28 @@ const GATEWAY_ORIGIN = 'https://rihla.tech';
22
const LOCAL_HTTP_RE = /^http:\/\/(localhost|127\.0\.0\.1)(:\d+)?\/?$/;
33
const LOCAL_WS_RE = /^wss?:\/\/(localhost|127\.0\.0\.1)(:\d+)?(\/.*)?$/;
44

5+
/**
6+
* Gateway origin to use when no explicit VITE_* override is set.
7+
*
8+
* In production the SPA and the API gateway (nginx) share an origin, so we hit
9+
* the same origin the page was served from. This keeps API calls same-origin
10+
* whether the site is reached via its domain (rihla.tech) or the raw droplet IP
11+
* (https://137.184.159.183), which sidesteps CORS entirely. During local
12+
* `vite dev` (localhost) there is no local backend, so we fall back to the
13+
* deployed gateway.
14+
*/
15+
function defaultGatewayOrigin(): string {
16+
if (typeof window !== 'undefined') {
17+
const origin = window.location.origin;
18+
if (!LOCAL_HTTP_RE.test(origin)) return origin;
19+
}
20+
return GATEWAY_ORIGIN;
21+
}
22+
523
export function resolveGatewayUrl(value?: string): string {
624
const raw = (value ?? '').trim();
7-
if (!raw) return GATEWAY_ORIGIN;
8-
if (LOCAL_HTTP_RE.test(raw)) return GATEWAY_ORIGIN;
25+
if (!raw) return defaultGatewayOrigin();
26+
if (LOCAL_HTTP_RE.test(raw)) return defaultGatewayOrigin();
927
return raw;
1028
}
1129

@@ -14,9 +32,12 @@ export function resolveGatewayWebSocketUrl(
1432
path = '/ws',
1533
): string {
1634
const raw = (value ?? '').trim();
17-
if (!raw) return `wss://137.184.159.183${path}`;
18-
if (LOCAL_WS_RE.test(raw)) return `wss://137.184.159.183${path}`;
19-
return raw;
35+
if (raw && !LOCAL_WS_RE.test(raw)) return raw;
36+
// Target the same host the SPA was served from, so the socket origin matches.
37+
if (typeof window !== 'undefined' && !LOCAL_HTTP_RE.test(window.location.origin)) {
38+
return `wss://${window.location.host}${path}`;
39+
}
40+
return `wss://137.184.159.183${path}`;
2041
}
2142

2243
export const API_BASE_URL = resolveGatewayUrl(

‎frontend/src/pages/Hero.css‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,76 @@
4343
}
4444

4545

46+
/* ----------------------------------------------------------------------- */
47+
/* CSS scroll/load reveal — replaces the old GSAP + ScrollTrigger setup. */
48+
/* An IntersectionObserver in Hero.tsx toggles `.is-visible`; everything */
49+
/* below is GPU-friendly opacity/transform transitions. */
50+
/* ----------------------------------------------------------------------- */
51+
.hero-content,
52+
.hero-image,
53+
.how-it-works-item,
54+
.feature-right,
55+
.feature-left,
56+
.hero-button,
57+
.footer-bottom {
58+
opacity: 0;
59+
}
60+
61+
.hero-content,
62+
.hero-image,
63+
.about-content,
64+
.how-it-works-item,
65+
.feature-right,
66+
.feature-left,
67+
.hero-button,
68+
.footer-bottom {
69+
transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
70+
transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
71+
will-change: opacity, transform;
72+
backface-visibility: hidden;
73+
-webkit-backface-visibility: hidden;
74+
}
75+
76+
.hero-content { transform: translate3d(0, 60px, 0); }
77+
.hero-image { transform: translate3d(0, 80px, 0); }
78+
/* About text slid up but stayed visible in the original — keep that. */
79+
.about-content { transform: translate3d(0, 50px, 0); }
80+
.how-it-works-item { transform: translate3d(0, 60px, 0); }
81+
.feature-right,
82+
.feature-left { transform: translate3d(60px, 0, 0); }
83+
.hero-button { transform: translate3d(0, 30px, 0); }
84+
.footer-bottom { transform: translate3d(0, 20px, 0); }
85+
86+
/* Springy easing on the discover button, echoing the old back.out feel. */
87+
.hero-button { transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1); }
88+
89+
.hero-content.is-visible,
90+
.hero-image.is-visible,
91+
.about-content.is-visible,
92+
.how-it-works-item.is-visible,
93+
.feature-right.is-visible,
94+
.feature-left.is-visible,
95+
.hero-button.is-visible,
96+
.footer-bottom.is-visible {
97+
opacity: 1;
98+
transform: none;
99+
}
100+
101+
@media (prefers-reduced-motion: reduce) {
102+
.hero-content,
103+
.hero-image,
104+
.about-content,
105+
.how-it-works-item,
106+
.feature-right,
107+
.feature-left,
108+
.hero-button,
109+
.footer-bottom {
110+
opacity: 1 !important;
111+
transform: none !important;
112+
transition: none !important;
113+
}
114+
}
115+
46116
.content-section {
47117
background-color: #ffffff;
48118
padding: 10rem 2rem;

0 commit comments

Comments
 (0)