Skip to content

Commit

Permalink
Merge pull request supabase#234 from dymium-io/supabase#230
Browse files Browse the repository at this point in the history 
supabase#230
  • Loading branch information
@gazillion101
gazillion101 authored Apr 8, 2023
2 parents 7169b82 + 21ff05e commit 819e2b7
Show file tree
Hide file tree
Showing 6 changed files with 101 additions and 95 deletions.
85 changes: 43 additions & 42 deletions web/js/packages/admin/src/Auth.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,58 +1,59 @@
import React, { useState, useEffect, useRef } from 'react';
import Modal from 'react-bootstrap/Modal'
import Button from 'react-bootstrap/Button'
import {useInitialize} from './Utils/CustomHooks'
import { useInitialize } from './Utils/CustomHooks'
const sessionTimeoutMin = 20



export default function Auth() {
let active = useRef(false)
let [show, setShow] = useState(false)
let lastSessionUpdate = useRef( Date.now()/1000 )
let lastSessionUpdate = useRef(Date.now() / 1000)
let showtimer = useRef(0)
let timeoutId = useRef(0)
let timeoutId = useRef(0)

let redirectPublicWebsite = () => {
return "/app/logout"
}
let revalidate = () => {
if(!active.current)
return

let token = window.sessionStorage.getItem("Session");
lastSessionUpdate.current = Date.now()/1000
lastSessionUpdate.current = Date.now() / 1000
if (token === null) {
console.log("not authenticated");
window.location.href = redirectPublicWebsite();
return;
}
if (!active.current)
return
fetch(window.location.origin + "/auth/refresh", {
cache: 'no-cache',
method: 'POST',
body: "",
body: "",
headers: {
Authorization: "Bearer " + token,
Cache: "no-cache"
Cache: "no-cache"
},
}).then(response => {
let d = new Date()

if (!response.ok) {
console.log("Auth fetch error, at: " + d.toLocaleString())
sessionStorage.removeItem("Session")
setShow( true )
setShow(true)
} else {
response.json().then(js => {
if (js.status !== "OK") {
console.log("Status not OK, " + JSON.stringify(js) + ", at: " + d.toLocaleString())
sessionStorage.removeItem("Session")
console.log("Pop the message")
showtimer.current = window.setTimeout(t => {
showtimer.current = window.setTimeout(t => {
console.log("Don't wait until popup shows, close the view")
window.location.href = redirectPublicWebsite()
}, 30000)
if(window.location.pathname !== '/')
setShow(true )
if (window.location.pathname !== '/')
setShow(true)
} else {
sessionStorage.setItem("Session", js.token)
}
Expand All @@ -65,74 +66,74 @@ export default function Auth() {
}
let onTimeout = () => {
let d = new Date()
console.log("in onTimeout, revalidate possible expiration, %s", d.toLocaleString() )
console.log("Elapsed: " + (Date.now()/1000 - lastSessionUpdate.current))
console.log("in onTimeout, revalidate possible expiration, %s", d.toLocaleString())
console.log("Elapsed: " + (Date.now() / 1000 - lastSessionUpdate.current))
revalidate();
}

let onActivity = (e) => {
//console.log("in onActivity")
let now = Date.now()/1000
let now = Date.now() / 1000
if (now - lastSessionUpdate.current >= 30) {
lastSessionUpdate.current =now

lastSessionUpdate.current = now

revalidate();
}

clearTimeout(timeoutId.current)
timeoutId.current = window.setTimeout(onTimeout, 1000*(sessionTimeoutMin*60 + 5))
timeoutId.current = window.setTimeout(onTimeout, 1000 * (sessionTimeoutMin * 60 + 5))

}
let onReauthenticate = (e) =>{
let onReauthenticate = (e) => {
console.log("Reauthentication requested on failed fetch!")
revalidate()
}
useInitialize( () => {
}
useInitialize(() => {
lastSessionUpdate.current = 0
showtimer.current = 0
window.addEventListener("mousemove", onActivity, {passive: true} )
window.addEventListener("keydown", onActivity, {passive: true} )
window.addEventListener("wheel", onActivity, {passive: true} )
window.addEventListener("DOMMouseScroll", onActivity, {passive: true} )
window.addEventListener("mouseWheel", onActivity, {passive: true} )
window.addEventListener("mousedown", onActivity, {passive: true} )
window.addEventListener("touchstart", onActivity, {passive: true} )
window.addEventListener("touchmove", onActivity, {passive: true} )
window.addEventListener("MSPointerDown", onActivity, {passive: true} )
window.addEventListener("MSPointerMove", onActivity, {passive: true} )
window.addEventListener("visibilitychange", onActivity, {passive: true} )
window.addEventListener("mousemove", onActivity, { passive: true })
window.addEventListener("keydown", onActivity, { passive: true })
window.addEventListener("wheel", onActivity, { passive: true })
window.addEventListener("DOMMouseScroll", onActivity, { passive: true })
window.addEventListener("mouseWheel", onActivity, { passive: true })
window.addEventListener("mousedown", onActivity, { passive: true })
window.addEventListener("touchstart", onActivity, { passive: true })
window.addEventListener("touchmove", onActivity, { passive: true })
window.addEventListener("MSPointerDown", onActivity, { passive: true })
window.addEventListener("MSPointerMove", onActivity, { passive: true })
window.addEventListener("visibilitychange", onActivity, { passive: true })

window.document.addEventListener('reauthenticate', onReauthenticate);
})

useEffect(() => {
if(timeoutId.current)

if (timeoutId.current)
clearTimeout(timeoutId.current)
timeoutId.current = window.setTimeout(onTimeout, 1000*(sessionTimeoutMin*60 + 5))
timeoutId.current = window.setTimeout(onTimeout, 1000 * (sessionTimeoutMin * 60 + 5))
revalidate();
active.current = true
handleShow()
return () => {
active.current = false
if(timeoutId.current)
if (timeoutId.current)
clearTimeout(timeoutId.current)
timeoutId.current = 0
timeoutId.current = 0
}

}, [])

let onShow = () => {
if(showtimer.current)
if (showtimer.current)
clearTimeout(showtimer.current)
showtimer.current = 0
window.setTimeout(t => {
window.setTimeout(t => {
console.log("kill the popup from popup")
window.location.href = redirectPublicWebsite()
}, 5000)
}
let handleClose = () => { setShow(true ); window.location.href = redirectPublicWebsite(); }
let handleClose = () => { setShow(true); window.location.href = redirectPublicWebsite(); }
let handleShow = () => { setShow(false); }
return (
<div className="mx-0 px-0">
Expand Down
2 changes: 1 addition & 1 deletion web/js/packages/portal/src/App/DatascopeForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -358,7 +358,7 @@ const DatascopeForm: React.FC<DatascopeFormProps> = (props) => {
<Form.Label>Database Name</Form.Label>
<Form.Control size="sm" type="text" placeholder="alphanumeric_"
required
pattern="[\w_]+"
pattern="[a-z][a-z0-9_]*"
value={props.dbname}
onChange={e => {

Expand Down
11 changes: 6 additions & 5 deletions web/js/packages/portal/src/App/EditDatascopes.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -395,19 +395,20 @@ export default function EditDatascopes() {
if (js.status === "OK") {
setAlert(
<Alert variant="success" onClose={() => setAlert(<></>)} dismissible>
Ghost Database {dbname} updated successfully!
Ghost Database {dbname} deleted successfully!
</Alert>
)
capi.getConnections(setSpinner, setConns, setAlert, remap, () => {

com.getDatascopes(setSpinner, setAlert, setDatascopes, () => {
setSelectedDatascope(t)
if(slatedToDelete !== t)
setSelectedDatascope(t)
})
})
} else {
setAlert(
<Alert variant="danger" onClose={() => setAlert(<></>)} dismissible>
Error updating {dbname}: {js.errormessage}
Error deleting {dbname}: {js.errormessage}
</Alert>
)
}
Expand All @@ -420,7 +421,7 @@ export default function EditDatascopes() {
resp != null && resp.text().then(t =>
setAlert(
<Alert variant="danger" onClose={() => setAlert(<></>)} dismissible>
Error updating {dbname}: {t}
Error deleting {dbname}: {t}
</Alert>
)
)
Expand Down Expand Up @@ -541,7 +542,7 @@ export default function EditDatascopes() {
</ToolkitProvider>
</Col>
</Row>
{(selectedDatascope !== "" && selectedDatascope !== "xxx") &&
{(selectedDatascope !== "") &&
<div className=" text-left p-4 mt-4" style={{ backgroundColor: "rgba(255, 255, 255, 0.7)" }}>
<h5>{selectedDatascopeDetails?.name}</h5>
<Form onSubmit={handleSubmit} ref={form} noValidate validated={validated}>
Expand Down
73 changes: 38 additions & 35 deletions web/js/packages/portal/src/App/Menu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,8 @@ import * as hex from '../Utils/Hex'
function Menu() {

let [avatar, setAvatar] = useState('/avatar.png') // eslint-disable-line no-unused-vars
let [show, setShow] = useState(false)
let [show, setShow] = useState(false)

let p = hex.HexStringToByteArray(com.getTokenProperty("picture"))
let picture = hex.StringFromUTF8Array(p)
let onAva = e => {
setShow(true)
}
Expand All @@ -24,16 +22,21 @@ function Menu() {
}
let getGroups = () => {
let gr = com.getTokenProperty("groups")
if(gr === null || gr === undefined)
if (gr === null || gr === undefined)
return ""
return gr.join(", ")
}
if(undefined !== picture && avatar != picture) {
let pic = com.getTokenProperty("picture")

let p = pic && hex.HexStringToByteArray(pic)
let picture = p && hex.StringFromUTF8Array(p)

if (undefined !== picture && avatar != picture) {
setAvatar(picture)
}
return (
<div id="home" className="w-100 text-center deepestblue">
<Modal show={show} onHide={handleClose} centered >
return (
<div id="home" className="w-100 text-center deepestblue">
<Modal show={show} onHide={handleClose} centered >
<Modal.Header closeButton>
<Modal.Title>Current user:</Modal.Title>
</Modal.Header>
Expand All @@ -50,37 +53,37 @@ function Menu() {
<Modal.Footer>
<Button variant="secondary" onClick={handleClose}>Close</Button>
</Modal.Footer>
</Modal>
<Navbar id="navb"
className="p-0 m-0 navbar-expand-sm"
collapseOnSelect expand="lg" variant="light">
<Navbar.Brand className="text-left p-0 m-0 mr-2" >
</Modal>
<Navbar id="navb"
className="p-0 m-0 navbar-expand-sm"
collapseOnSelect expand="lg" variant="light">
<Navbar.Brand className="text-left p-0 m-0 mr-2" >

<Nav.Link className="p-1 m-0" style={{ width: '48px' }} href="/">
<img src="/logo.svg" style={{ width: '100%' }} alt="logo" />
</Nav.Link >
</Navbar.Brand>
<Navbar.Brand className="text-left p-0 m-0 mr-2" >
<Nav.Link className="p-0 m-0 ml-1" style={{ width: '140px' }} href="/">
<img src="/brand.svg" style={{ width: '100%' }} alt="logo" />
</Nav.Link >
</Navbar.Brand>

<Nav.Link className="p-1 m-0" style={{width: '48px'}} href="/">
<img src="/logo.svg" style={{width: '100%'}} alt="logo" />
</Nav.Link >
</Navbar.Brand>
<Navbar.Brand className="text-left p-0 m-0 mr-2" >
<Nav.Link className="p-0 m-0 ml-1" style={{width: '140px'}} href="/">
<img src="/brand.svg" style={{width: '100%'}} alt="logo" />
</Nav.Link >
</Navbar.Brand>
<Navbar.Toggle aria-controls="responsive-navbar-nav" />

<Navbar.Toggle aria-controls="responsive-navbar-nav" />
<Navbar.Collapse id="responsive-navbar-nav">
<Nav className="mx-auto " >

<Navbar.Collapse id="responsive-navbar-nav">
<Nav className="mx-auto " >

</Nav>
<img alt="avatar" onClick={onAva} style={{cursor: 'pointer'}}className="avatar mr-2" src={avatar} />
<Nav className="pr-3">
<Nav.Link id="logout" href="/api/logout">Logout</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>
</Nav>
<img alt="avatar" onClick={onAva} style={{ cursor: 'pointer' }} className="avatar mr-2" src={avatar} />
<Nav className="pr-3">
<Nav.Link id="logout" href="/api/logout">Logout</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>

</div>
)
</div>
)
};

export default Menu
5 changes: 3 additions & 2 deletions web/js/packages/portal/src/Auth.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,15 +17,16 @@ export default function Auth() {
return "/app/logout"
}
let revalidate = () => {
if(!active.current)
return

let token = window.sessionStorage.getItem("Session");
lastSessionUpdate.current = Date.now()/1000
if (token === null) {
console.log("not authenticated");
window.location.href = redirectPublicWebsite();
return;
}
if(!active.current)
return
fetch(window.location.origin + "/auth/refresh", {
cache: 'no-cache',
method: 'POST',
Expand Down
Loading

0 comments on commit 819e2b7

Please sign in to comment.