Skip to content

Latest commit

 

History

History
60 lines (44 loc) · 2.12 KB

README.md

File metadata and controls

60 lines (44 loc) · 2.12 KB

React Gate Duo

This project was very little based on react-gate . Aims to be simple.

Install

npm install --save react-gate-duo

Examples

import SimpleGate from "react-gate-duo";
// ...other imports here

// React Router Dom (with local credentials)
<Route path="/protected-route" render={props => (
	<SimpleGate localCredentials={{ username: "admin", password: "password" }}>
		<Component {...props} />	
	</SimpleGate>
)}>

// React Router Dom (with an authorization pass)
const isUserLoggedIn = () => {
	if(userSession && userLoggedInTime){
		return true;
	}

	return false;
}

<Route path="/protected-route" render={props => (
	<SimpleGate authorized={isUserLoggedIn()}>
		<Component {...props} />	
	</SimpleGate>
)}>

When using localCredentials prop, when logging in, SimpleGate sets a sessionId and sessionTime. The sessionId is generated randomly. The sessionTime is for a check to see if the visiting user has been to the site within the past 2 days. if not, the visiting user is redirected to a login form. Super simple and not styled. If so, the user is immediately passed to the child.

Prop Name Type Required? Default
localCredentials { username: string, password: string } If authorized prop not being used none
authorized Function that returns a boolean If localCredentials prop not being used none

Styling

Each classname is in the gateClasses prop object. There is absolutely NO styling implemented by default so everything is up to you.

Gate Class Prop Type Default
inputClassName String ""
formClassName String ""
firstInputClassName String ""
secondInputClassName String ""
submitButtonContainerClassName String ""
submitButtonClassName String ""