From 13b4a6f064b1dc341a77c53a4e52bcfb3c513c68 Mon Sep 17 00:00:00 2001 From: Sean Wotherspoon Date: Mon, 25 Nov 2024 18:16:38 -0800 Subject: [PATCH] Fix base path and img urls --- src/App.tsx | 2 +- src/components/Header.tsx | 4 +++- src/components/Projects.tsx | 4 +++- src/components/Teams.tsx | 14 ++++++++------ src/utils/basePath.ts | 3 +++ vite.config.ts | 11 ++++++----- 6 files changed, 24 insertions(+), 14 deletions(-) create mode 100644 src/utils/basePath.ts diff --git a/src/App.tsx b/src/App.tsx index 71c9a9a..a60e418 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -10,7 +10,7 @@ import Resources from './components/Resources' function App() { return ( - +
diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 48c26ea..c857afc 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,7 +1,9 @@ import React, { useState } from 'react'; import { Link } from 'react-router-dom'; +import { getBasePath } from '../utils/basePath'; const Header = () => { + const basePath = getBasePath(); const [menuOpen, setMenuOpen] = useState(false); const openMenu = () => { @@ -46,7 +48,7 @@ const Header = () => { {/* Centered Club Logo */} - SFU OS Dev Club Logo + SFU OS Dev Club Logo {/* Empty Div for spacing on right side on small screens */} diff --git a/src/components/Projects.tsx b/src/components/Projects.tsx index 936d8f0..adaff0a 100644 --- a/src/components/Projects.tsx +++ b/src/components/Projects.tsx @@ -1,6 +1,7 @@ import React, { useState } from 'react' import Project from './Project' import { ProjectType } from '../interfaces/project-type' +import { getBasePath } from '../utils/basePath'; const onGoingProjectsList: ProjectType[] = [ { @@ -45,6 +46,7 @@ const pastProjectsList: ProjectType[] = [ ]; const Projects = () => { + const basePath = getBasePath(); const [activeTab, setActiveTab] = useState('ONGOING'); const renderProjectsList = () => { @@ -68,7 +70,7 @@ const Projects = () => { key={index} title={project.title} description={project.description} - imgURL={project.imgURL} + imgURL={`${basePath}/${project.imgURL}`} githubURL={project.githubURL} /> )); diff --git a/src/components/Teams.tsx b/src/components/Teams.tsx index e5eb589..4c8aea9 100644 --- a/src/components/Teams.tsx +++ b/src/components/Teams.tsx @@ -1,6 +1,8 @@ import React, { useEffect, useRef, useState } from 'react'; +import { getBasePath } from '../utils/basePath'; const Teams = () => { + const basePath = getBasePath(); const scrollContainerRef = useRef(null); const [isScrolledLeft, setIsScrolledLeft] = useState(true); const [isScrolledRight, setIsScrolledRight] = useState(false); @@ -52,7 +54,7 @@ const Teams = () => {
- Daniel Pham + Daniel Pham

Daniel Pham

Co-President

@@ -61,7 +63,7 @@ const Teams = () => {
- Tommy Oh + Tommy Oh

Tommy (Kanggeon) Oh

Co-President

@@ -77,7 +79,7 @@ const Teams = () => {
- Sean Wotherspoon + Sean Wotherspoon

Sean Wotherspoon

Director of Technology

@@ -86,7 +88,7 @@ const Teams = () => {
- Daniel Ahn + Daniel Ahn

Daniel Ahn

Director of Communications

@@ -96,7 +98,7 @@ const Teams = () => {
- {/* Dhruv Gupta */} + {/* Dhruv Gupta */}
@@ -110,7 +112,7 @@ const Teams = () => {
- Jeeya Parasbhai Khavadia + Jeeya Parasbhai Khavadia

Jeeya Parasbhai Khavadia

Director of Events

diff --git a/src/utils/basePath.ts b/src/utils/basePath.ts new file mode 100644 index 0000000..c8d6a7f --- /dev/null +++ b/src/utils/basePath.ts @@ -0,0 +1,3 @@ +export const getBasePath = () => { + return import.meta.env.MODE === 'production' ? '/Website' : ''; +}; \ No newline at end of file diff --git a/vite.config.ts b/vite.config.ts index 1d0fd35..d98f03f 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -2,9 +2,10 @@ import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ -export default defineConfig(() => { - return { - base: '/', - plugins: [react()], - }; +export default defineConfig(({ mode }) => { + const base = mode === "production" ? "/Website/" : "/"; + return { + base, + plugins: [react()], + }; });