kyle/flxn-app
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

bug fixes, layout fixes

Browse Source
This commit is contained in:
yohlo
2025-09-29 15:13:41 -05:00
parent 732afaf623
commit 3a41609a91
6 changed files with 50 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/routes/__root.tsx
View File

@@ -37,7 +37,7 @@ export const Route = createRootRouteWithContext<{
{ {
name: "viewport", name: "viewport",
content: content:
"width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, interactive-widget=overlays-content", "width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, interactive-widget=resizes-content",
}, },
], ],
links: [ links: [
@@ -122,8 +122,7 @@ function RootDocument({ children }: { children: React.ReactNode }) {
{...mantineHtmlProps} {...mantineHtmlProps}
style={{ style={{
overflowX: "hidden", overflowX: "hidden",
overflowY: "hidden", height: "100%",
position: "fixed",
width: "100%", width: "100%",
}} }}
> >
@@ -135,9 +134,10 @@ function RootDocument({ children }: { children: React.ReactNode }) {
<body <body
style={{ style={{
overflowX: "hidden", overflowX: "hidden",
overflowY: "hidden", height: "100%",
position: "fixed",
width: "100%", width: "100%",
margin: 0,
padding: 0,
}} }}
> >
<div className="app">{children}</div> <div className="app">{children}</div>

14
src/app/routes/api/events.$.ts
View File

@@ -17,6 +17,10 @@ export const Route = createFileRoute("/api/events/$")({
logger.info("ServerEvents | Event received", event); logger.info("ServerEvents | Event received", event);
const message = `data: ${JSON.stringify(event)}\n\n`; const message = `data: ${JSON.stringify(event)}\n\n`;
try { try {
if (!controller.desiredSize || controller.desiredSize <= 0) {
logger.warn("ServerEvents | Stream closed, skipping event");
return;
}
controller.enqueue(new TextEncoder().encode(message)); controller.enqueue(new TextEncoder().encode(message));
} catch (error) { } catch (error) {
logger.error("ServerEvents | Error sending SSE message", error); logger.error("ServerEvents | Error sending SSE message", error);
@@ -29,9 +33,14 @@ export const Route = createFileRoute("/api/events/$")({
const pingInterval = setInterval(() => { const pingInterval = setInterval(() => {
try { try {
if (!controller.desiredSize || controller.desiredSize <= 0) {
clearInterval(pingInterval);
return;
}
const pingMessage = `data: ${JSON.stringify({ type: "ping" })}\n\n`; const pingMessage = `data: ${JSON.stringify({ type: "ping" })}\n\n`;
controller.enqueue(new TextEncoder().encode(pingMessage)); controller.enqueue(new TextEncoder().encode(pingMessage));
} catch (e) { } catch (e) {
logger.error("ServerEvents | Ping interval error", e);
clearInterval(pingInterval); clearInterval(pingInterval);
} }
}, 30000); }, 30000);
@@ -49,10 +58,11 @@ export const Route = createFileRoute("/api/events/$")({
return new Response(stream, { return new Response(stream, {
headers: { headers: {
"Content-Type": "text/event-stream", "Content-Type": "text/event-stream",
"Cache-Control": "no-cache", "Cache-Control": "no-cache, no-store, must-revalidate",
Connection: "keep-alive", "Connection": "keep-alive",
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Headers": "Cache-Control", "Access-Control-Allow-Headers": "Cache-Control",
"X-Accel-Buffering": "no",
}, },
}); });
}, },

6
src/features/core/components/layout.tsx
View File

@@ -31,7 +31,11 @@ const Layout: React.FC<PropsWithChildren> = ({ children }) => {
pos='relative' pos='relative'
h='100dvh' h='100dvh'
mah='100dvh' mah='100dvh'
// style={{ top: viewport.top }} //, transition: 'top 0.1s ease-in-out' }} style={{
height: `${viewport.height}px`,
minHeight: '100dvh',
// top: viewport.top
}}
> >
<Header {...header} /> <Header {...header} />
<AppShell.Main <AppShell.Main

8
src/features/core/hooks/use-visual-viewport-size.ts
View File

@@ -19,11 +19,17 @@ const useVisualViewportSize = () => {
useEffect(() => { useEffect(() => {
if (!windowExists) return; if (!windowExists) return;
setSize();
window.visualViewport?.addEventListener('resize', setSize, eventListerOptions); window.visualViewport?.addEventListener('resize', setSize, eventListerOptions);
window.visualViewport?.addEventListener('scroll', setSize, eventListerOptions);
return () => { return () => {
window.visualViewport?.removeEventListener('resize', setSize); window.visualViewport?.removeEventListener('resize', setSize);
window.visualViewport?.removeEventListener('scroll', setSize);
} }
}, []); }, [setSize]);
return windowSize; return windowSize;
} }

3
src/lib/supertokens/server.ts
View File

@@ -17,7 +17,8 @@ export const backendConfig = (): TypeInput => {
}, },
appInfo, appInfo,
recipeList: [ recipeList: [
passwordlessTwilioVerify.init(), //passwordlessTwilioVerify.init(),
PasswordlessDevelopmentMode.init(),
Session.init({ Session.init({
cookieSameSite: "lax", cookieSameSite: "lax",
cookieSecure: import.meta.env.NODE_ENV === "production", cookieSecure: import.meta.env.NODE_ENV === "production",

25
src/lib/twilio/index.ts
View File

@@ -1,21 +1,33 @@
import twilio, { type Twilio } from "twilio"; import twilio, { type Twilio } from "twilio";
const accountSid = process.env.TWILIO_ACCOUNT_SID!;
const authToken = process.env.TWILIO_AUTH_TOKEN!;
const serviceSid = process.env.TWILIO_SERVICE_SID!;
let client: Twilio; let client: Twilio;
function getEnvVars() {
const accountSid = process.env.TWILIO_ACCOUNT_SID;
const authToken = process.env.TWILIO_AUTH_TOKEN;
const serviceSid = process.env.TWILIO_SERVICE_SID;
if (!accountSid || !authToken || !serviceSid) {
throw new Error(`Missing env vars. accountSid: ${!!accountSid}, authToken: ${!!authToken}, serviceSid: ${!!serviceSid}`);
}
return { accountSid, authToken, serviceSid };
}
function getTwilioClient() { function getTwilioClient() {
if (!client) { if (!client) {
const { accountSid, authToken } = getEnvVars();
client = twilio(accountSid, authToken); client = twilio(accountSid, authToken);
} }
return client; return client;
} }
export async function sendVerifyCode(phoneNumber: string, code: string) { export async function sendVerifyCode(phoneNumber: string, code: string) {
const { serviceSid } = getEnvVars();
const twilioClient = getTwilioClient(); const twilioClient = getTwilioClient();
const verification = await twilioClient!.verify.v2 const verification = await twilioClient!.verify.v2
.services(serviceSid) .services(serviceSid)
.verifications.create({ .verifications.create({
@@ -32,8 +44,9 @@ export async function sendVerifyCode(phoneNumber: string, code: string) {
} }
export async function updateVerify(sid: string) { export async function updateVerify(sid: string) {
const { serviceSid } = getEnvVars();
const twilioClient = getTwilioClient(); const twilioClient = getTwilioClient();
const verification = await twilioClient!.verify.v2 const verification = await twilioClient!.verify.v2
.services(serviceSid) .services(serviceSid)
.verifications(sid) .verifications(sid)