Skip to content

Commit

Permalink
Merge pull request #3 from sim31/links
Browse files Browse the repository at this point in the history 
Sync input values with query string
  • Loading branch information
@n0umen0n
n0umen0n committed Jan 6, 2023
2 parents 1ee6374 + 7081f19 commit 0009573
Show file tree
Hide file tree
Showing 3 changed files with 78 additions and 26 deletions.
2 changes: 2 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,15 @@
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"copy-to-clipboard": "^3.3.3",
"firebase": "^9.8.3",
"react": "^18.2.0",
"react-bootstrap": "^2.4.0",
"react-dom": "^18.2.0",
"react-modal-bootstrap": "^1.1.1",
"react-router-dom": "6",
"react-scripts": "5.0.1",
"react-use-search-params-state": "^1.0.1",
"sweetalert2": "^11.4.18",
"ual-anchor": "^1.2.0",
"ual-reactjs-renderer": "^0.3.1",
Expand Down
85 changes: 59 additions & 26 deletions src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@ import Toolbar from "@mui/material/Toolbar";
import Modal from "@mui/material/Modal";
import Box from "@mui/material/Box";
import Typography from "@mui/material/Typography";
// TODO: remove if you use react hooks?
import copy from "copy-to-clipboard";
import { useSearchParamsState } from 'react-use-search-params-state'

