Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

86/campaign code #98

Merged
merged 40 commits into from
Oct 31, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
2d48e56
moving upload dialog to its own file
acholyn Oct 8, 2024
d9aecdb
Merge branch '82/burger' into 86/campaign-code
acholyn Oct 8, 2024
6381dcd
Merge branch '82/burger' into 86/campaign-code
acholyn Oct 8, 2024
a630259
flow outline for checking access code + login on upload click
acholyn Oct 8, 2024
c495247
qol for login on upload click
acholyn Oct 8, 2024
2373626
fixing upload flow and updating some styling
acholyn Oct 9, 2024
366a4fa
more styling tweaks
acholyn Oct 9, 2024
7b560ba
Merge branch 'staging' into 86/campaign-code
acholyn Oct 9, 2024
13e587d
removing amplify backend - not actually using it
acholyn Oct 9, 2024
41bb7bb
adding loader to init of site
acholyn Oct 9, 2024
81104c5
streamlining + fixing minor errors re setting user and loader on init
acholyn Oct 10, 2024
c095ea9
fixing logout + styling changes
acholyn Oct 10, 2024
0981714
other user tweaks
acholyn Oct 10, 2024
03afc00
creating task when choosing opendata
acholyn Oct 10, 2024
132e40b
fixing install showing on ios
acholyn Oct 11, 2024
7f39f31
tweaks and fixes to upload dialog + styling
acholyn Oct 11, 2024
095c9f8
show error if code not valid
acholyn Oct 11, 2024
ff8a5b6
renaming login file - component based
acholyn Oct 11, 2024
9722065
naming changes
acholyn Oct 15, 2024
57353bb
updating usercontext filename in imports
acholyn Oct 21, 2024
ee3af97
application not applications
acholyn Oct 21, 2024
b5a9d6e
tweaks for the upload flow
acholyn Oct 21, 2024
bb3fa8b
improving syntax
acholyn Oct 22, 2024
d18ceb7
tweaks to login but further work needed for #112
acholyn Oct 22, 2024
1d5a6f0
new token validation and refreshing
acholyn Oct 22, 2024
1c3203b
updating upload flow + new way of referencing user due to token refresh
acholyn Oct 22, 2024
fa70cd2
tidying
acholyn Oct 23, 2024
2bba991
fixing upload flow
acholyn Oct 23, 2024
8065a87
success modal after upload
acholyn Oct 23, 2024
081ee7e
fixing main login not showing dialog
acholyn Oct 24, 2024
e672b45
sending task id with data for prefix
acholyn Oct 24, 2024
96e65c1
fixing to match new response of data submission
acholyn Oct 24, 2024
250a7bc
moving management of login to App, fixing login not showing after can…
acholyn Oct 25, 2024
e199b35
set preferred_username instead of custom:display_name at sign up
tcouch Oct 28, 2024
dd1751a
Fetch preferred_username from token
tcouch Oct 28, 2024
97da6c3
updating url for creating task (opendata)
acholyn Oct 29, 2024
a7ad372
Merge pull request #116 from UCL/update-cognito-field
tcouch Oct 29, 2024
9b45d40
Fix SignUpForm signUp function call
tcouch Oct 30, 2024
3809d45
Add auth headers to task api calls
tcouch Oct 30, 2024
1727d5c
Merge pull request #117 from UCL/86/task-api-auth
tcouch Oct 30, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,6 @@ dist/

# Config
src/config.json
src/exportConfig.sh
export*.sh

.DS_Store
3 changes: 2 additions & 1 deletion globals.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ export const ASK_URL = process.env.ASK_URL;
export const POOL_ID = process.env.POOL_ID;
export const CLIENT_ID = process.env.CLIENT_ID;
export const REGION = process.env.REGION;
export const INVOKE_URL = process.env.INVOKE_URL;
export const UPLOAD_URL = process.env.UPLOAD_URL;
export const MAPBOX_TOKEN = process.env.MAPBOX_TOKEN;
export const CODE_API_URL = process.env.CODE_API_URL;

