paul/go-sjles-pta-vote
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

First attempt at react interface

Browse Source
This commit is contained in:
paul
2026-01-21 12:51:40 -05:00
parent 5d8977e0c0
commit 3c489b7c32
16 changed files with 16805 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env
View File

@@ -1 +1 @@
db_path="./pta_vote.db" db_path="pta_vote.db"

31
.gitignore vendored
View File

@@ -22,3 +22,34 @@
go.work go.work
go.work.sum go.work.sum
# ---> React & npm
node_modules/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# ---> NPM cache
.npmrc
# ---> Webpack
dist/
build/
# ---> Babel
.babelrc
babel.config.js
# ---> ESLint
.eslintrc
.eslintignore
eslintcache.js
# ---> Prettier
.prettierrc
prettierignore
# ---> Jest
coverage/
jest.config.js

16425
client/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

41
client/package.json Normal file
View File

@@ -0,0 +1,41 @@
{
"name": "go-sjles-pta-vote-client",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"dependencies": {
"@testing-library/jest-dom": "6.9.1",
"@testing-library/react": "16.3.2",
"@testing-library/user-event": "14.6.1",
"axios":"1.13.2",
"css-loader": "7.1.2",
"react": "19.2.3",
"react-dom": "19.2.3",
"react-router": "7.12.0",
"react-scripts": "5.0.1",
"sass-loader": "16.0.6",
"webpack": "5.104.1",
"webpack-cli": "6.0.1"
},
"devDependencies": {
"typescript": "^4"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

12
client/public/index.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>PTA Vote System</title>
</head>
<body>
<div id="root"></div>
</body>
</html>

14
client/src/App.css Normal file
View File

@@ -0,0 +1,14 @@
.App {
text-align: center;
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}

27
client/src/App.js Normal file
View File

@@ -0,0 +1,27 @@
import React from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router';
import './App.css';
import AdminMembersPage from './pages/AdminMembersPage';
function App() {
return (
<Router>
<div className="App">
<header className="App-header">
<h1>PTA Vote System</h1>
{/* Add navigation link */}
<nav>
<a href="/admin-members">Upload Members</a>
</nav>
</header>
<main>
<Routes>
<Route path="/admin-members" element={<AdminMembersPage />} />
</Routes>
</main>
</div>
</Router>
);
}
export default App;

63
client/src/components/MembersForm.js Normal file
View File

@@ -0,0 +1,63 @@
import React, { useState } from 'react';
import axios from '../services/api';
function MembersForm() {
const [year, setYear] = useState('');
const [file, setFile] = useState(null);
const handleSubmit = async (e) => {
e.preventDefault();
if (!year || !file) {
alert('Both year and file are required!');
return;
}
try {
const formData = new FormData();
formData.append('year', year);
formData.append('members.csv', file);
await axios.post('/admin/members', formData, {
headers: { 'Content-Type': 'multipart/form-data' }
});
alert('Members uploaded successfully!');
setYear('');
setFile(null);
} catch (error) {
alert(`Error uploading members: ${error.response?.data.error || error.message}`);
}
};
return (
<form onSubmit={handleSubmit}>
<h1>Upload Members CSV</h1>
<div className="form-group">
<label htmlFor="year">Year:</label>
<input
type="number"
id="year"
value={year}
onChange={(e) => setYear(e.target.value)}
required
/>
</div>
<div className="form-group">
<label htmlFor="members.csv">CSV File:</label>
<input
type="file"
id="members.csv"
accept=".csv"
onChange={(e) => setFile(e.target.files[0])}
required
/>
</div>
<button type="submit">Upload</button>
</form>
);
}
export default MembersForm;

48
client/src/components/VoteForm.js Normal file
View File

@@ -0,0 +1,48 @@
import React, { useState } from 'react';
import axios from 'axios';
function VoteForm() {
const [email, setEmail] = useState('');
const [voteOption, setVoteOption] = useState('');
const handleSubmit = async (e) => {
e.preventDefault();
try {
await axios.post('http://localhost:8080/vote', {
email,
voteOption
});
alert('Vote submitted successfully!');
} catch (error) {
console.error(error);
alert('Error submitting vote');
}
};
return (
<form onSubmit={handleSubmit}>
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder="Enter your email"
required
/>
<select
value={voteOption}
onChange={(e) => setVoteOption(e.target.value)}
required
>
<option value="">Select an option</option>
{/* Add options dynamically based on poll data */}
</select>
<button type="submit">Submit Vote</button>
</form>
);
}
export default VoteForm;

11
client/src/index.js Normal file
View File

@@ -0,0 +1,11 @@
import React from 'react';
import {createRoot} from 'react-dom/client';
import './App.css';
import App from './App';
const root = createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);

13
client/src/pages/AdminMembersPage.js Normal file
View File

@@ -0,0 +1,13 @@
import React from 'react';
import MembersForm from '../components/MembersForm';
function AdminMembersPage() {
return (
<div className="admin-members-page">
<h1>Upload Members</h1>
<MembersForm />
</div>
);
}
export default AdminMembersPage;

7
client/src/services/api.js Normal file
View File

@@ -0,0 +1,7 @@
import axios from 'axios';
const api = axios.create({
baseURL: '/api',
});
export default api;

3
server/db/db.go
View File

@@ -2,10 +2,7 @@ package db
import ( import (
"database/sql" "database/sql"
"errors"
"log" "log"
"os"
"strings"
"go-sjles-pta-vote/server/config" "go-sjles-pta-vote/server/config"

46
server/main.go
View File

@@ -102,15 +102,22 @@ func adminIDHandler(w http.ResponseWriter, r *http.Request) {
func adminMembersHandler(w http.ResponseWriter, r *http.Request) { func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
if r.Method == "GET" { if r.Method == "GET" {
filePath := "./server/templates/members.html" // Redirect to client's AdminMembersPage instead of serving members.html
log.Printf("Serving members.html from %s", filePath) w.Header().Set("Location", "/admin-members")
http.ServeFile(w, r, filePath) w.WriteHeader(http.StatusFound)
return
} else if r.Method == "POST" { } else if r.Method == "POST" {
var year int var year int
var err error var err error
r.ParseForm()
if err = r.ParseMultipartForm(10 << 20); err != nil {
http.Error(w, "Failed to parse multipart form", http.StatusBadRequest)
return
}
if y := r.FormValue("year"); y != "" { if y := r.FormValue("year"); y != "" {
year, err = strconv.Atoi(y) year, err = strconv.Atoi(y)
log.Printf("Parsed year: %d", year)
if err != nil { if err != nil {
http.Error(w, "Invalid year", http.StatusBadRequest) http.Error(w, "Invalid year", http.StatusBadRequest)
return return
@@ -130,8 +137,7 @@ func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
return return
} }
err = services.ParseMembersFromBytes(year, fileBytes) if err = services.ParseMembersFromBytes(year, fileBytes); err != nil {
if err != nil {
w.WriteHeader(http.StatusBadRequest) w.WriteHeader(http.StatusBadRequest)
json.NewEncoder(w).Encode(map[string]string{"error": err.Error()}) json.NewEncoder(w).Encode(map[string]string{"error": err.Error()})
return return
@@ -144,6 +150,16 @@ func adminMembersHandler(w http.ResponseWriter, r *http.Request) {
} }
} }
// Add a new handler for the client's AdminMembersPage
func adminMembersClientHandler(w http.ResponseWriter, r *http.Request) {
filePath := "./client/build/admin-members.html"
if _, err := os.Stat(filePath); err == nil {
http.ServeFile(w, r, filePath)
} else {
w.WriteHeader(http.StatusNotFound)
}
}
func main() { func main() {
log.SetOutput(os.Stdout) log.SetOutput(os.Stdout)
log.SetFlags(log.LstdFlags | log.Lshortfile) log.SetFlags(log.LstdFlags | log.Lshortfile)
@@ -161,6 +177,24 @@ func main() {
filePath := "./server/icons/favicon.ico" filePath := "./server/icons/favicon.ico"
http.ServeFile(w, r, filePath) http.ServeFile(w, r, filePath)
}) })
http.Handle("/", http.FileServer(http.Dir("./client/build")))
// Add this function to handle static files during development
http.HandleFunc("/static/", func(w http.ResponseWriter, r *http.Request) {
if r.URL.Path == "/" {
http.ServeFile(w, r, "./client/build/index.html")
} else {
file := "./client/build" + r.URL.Path
if _, err := os.Stat(file); err == nil {
http.ServeFile(w, r, file)
} else {
w.WriteHeader(http.StatusNotFound)
}
}
})
// Add this line to handle client's AdminMembersPage
http.HandleFunc("/admin-members", adminMembersClientHandler)
log.Fatal(http.ListenAndServe(":8080", nil)) log.Fatal(http.ListenAndServe(":8080", nil))
} }

2
server/services/putmembers.go
View File

@@ -16,7 +16,7 @@ type Member struct {
Email string Email string
} }
BATCH_SIZE := 100 const BATCH_SIZE = 100
func ParseMembersFromBytes(year int, fileBytes []byte) error { func ParseMembersFromBytes(year int, fileBytes []byte) error {
reader := csv.NewReader(strings.NewReader(string(fileBytes))) reader := csv.NewReader(strings.NewReader(string(fileBytes)))

72
server/templates/members.html
View File

@@ -4,15 +4,77 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Upload Members</title> <title>Upload Members</title>
<link rel="icon" type="image/x-icon" href="/favicon.ico"> <link rel="icon" type="image/x-icon" href="/favicon.ico">
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
</head> </head>
<body> <body>
<div id="root"></div>
<script type="text/babel">
function MembersForm() {
const [year, setYear] = React.useState(0);
const [file, setFile] = React.useState(null);
const handleSubmit = (e) => {
e.preventDefault();
if (!year || !file) {
alert('Both year and file are required!');
return;
}
const formData = new FormData();
formData.append('year', year);
formData.append('members.csv', file);
fetch('/admin/members', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('Members uploaded successfully!');
} else {
alert(`Error: ${data.error}`);
}
});
};
return (
<form onSubmit={handleSubmit}>
<h1>Upload Members CSV</h1> <h1>Upload Members CSV</h1>
<form action="/admin/members" method="post" enctype="multipart/form-data"> <label htmlFor="year">Year:</label>
<label for="year">Year:</label> <input
<input type="number" id="year" name="year" required><br><br> type="number"
<label for="members.csv">CSV File:</label> id="year"
<input type="file" id="members.csv" name="members.csv" accept=".csv" required><br><br> name="year"
value={year}
onChange={(e) => setYear(e.target.value)}
required
/><br/><br/>
<label htmlFor="members.csv">CSV File:</label>
<input
type="file"
id="members.csv"
name="members.csv"
accept=".csv"
onChange={(e) => setFile(e.target.files[0])}
required
/><br/><br/>
<button type="submit">Upload</button> <button type="submit">Upload</button>
</form> </form>
);
}
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<MembersForm />
);
</script>
</body> </body>
</html> </html>