const style = {
position: "absolute",
Expand All @@ -24,15 +27,20 @@ const style = {
p: 4,
};

const inputDefaults = {
delegate: { type: 'string', default: "" },
groupnumber: { type: 'number', default: null },
vote1: { type: 'string', default: "" },
vote2: { type: 'string', default: "" },
vote3: { type: 'string', default: "" },
vote4: { type: 'string', default: "" },
vote5: { type: 'string', default: "" },
vote6: { type: 'string', default: "" },
}

function App(props) {
const [delegate, setDelegate] = useState("");
const [groupnumber, setGroupnumber] = useState("");
const [vote1, setVote1] = useState("");
const [vote2, setVote2] = useState("");
const [vote3, setVote3] = useState("");
const [vote4, setVote4] = useState("");
const [vote5, setVote5] = useState("");
const [vote6, setVote6] = useState("");

const [inputs, setInputs] = useSearchParamsState(inputDefaults);
const [accountname, setAccountName] = useState("");
const [open, setOpen] = React.useState(false);
const handleOpen = () => setOpen(true);
Expand Down Expand Up @@ -72,8 +80,8 @@ function App(props) {
const vote = async () => {
if (activeUser) {
// could be more elegant than if (vote6 == "")
if (vote6 == "") {
let voterlist = [vote5, vote4, vote3, vote2, vote1];
if (inputs.vote6 == "") {
let voterlist = [inputs.vote5, inputs.vote4, inputs.vote3, inputs.vote2, inputs.vote1];
try {
const transaction = {
actions: [
Expand All @@ -88,7 +96,7 @@ function App(props) {
],
data: {
submitter: displayaccountname(),
groupnr: parseInt(groupnumber),
groupnr: parseInt(inputs.groupnumber),
rankings: voterlist,
},
},
Expand All @@ -103,8 +111,8 @@ function App(props) {
],
data: {
elector: displayaccountname(),
delegate: delegate,
groupnr: parseInt(groupnumber),
delegate: inputs.delegate,
groupnr: parseInt(inputs.groupnumber),
},
},
],
Expand All @@ -118,7 +126,7 @@ function App(props) {
swal_error(e);
}
} else {
let voterlist = [vote6, vote5, vote4, vote3, vote2, vote1];
let voterlist = [inputs.vote6, inputs.vote5, inputs.vote4, inputs.vote3, inputs.vote2, inputs.vote1];
console.log(voterlist);
try {
const transaction = {
Expand All @@ -134,7 +142,7 @@ function App(props) {
],
data: {
submitter: displayaccountname(),
groupnr: parseInt(groupnumber),
groupnr: parseInt(inputs.groupnumber),
rankings: voterlist,
},
},
Expand All @@ -149,8 +157,8 @@ function App(props) {
],
data: {
elector: displayaccountname(),
delegate: delegate,
groupnr: parseInt(groupnumber),
delegate: inputs.delegate,
groupnr: parseInt(inputs.groupnumber),
},
},
],
Expand All @@ -167,6 +175,16 @@ function App(props) {
}
}
};
const shareLink = () => {
const url = window.location.href;
console.log('Url: ', url);

if (copy(url, { debug: true })) {
swal_success("Link copied to clipboard!");
} else {
swal_error("Were not able to copy to cliboard.");
}
}
const swal_success = (message) => {
const Toast = Swal.mixin({
toast: true,
Expand Down Expand Up @@ -316,61 +334,76 @@ function App(props) {
<header className="App-header">
<Paper elevation={3} sx={{ padding: "20px", width: "400px" }}>
<TextField
onChange={(e) => setDelegate(e.target.value)}
onChange={(e) => setInputs({ delegate: e.target.value })}
defaultValue={inputs.delegate ?? ""}
label="Delegate"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setGroupnumber(e.target.value)}
onChange={(e) => setInputs({ groupnumber: e.target.value })}
defaultValue={inputs.groupnumber ?? ""}
label="Group number"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>

<TextField
onChange={(e) => setVote1(e.target.value)}
onChange={(e) => setInputs({ vote1: e.target.value })}
defaultValue={inputs.vote1 ?? ""}
label="Level 6"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setVote2(e.target.value)}
onChange={(e) => setInputs({ vote2: e.target.value })}
defaultValue={inputs.vote2 ?? ""}
label="Level 5"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setVote3(e.target.value)}
onChange={(e) => setInputs({ vote3: e.target.value })}
defaultValue={inputs.vote3 ?? ""}
label="Level 4"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setVote4(e.target.value)}
onChange={(e) => setInputs({ vote4: e.target.value })}
defaultValue={inputs.vote4 ?? ""}
label="Level 3"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setVote5(e.target.value)}
onChange={(e) => setInputs({ vote5: e.target.value })}
defaultValue={inputs.vote5 ?? ""}
label="Level 2"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<TextField
onChange={(e) => setVote6(e.target.value)}
onChange={(e) => setInputs({ vote6: e.target.value })}
defaultValue={inputs.vote6 ?? ""}
label="Level 1"
variant="outlined"
sx={{ width: "100%", "margin-bottom": "10px" }}
/>
<Button
variant="contained"
sx={{ width: "100%" }}
sx={{ width: "100%", "margin-bottom": "10px" }}
onClick={() => vote()}
>
Submit
</Button>
<Button
variant="contained"
sx={{ width: "100%" }}
onClick={() => shareLink()}
>
Share
</Button>
</Paper>
</header>
</div>
Expand Down
17 changes: 17 additions & 0 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3992,6 +3992,13 @@ cookie@0.5.0:
resolved "https://registry.npmjs.org/cookie/-/cookie-0.5.0.tgz"
integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==

copy-to-clipboard@^3.3.3:
version "3.3.3"
resolved "https://registry.yarnpkg.com/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz#55ac43a1db8ae639a4bd99511c148cdd1b83a1b0"
integrity sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==
dependencies:
toggle-selection "^1.0.6"

core-js-compat@^3.21.0, core-js-compat@^3.22.1:
version "3.23.1"
resolved "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.23.1.tgz"
Expand Down Expand Up @@ -8630,6 +8637,11 @@ react-transition-group@^4.4.2:
loose-envify "^1.4.0"
prop-types "^15.6.2"

react-use-search-params-state@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/react-use-search-params-state/-/react-use-search-params-state-1.0.1.tgz#0b74fac8b4e7845ca8562bc279400c5b50f62f94"
integrity sha512-JqfBqMtyOMYzeapsVmd8fy75HJjN40ma9F0bSoCQqXwDe3yas4UBJWOQh2qf9q1/HO822BRkftnmZee/PfJzsw==

react@16.13.0:
version "16.13.0"
resolved "https://registry.npmjs.org/react/-/react-16.13.0.tgz"
Expand Down Expand Up @@ -9674,6 +9686,11 @@ to-regex-range@^5.0.1:
dependencies:
is-number "^7.0.0"

toggle-selection@^1.0.6:
version "1.0.6"
resolved "https://registry.yarnpkg.com/toggle-selection/-/toggle-selection-1.0.6.tgz#6e45b1263f2017fa0acc7d89d78b15b8bf77da32"
integrity sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==

toidentifier@1.0.1:
version "1.0.1"
resolved "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz"
Expand Down

0 comments on commit 0009573

Please sign in to comment.