export let cognito = null;
export let hasCognito = false;
Expand Down
20,933 changes: 3,291 additions & 17,642 deletions package-lock.json

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@
"@fortawesome/free-regular-svg-icons": "^6.5.2",
"@fortawesome/free-solid-svg-icons": "^6.5.2",
"@fortawesome/react-fontawesome": "^0.2.2",
"@aws-amplify/backend": "^1.3.0",
"copy-webpack-plugin": "^12.0.2",
"html2canvas": "^1.4.1",
"i18next": "^23.14.0",
Expand Down
4 changes: 2 additions & 2 deletions src/BurgerMenu.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { exitButtonIcon, GHIcon } from "./icons.js";
export default function BurgerMenu({
isVisible,
setIsVisible,
setIsDialogVisible,
setIsLoginVisible,
setIsWelcomeVisible,
}) {
const { t } = useTranslation();
Expand All @@ -22,7 +22,7 @@ export default function BurgerMenu({
</button>
<StatusBar
setIsSideMenuVisible={setIsVisible}
setIsDialogVisible={setIsDialogVisible}
setIsLoginVisible={setIsLoginVisible}
setIsWelcomeVisible={setIsWelcomeVisible}
/>
<details className="bm-item">
Expand Down
5 changes: 3 additions & 2 deletions src/Install.jsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import React, { useState, useEffect } from "react";
import { useTranslation } from "react-i18next";
import KaptaLogo from "./images/icons/kapta-white.png";
import { isMobileOrTablet } from "./main";
import { isIOS, isMobileOrTablet } from "./main";
import ReactGA from "react-ga4";

export default function InstallDialog() {
if (!isMobileOrTablet()) return null; // don't run install prompt on desktop
if (!isMobileOrTablet() || isIOS()) return null; // don't run install prompt on desktop

const isStandalone = window.matchMedia("(display-mode: standalone)").matches;
if (isStandalone) return null; // don't run install prompt if already installed

Expand Down
32 changes: 17 additions & 15 deletions src/login.js → src/Login.jsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { signUp, initiateAuth, respondToSMSChallenge } from "./auth.js";
import KaptaLogo from "./images/icons/kapta-white.png";
import { closeIcon, thumbsUpIcon } from "./icons.js";
import { useUserStore } from "./UserContext.js";
import { useUserStore } from "./UserContext.jsx";
import React, { useEffect, useState } from "react";

var phone_number;
Expand All @@ -10,7 +10,13 @@ var display_name;
function ButtonBox({ setIsDialogVisible }) {
return (
<div className="btn-box">
<button className="btn cancel" onClick={() => setIsDialogVisible(false)}>
<button
className="btn cancel"
onClick={() => {
console.log("closing");
setIsDialogVisible(false);
}}
>
{closeIcon}
</button>
<button className="btn confirm" form="dialog-form">
Expand Down Expand Up @@ -38,7 +44,7 @@ function LoginForm({
var formData = new FormData(e.target);
phone_number = formData.get("phone-number");
phoneNumber === phone_number &&
initiateAuth({ phone_number }).then(
initiateAuth(phone_number).then(
function (response) {
return getSMSVerificationCode(response.Session, phoneNumber);
},
Expand Down Expand Up @@ -73,9 +79,9 @@ function SignUpForm({
display_name = formData.get("display-name");
phone_number = formData.get("phone-number");
phoneNumber === phone_number &&
signUp({ phone_number, display_name })
signUp( phone_number, display_name )
.then(function (value) {
return initiateAuth({ phone_number })
return initiateAuth(phone_number)
.then(function (response) {
return getSMSVerificationCode(response.Session, phone_number);
})
Expand Down Expand Up @@ -113,7 +119,7 @@ export function WelcomeBackDialog({ isVisible, setIsVisible }) {
} catch (error) {
console.error("Error hiding the dialog:", error);
}
}, 4000);
}, 3000);

// Clean up the timer if the component is unmounted or if `isVisible` changes
return () => clearTimeout(timer);
Expand All @@ -127,20 +133,16 @@ export function WelcomeBackDialog({ isVisible, setIsVisible }) {
);
}

export function LoginDialog({
isDialogVisible,
setIsDialogVisible,
setIsWelcomeVisible,
}) {
if (!isDialogVisible) return null;

export function LoginDialog({ isVisible, setIsVisible, setIsWelcomeVisible }) {
const [isLoginFormVisible, setIsLoginFormVisible] = useState(true);
const [isSignupFormVisible, setIsSignupFormVisible] = useState(false);
const [isSmsInputVisible, setIsSmsInputVisible] = useState(false);
const [sessionToken, setSessionToken] = useState(null);
const [message, setMessage] = useState("Sign up to Kapta");
const [phoneNumber, setPhoneNumber] = useState(null);

if (!isVisible) return null;

const showSignupForm = (phone_number = null, message = null) => {
setIsLoginFormVisible(false);
setIsSignupFormVisible(true);
Expand Down Expand Up @@ -182,13 +184,13 @@ export function LoginDialog({
)}
{isSmsInputVisible && (
<SmsInput
setIsDialogVisible={setIsDialogVisible}
setIsDialogVisible={setIsVisible}
sessionToken={sessionToken}
phoneNumber={phoneNumber}
setIsWelcomeVisible={setIsWelcomeVisible}
/>
)}
<ButtonBox setIsDialogVisible={setIsDialogVisible} />
<ButtonBox setIsDialogVisible={setIsVisible} />
</dialog>
);
}
Expand Down
32 changes: 14 additions & 18 deletions src/MainMenu.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,7 @@ import ReactGA from "react-ga4";
import { ASK_URL } from "../globals.js";
import BurgerMenu from "./BurgerMenu.jsx";
import { menuIcon } from "./icons.js";
import { LoginDialog, WelcomeBackDialog } from "./login.js";
import { useUserStore } from "./UserContext.js";
import { LoginDialog, WelcomeBackDialog } from "./Login.jsx";

function LanguageSelector({ supportedLanguages }) {
// Get the saved language from localStorage or fallback to i18next language
Expand Down Expand Up @@ -204,42 +203,39 @@ function Copyright() {
return <div id="copyright">{t("copyright")}</div>;
}

export default function MainMenu({ isVisible, dataset, ...dataDisplayProps }) {
const { setMapData, showMap } = dataDisplayProps;
export default function MainMenu({
isVisible,
setIsLoginVisible,
setIsWelcomeVisible,
dataset,
...dataDisplayProps
}) {
const [isBMVisible, setIsBMVisible] = useState(false);
const [isWelcomeVisible, setIsWelcomeVisible] = useState(false);
const [isDialogVisible, setIsDialogVisible] = useState(false);

const toggleBM = () => {
setIsBMVisible((prevState) => !prevState);
};
useUserStore().checkForDetails(); // check if details and log them in

if (!isVisible) return null;

return (
<>
<LoginDialog
isDialogVisible={isDialogVisible}
setIsDialogVisible={setIsDialogVisible}
setIsWelcomeVisible={setIsWelcomeVisible}
/>
<WelcomeBackDialog
isVisible={isWelcomeVisible}
setIsVisible={setIsWelcomeVisible}
/>
<button onClick={toggleBM} className="btn--burger-menu">
{menuIcon}
</button>
<BurgerMenu
isVisible={isBMVisible}
setIsVisible={setIsBMVisible}
setIsDialogVisible={setIsDialogVisible}
setIsLoginVisible={setIsLoginVisible}
setIsWelcomeVisible={setIsWelcomeVisible}
/>
<div id="menuContainer">
<LanguageSelector supportedLanguages={supportedLanguages} />
<Instructions />
<ButtonArea showMap={showMap} hasCurrentDataset={dataset} />
<ButtonArea
showMap={dataDisplayProps.showMap}
hasCurrentDataset={dataset}
/>
{/* File picker (web only) */}
{(!isMobileOrTablet() || isIOS()) && (
<FilePicker {...dataDisplayProps} />
Expand Down
18 changes: 11 additions & 7 deletions src/StatusBar.jsx
Original file line number Diff line number Diff line change
@@ -1,26 +1,30 @@
import React from "react";
import { hasCognito } from "../globals.js";
import { useUserStore } from "./UserContext.js";
import { useUserStore } from "./UserContext.jsx";

export default function StatusBar({
setIsSideMenuVisible,
setIsDialogVisible,
setIsLoginVisible,
setIsWelcomeVisible,
}) {
if (!hasCognito) return null; // don't render anything if we don't have cognito
const user = useUserStore();
const onLogin = () => {
const onLogin = async () => {
// check if user details are already in localStorage
const hasDetails = user.checkForDetails();

var hasDetails;
const checkDetails = async () => {
hasDetails = await user.checkForDetails();
return hasDetails;
};
checkDetails();
if (!hasDetails) {
setIsDialogVisible(true);
setIsLoginVisible(true);
} else {
setIsWelcomeVisible(true);
} // show welcome back
setIsSideMenuVisible(false);
};
const onLogout = () => (user.loggedIn = false);
const onLogout = () => (user.logout(), setIsSideMenuVisible(false));
return (
<div id="status-bar">
{user.loggedIn ? (
Expand Down
15 changes: 15 additions & 0 deletions src/SuccessModal.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import React from "react";
import { closeIcon } from "./icons";

export default function SuccessModal({ isVisible, setIsVisible }) {
if (!isVisible) return null;
return (
<dialog open={isVisible} id="success-dialog">
<button className="btn cancel" onClick={() => setIsVisible(false)}>
{closeIcon}
</button>
<h3>Upload Successful</h3>
<p>Thank you for your contribution!</p>
</dialog>
);
}
Loading