Skip to content
This repository has been archived by the owner on Dec 13, 2024. It is now read-only.

Link device sam #109

Merged
merged 3 commits into from
Jun 10, 2024
Merged

Link device sam #109

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
729d373
Added device name field in the device registration
samuelcosta02 Jun 10, 2024
8cadca4
Added devide name field in device registration
samuelcosta02 Jun 10, 2024
e04dca2
Merge branch 'main' into LinkDevice---Sam
samuelcosta02 Jun 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 24 additions & 9 deletions frontend/src/Components/LinkDevice.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,24 @@ import 'reactjs-popup/dist/index.css';

function LinkDevice() {
const [open, setOpen] = useState(false);
const [deviceId, setDeviceId] = useState("");
const [deviceKey, setDeviceKey] = useState("");
const [deviceName, setDeviceName] = useState("");

const handleInputChange = (e: { target: { value: SetStateAction<string>; }; }) => {
setDeviceId(e.target.value);
const handleInputChangeKey = (e: { target: { value: SetStateAction<string>; }; }) => {
setDeviceKey(e.target.value);
};

const handleInputChangeDName = (e: {target: { value: SetStateAction<string>; }; }) => {
setDeviceName(e.target.value);
}

const handleSubmit = (e: { preventDefault: () => void; }) => {
e.preventDefault(); // Prevent form from reloading the page
if (deviceId.trim() === "") {
if (deviceKey.trim() === "") {
return;
}
// TODO: Save the device ID or perform any action with the input value
console.log("Device ID:", deviceId);
console.log("Device ID:", deviceKey," Device Name:", deviceName);
setOpen(false); // Close the popup after submission
};

Expand All @@ -42,16 +47,26 @@ function LinkDevice() {
<form className="row g-0 needs-validation" onSubmit={handleSubmit}>
<figure className='text-center'>
<p className='lead'>
<strong>Enter your device ID below:</strong>
<strong>Enter your device Key Registration and Name below:</strong>
</p>
</figure>
<div className="input-group col mb-1">

<div className="input-group mb-1">
<span className="input-group-text">#</span>
<label htmlFor="inputLink" className="visually-hidden">Device ID</label>
<label htmlFor="inputLink" className="visually-hidden">Device Key Registration</label>
<input type="text" className="form-control" id="inputDeviceId"
placeholder="Device ID" required value={deviceId} onChange={handleInputChange}/>
placeholder="Device Key Registration" required value={deviceKey} onChange={handleInputChangeKey}/>
<div className='invalid-feedback'>ok</div>
</div>

<div className="input-group mb-1 py-2">
<span className="input-group-text">@</span>
<label htmlFor="inputLink" className="visually-hidden">Device Name</label>
<input type="text" className="form-control" id="inputDeviceName"
placeholder="Device Name" required value={deviceName} onChange={handleInputChangeDName}/>
<div className='invalid-feedback'>ok</div>
</div>

<button type='submit' className='btn btn-success mt-2 mb-2'>
Link device
</button>
Expand Down
94 changes: 46 additions & 48 deletions frontend/src/Components/Navbar/Navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,57 +21,55 @@ const Navbar = () =>{
setActivePage(page);
};


return (
<div>
<nav className="navbar navbar-expand-lg navbar-dark bg-success">
<img src={"./android-chrome-192x192.png"} alt="Logo" style={{ width: '30px', height: '30px', marginLeft: '5px' }} />
<a className="navbar-brand" href="#"> TEAMAGOCHI</a>
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>

<div>
<nav className="navbar navbar-expand-lg navbar-dark bg-success">
<img src={"./android-chrome-192x192.png"} alt="Logo" style={{ width: '30px', height: '30px', marginLeft: '5px' }} />
<a className="navbar-brand" href="#"> TEAMAGOCHI</a>
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>

<div className="collapse navbar-collapse flex-row-reverse" id="navbarSupportedContent" style={navbarItemStyles}>
<ul className="navbar-nav ">
<li className={`nav-item ${activePage === 'Pet Page' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Pet Page')}>Pet Page</a>
</li>
<li className={`nav-item ${activePage === 'Inventory' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Inventory')}>Inventory</a>
</li>
<li className={`nav-item ${activePage === 'Friends' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Friends')}>Friends</a>
</li>
<li className={`nav-item ${activePage === 'Settings' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Settings')}>Settings</a>
</li>
{/* <li className="nav-item dropdown" style={navbarItemStyles}>
<a className="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style={navbarItemStyles}>
Settings
</a>
<div className="dropdown-menu" aria-labelledby="navbarDropdown">
<a className="dropdown-item" href="#">Action</a>
<a className="dropdown-item" href="#">Another action</a>
<div className="dropdown-divider"></div>
<a className="dropdown-item" href="#">Something else here</a>
<div className="collapse navbar-collapse flex-row-reverse" id="navbarSupportedContent" style={navbarItemStyles}>
<ul className="navbar-nav ">
<li className={`nav-item ${activePage === 'Pet Page' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Pet Page')}>Pet Page</a>
</li>
<li className={`nav-item ${activePage === 'Inventory' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Inventory')}>Inventory</a>
</li>
<li className={`nav-item ${activePage === 'Friends' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Friends')}>Friends</a>
</li>
<li className={`nav-item ${activePage === 'Settings' ? 'active' : ''}`}>
<a className="nav-link" href="#" style={navbarItemStyles} onClick={() => handlePageClick('Settings')}>Settings</a>
</li>
{/* <li className="nav-item dropdown" style={navbarItemStyles}>
<a className="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style={navbarItemStyles}>
Settings
</a>
<div className="dropdown-menu" aria-labelledby="navbarDropdown">
<a className="dropdown-item" href="#">Action</a>
<a className="dropdown-item" href="#">Another action</a>
<div className="dropdown-divider"></div>
<a className="dropdown-item" href="#">Something else here</a>
</div>
</li> */}
{auth.isAuthenticated ? (
<li className="navbar-item">
<button className="nav-link" onClick={() => auth.removeUser()} style={loginButtonStyles}>Log out</button>
</li>
) : (
<li className="navbar-item">
<a className="nav-link" href="#" onClick={() => auth.signinRedirect()} style={loginButtonStyles}>Log in</a>
</li>
)}

</ul>
</div>
</li> */}
{auth.isAuthenticated ? (
<li className="navbar-item">
<button className="nav-link" onClick={() => auth.removeUser()} style={loginButtonStyles}>Log out</button>
</li>
) : (
<li className="navbar-item">
<a className="nav-link" href="#" onClick={() => auth.signinRedirect()} style={loginButtonStyles}>Log in</a>
</li>
)}

</ul>
</div>
</nav>
</div>
</nav>
</div>
)
}

export default Navbar
export default Navbar
2 changes: 1 addition & 1 deletion node/code/RIOT
Open in desktop
Submodule RIOT updated 3 files
+0 −4 boards/sodaq-sara-sff/board.c
+0 −2 boards/sodaq-sara-sff/include/board.h
+10 −8 cpu/samd21/cpu.c