rum-goggles/frontend/src/screens/SignIn.jsx

43 lines
1.5 KiB
JavaScript

import { useEffect, useState } from 'react';
import { Navigate, useNavigate } from 'react-router-dom';
import { NavDashboard } from './Navigation';
import './SignIn.css';
function SignIn() {
const navigate = useNavigate();
const [streamKey, setStreamKey] = useState('');
const updateStreamKey = (event) => setStreamKey(event.target.value);
const saveStreamKey = () => {
navigate(NavDashboard, { state: { streamKey: streamKey } });
};
return (
<div id='SignIn'>
<div className='signin-title'>
<span className='signin-title-text'>Rum Goggles</span>
<span className='signin-title-subtext'>Rumble Stream Dashboard</span>
</div>
<div className='signin-input-box'>
<label className='signin-label'>Stream Key:</label>
<div className='signin-input-button'>
<input
id='StreamKey'
className='signin-input'
onChange={updateStreamKey}
placeholder='Stream Key'
type='text'
value={streamKey}
/>
<button className='signin-button' onClick={saveStreamKey}>
Save
</button>
</div>
</div>
<div className='signin-title'></div>
</div>
);
}
export default SignIn;