generated from chingu-voyages/voyage-template
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into admin_dashboard
- Loading branch information
Showing
11 changed files
with
345 additions
and
28 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| "use client"; | ||
|
|
||
| import { Box, Paper, Stack, Typography } from "@mui/material/"; | ||
| import SignInCard from "@/components/signInCard"; | ||
| import AutoFixHighRoundedIcon from "@mui/icons-material/AutoFixHighRounded"; | ||
| import ConstructionRoundedIcon from "@mui/icons-material/ConstructionRounded"; | ||
| import ThumbUpAltRoundedIcon from "@mui/icons-material/ThumbUpAltRounded"; | ||
|
|
||
| //left side page content | ||
| const items = [ | ||
| { | ||
| icon: <ConstructionRoundedIcon sx={{ color: "#1565c0" }} />, | ||
| title: "Premium Quality Craftsmanship", | ||
| description: "Experience unmatched durability and a long lasting product.", | ||
| }, | ||
| { | ||
| icon: <ThumbUpAltRoundedIcon sx={{ color: "#1565c0" }} />, | ||
| title: "Save Energy and Money", | ||
| description: | ||
| "Lower your carbon footprint and electric bill by harnessing the power of the sun!", | ||
| }, | ||
| { | ||
| icon: <AutoFixHighRoundedIcon sx={{ color: "#1565c0" }} />, | ||
| title: "Have Independence", | ||
| description: "Keep the lights on even when the grid goes dark.", | ||
| }, | ||
| ]; | ||
|
|
||
| export default function LandingView() { | ||
| return ( | ||
| <div> | ||
| <Stack | ||
| direction="column" | ||
| component="main" | ||
| sx={[ | ||
| { | ||
| height: "calc((1 - var(--template-frame-height, 0)) * 100%)", | ||
| marginTop: "max(40px - var(--template-frame-height, 0px), 0px)", | ||
| minHeight: "100%", | ||
| }, | ||
| ]} | ||
| > | ||
| <Stack | ||
| direction={{ xs: "column-reverse", md: "row" }} | ||
| sx={{ | ||
| justifyContent: "center", | ||
| gap: { xs: 6, sm: 12 }, | ||
| p: { xs: 2, sm: 5 }, | ||
| }} | ||
| > | ||
| <Stack | ||
| sx={{ | ||
| flexDirection: "column", | ||
| alignSelf: "center", | ||
| gap: 4, | ||
| }} | ||
| > | ||
| <Typography variant="h1"> | ||
| <Typography variant="h1" component="span" color={theme => theme.palette.branding} >Ray</Typography>Volution | ||
| </Typography> | ||
| {items.map((item, index) => ( | ||
| <Stack key={index} direction="row" sx={{ gap: 1 }}> | ||
| {item.icon} | ||
| <div> | ||
| <Typography gutterBottom sx={{ fontWeight: "medium" }}> | ||
| {item.title} | ||
| </Typography> | ||
| <Typography variant="body2" sx={{ color: "text.secondary" }}> | ||
| {item.description} | ||
| </Typography> | ||
| </div> | ||
| </Stack> | ||
| ))} | ||
| </Stack> | ||
| <SignInCard /> | ||
| </Stack> | ||
| </Stack> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,115 @@ | ||
| "use client"; | ||
|
|
||
| import { useState, useEffect } from "react"; | ||
| import { | ||
| FormControl, | ||
| FormHelperText, | ||
| InputLabel, | ||
| Input, | ||
| Container, | ||
| TextField, | ||
| MenuItem, | ||
| Stack, | ||
| Button, | ||
| Alert, | ||
| } from "@mui/material"; | ||
| import CheckIcon from "@mui/icons-material/Check"; | ||
|
|
||
| export default function AddressInput() { | ||
| const [addresses, setAddresses] = useState([]); | ||
| const [providedAddress, setProvidedAddress] = useState({ | ||
| hse_nbr: "", | ||
| hse_dir: "", | ||
| str_nm: "", | ||
| str_sfx: "", | ||
| zip_cd: "", | ||
| }); | ||
| const [isAddressFound, setIsAddressFound] = useState(false); | ||
|
|
||
| const handleChange = (e) => { | ||
| setProvidedAddress({ | ||
| ...providedAddress, | ||
| [e.target.name]: e.target.value, | ||
| }); | ||
| }; | ||
|
|
||
| async function fetchAddresses() { | ||
| try { | ||
| const response = await fetch( | ||
| `https://data.lacity.org/resource/4ca8-mxuh.json?hse_nbr=${providedAddress.hse_nbr}&hse_dir_cd=${providedAddress.hse_dir}&str_nm=${providedAddress.str_nm}&str_sfx_cd=${providedAddress.str_sfx}&zip_cd=${providedAddress.zip_cd}` | ||
| ); | ||
| const data = await response.json(); | ||
| setAddresses(data); | ||
| setIsAddressFound(true); | ||
| } catch (error) { | ||
| console.error("Error fetching addresses:", error); | ||
| } | ||
| } | ||
|
|
||
| return ( | ||
| <FormControl> | ||
| <Container> | ||
| <Stack direction="row" spacing={2} padding={0}> | ||
| <TextField | ||
| id="hse_nbr" | ||
| name="hse_nbr" | ||
| label="House Number" | ||
| variant="outlined" | ||
| value={providedAddress.hse_nbr} | ||
| onChange={handleChange} | ||
| /> | ||
| <TextField | ||
| id="hse_dir" | ||
| name="hse_dir" | ||
| select | ||
| label="Direction" | ||
| defaultValue="" | ||
| value={providedAddress.hse_dir} | ||
| helperText="if applicable" | ||
| onChange={handleChange} | ||
| > | ||
| <MenuItem value=""></MenuItem> | ||
| <MenuItem value="N">North</MenuItem> | ||
| <MenuItem value="E">East</MenuItem> | ||
| <MenuItem value="W">West</MenuItem> | ||
| <MenuItem value="S">South</MenuItem> | ||
| </TextField> | ||
| <TextField | ||
| id="str_nm" | ||
| name="str_nm" | ||
| label="Street Name" | ||
| variant="outlined" | ||
| value={providedAddress.str_nm} | ||
| onChange={handleChange} | ||
| /> | ||
| <TextField | ||
| id="str_sfx" | ||
| name="str_sfx" | ||
| label="Suffix" | ||
| variant="outlined" | ||
| value={providedAddress.str_sfx} | ||
| onChange={handleChange} | ||
| /> | ||
| <TextField | ||
| id="zip_cd" | ||
| label="Zip Code" | ||
| name="zip_cd" | ||
| variant="outlined" | ||
| value={providedAddress.zip_cd} | ||
| onChange={handleChange} | ||
| /> | ||
| </Stack> | ||
| <Button variant="contained" onClick={fetchAddresses}> | ||
| Validate | ||
| </Button> | ||
| {isAddressFound ? ( | ||
| <Alert icon={<CheckIcon fontSize="inherit" />} severity="success"> | ||
| Address verified | ||
| </Alert> | ||
| ) : ( | ||
| <Alert severity="error">Address not found.</Alert> | ||
| )} | ||
| </Container> | ||
| </FormControl> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| "use client"; | ||
|
|
||
| import { | ||
| Box, | ||
| Button, | ||
| Card, | ||
| CardContent, | ||
| CardActions, | ||
| CardMedia, | ||
| Divider, | ||
| FormControl, | ||
| FormLabel, | ||
| Link, | ||
| TextField, | ||
| Typography, | ||
| } from "@mui/material/"; | ||
| import GoogleIcon from "@mui/icons-material/Google"; | ||
|
|
||
| export default function SignInCard() { | ||
| async function handleSubmit(e) { | ||
| //!TODO: eventual code to authenticate login | ||
| } | ||
|
|
||
| return ( | ||
| <Card variant="outlined" sx={{ minWidth: 375, p: 2 }}> | ||
| <CardMedia | ||
| sx={{ height: 300 }} | ||
| image="/solar_panels.jpg" | ||
| title="solar_panels" | ||
| /> | ||
| <CardContent> | ||
| <Typography | ||
| component="h1" | ||
| sx={{ | ||
| width: "100%", | ||
| fontSize: "2rem", | ||
| textAlign: "center", | ||
| color: theme => theme.palette.branding, | ||
| }} | ||
| > | ||
| Sign In | ||
| </Typography> | ||
| </CardContent> | ||
| <CardActions> | ||
| <Button | ||
| fullWidth | ||
| variant="outlined" | ||
| color="gray" | ||
| startIcon={<GoogleIcon sx={{ color: theme => theme.palette.branding }} />} | ||
| //!TODO: Google Auth flow triggers here | ||
| // onClick={() => alert('Sign in with Google')} | ||
| > | ||
| Sign in with Google | ||
| </Button> | ||
| </CardActions> | ||
| </Card> | ||
| ); | ||
| } |
Oops, something went wrong.