dylan/gander
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix: Checkout

Browse Source 
Fix: Formatting
This commit is contained in:
Chris-1010
2025-01-23 14:50:38 +00:00
parent 33111ea077
commit 667088ec9e
9 changed files with 56 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/Dockerfile
View File

@@ -1,20 +1,16 @@
# Use the latest LTS version of Node.js
FROM node:18-alpine
# Set the working directory inside the container
WORKDIR /frontend
# Copy package.json and package-lock.json
ENV VITE_API_URL=${VITE_API_URL}
ENV VITE_STRIPE_PUBLISHABLE_KEY=${VITE_STRIPE_PUBLISHABLE_KEY}
COPY package*.json ./
# Install dependencies
RUN npm install
# Copy the rest of your application files
COPY . .
# Expose the port your app runs on
EXPOSE 5173
# Define the command to run your app
CMD ["npm", "run", "dev", "--", "--host"]

11
frontend/package-lock.json generated
View File

@@ -24,6 +24,7 @@
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.16",
"globals": "^15.14.0",
"lucide-react": "^0.473.0",
"postcss": "^8.5.1",
"tailwindcss": "^3.4.17",
"typescript": "~5.6.2",
@@ -3008,6 +3009,16 @@
"yallist": "^3.0.2"
}
},
"node_modules/lucide-react": {
"version": "0.473.0",
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.473.0.tgz",
"integrity": "sha512-KW6u5AKeIjkvrxXZ6WuCu9zHE/gEYSXCay+Gre2ZoInD0Je/e3RBtP4OHpJVJ40nDklSvjVKjgH7VU8/e2dzRw==",
"dev": true,
"license": "ISC",
"peerDependencies": {
"react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/merge2": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",

4
frontend/package.json
View File

@@ -27,11 +27,11 @@
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.16",
"globals": "^15.14.0",
"lucide-react": "^0.473.0",
"postcss": "^8.5.1",
"tailwindcss": "^3.4.17",
"typescript": "~5.6.2",
"typescript-eslint": "^8.18.2",
"vite": "^6.0.5",
"lucide-react": "0.473.0"
"vite": "^6.0.5"
}
}

3
frontend/src/components/Checkout/CheckoutForm.tsx
View File

@@ -76,11 +76,10 @@ const CheckoutForm: React.FC<CheckoutFormProps> = ({ onClose }) => {
>
✕
</button>
<div className="bg-white p-6 rounded-lg w-full max-w-2xl relative h-full rounded-[2rem]">
<div className="bg-white p-6 rounded-lg w-full max-w-2xl relative h-full rounded-[2rem]" style={{ width: "clamp(300px, 60vw, 800px)" }}>
<div
id="checkout"
className="h-full overflow-auto min-w-[30vw]"
style={{ width: "clamp(300px, 60vw, 800px)" }}
>
<EmbeddedCheckoutProvider stripe={stripePromise} options={options}>
<EmbeddedCheckout />

2
frontend/src/components/Layout/Button.tsx
View File

@@ -11,7 +11,7 @@ const Button: React.FC<ButtonProps> = ({
}) => {
return (
<div>
<button onClick={onClick}>
<button className="underline bg-blue-600/30 p-4 rounded-[5rem] transition-all hover:text-[3.2rem]" onClick={onClick}>
{title}
</button>
</div>

1
frontend/src/pages/HomePage.tsx
View File

@@ -3,7 +3,6 @@ import Navbar from "../components/Layout/Navbar";
import ListRow from "../components/Layout/ListRow";
// import { data, Link } from "react-router-dom";
const handleStreamClick = (streamId: string) => {
// Handle navigation to stream page
console.log(`Navigating to stream ${streamId}`);

52
frontend/src/pages/VideoPage.tsx
View File

@@ -1,36 +1,38 @@
import React, { useState, useEffect } from 'react';
import Button from '../components/Layout/Button';
import CheckoutForm, { Return } from '../components/Checkout/CheckoutForm';
import React, { useState, useEffect } from "react";
import Button from "../components/Layout/Button";
import CheckoutForm, { Return } from "../components/Checkout/CheckoutForm";
const VideoPage: React.FC = () => {
const [showCheckout, setShowCheckout] = useState(false);
const showReturn = window.location.search.includes('session_id');
useEffect(() => {
if (showCheckout) {
document.body.style.overflow = "hidden";
} else {
document.body.style.overflow = "unset";
}
// Cleanup function to ensure overflow is restored when component unmounts
return () => {
document.body.style.overflow = "unset";
};
}, [showCheckout]);
return (
<div>
<h1>Hello!</h1>
const [showCheckout, setShowCheckout] = useState(false);
const showReturn = window.location.search.includes("session_id");
<Button
useEffect(() => {
if (showCheckout) {
document.body.style.overflow = "hidden";
} else {
document.body.style.overflow = "unset";
}
// Cleanup function to ensure overflow is restored when component unmounts
return () => {
document.body.style.overflow = "unset";
};
}, [showCheckout]);
return (
<div className="text-5xl text-red-600 flex flex-col justify-evenly align-center h-screen text-center">
<h1>
Hello! Welcome to the soon-to-be-awesome Video Page where you'll watch
the best streams ever!
</h1>
<Button
title="Payment Screen Test"
onClick={() => setShowCheckout(true)}
/>
{showCheckout && <CheckoutForm onClose={() => setShowCheckout(false)} />}
{showReturn && <Return />}
</div>
);
</div>
);
};
export default VideoPage;
export default VideoPage;

6
frontend/vite.config.ts
View File

@@ -6,5 +6,11 @@ export default defineConfig({
plugins: [react()],
server: {
allowedHosts: ['frontend'],
proxy: {
'/api': {
target: 'http://localhost:8080',
changeOrigin: true,
}
}
},
})

7
web_server/Dockerfile
View File

@@ -1,26 +1,19 @@
FROM python:3.10
# Set the working directory
WORKDIR /web_server
# Args that can be passed during build
ARG FLASK_SECRET_KEY
ARG STRIPE_SECRET_KEY
# Set as environment variables
ENV FLASK_SECRET_KEY=${FLASK_SECRET_KEY}
ENV STRIPE_SECRET_KEY=${STRIPE_SECRET_KEY}
# Install dependencies
COPY requirements.txt requirements.txt
RUN pip install --no-cache-dir -r requirements.txt
# Copy application code
COPY . .
# Set environment variables
ENV FLASK_APP=blueprints.__init__
ENV FLASK_DEBUG=True
# Start the Flask app
CMD ["gunicorn", "-b", "0.0.0.0:5000", "blueprints.__init__:create_app()"]