This commit is contained in:
Sacha Weatherstone
2021-04-11 12:35:02 +10:00
parent 3a1b2e7b34
commit b6e8b51bd8
20 changed files with 142 additions and 59 deletions
+1 -1
View File
@@ -14,7 +14,7 @@ const Header = (props: HeaderProps) => {
return (
<nav className="w-full shadow-md">
<div className="flex w-full container mx-auto justify-between px-6 py-4">
<img src="/design/typelogo/typelogo.svg" height="30" width="200" />
<img src="/typelogo.svg" height="30" width="200" />
<div className="flex items-center">
<div className="flex pl-4">
+1 -1
View File
@@ -4,7 +4,7 @@ import { FaCaretDown, FaCaretRight, FaSpinner } from 'react-icons/fa';
interface NavItemProps {
isDropdown: boolean;
open?: boolean;
open: boolean;
isNested: boolean;
titleContent: ReactNode;
dropdownContent?: ReactNode;
+2
View File
@@ -22,6 +22,7 @@ interface SidebarProps {
Language: LanguageEnum;
SetLanguage: Function;
Translations: languageTemplate;
myId: number;
}
const Sidebar = (props: SidebarProps) => {
@@ -37,6 +38,7 @@ const Sidebar = (props: SidebarProps) => {
IsReady={props.IsReady}
Nodes={props.Nodes}
Translations={props.Translations}
myId={props.myId}
/>
<SidebarDeviceSettings
IsReady={props.IsReady}
@@ -35,6 +35,7 @@ const SidebarChannels = (props: SidebarChannelsProps) => {
key={index}
isDropdown={true}
isNested={true}
open={false}
titleContent={
<div className="flex">
{channel.index} - {Protobuf.Channel_Role[channel.role]}
@@ -44,6 +45,7 @@ const SidebarChannels = (props: SidebarChannelsProps) => {
<NavItem
isDropdown={false}
isNested={false}
open={false}
titleContent={
<div className="w-full">
<div className="flex justify-between border-b hover:bg-gray-200">
+43 -10
View File
@@ -1,6 +1,14 @@
import React from 'react';
import { FaDesktop, FaUsers } from 'react-icons/fa';
import {
FaBatteryHalf,
FaClock,
FaCrown,
FaDesktop,
FaMapMarkerAlt,
FaMountain,
FaUsers,
} from 'react-icons/fa';
import type { Types } from '@meshtastic/meshtasticjs';
@@ -11,6 +19,7 @@ interface sidebarNodesProps {
IsReady: boolean;
Nodes: Types.NodeInfoPacket[];
Translations: languageTemplate;
myId: number;
}
const SidebarNodes = (props: sidebarNodesProps) => {
@@ -39,7 +48,11 @@ const SidebarNodes = (props: sidebarNodesProps) => {
open={false}
titleContent={
<div key={index} className="flex">
<FaDesktop className="my-auto mr-2" />
{node.data.num === props.myId ? (
<FaCrown className="text-yellow-500 my-auto mr-2" />
) : (
<FaDesktop className="my-auto mr-2" />
)}
<div className="m-auto">{node.data.user?.longName}</div>
</div>
}
@@ -47,6 +60,7 @@ const SidebarNodes = (props: sidebarNodesProps) => {
<NavItem
isDropdown={false}
isNested={true}
open={false}
titleContent={
<div>
<p>
@@ -58,15 +72,34 @@ const SidebarNodes = (props: sidebarNodesProps) => {
{node.packet?.rxRssi ? node.packet.rxRssi : 'Unknown'}
</p>
<p>
Last heard:{' '}
{node.data?.lastHeard ? node.data.lastHeard : 'Unknown'}
</p>
<p>
Loc:{' '}
{node.data?.position
? `alt: ${node.data?.position.altitude}, lat: ${node.data?.position.latitudeI}, lng: ${node.data?.position.longitudeI}, time: ${node.data?.position.time}, batt: ${node.data?.position.batteryLevel}`
: 'Unknown'}
{`Last heard: ${
node.data?.lastHeard
? new Date(node.data.lastHeard).toLocaleString()
: 'Unknown'
}`}{' '}
{}
</p>
<div className="flex">
<FaMapMarkerAlt className="my-auto mr-2" />
<p>
{node.data.position?.latitudeI},
{node.data.position?.longitudeI}
</p>
</div>
<div className="flex">
<FaMountain className="my-auto mr-2" />
<p>{node.data.position?.altitude}</p>
</div>
<div className="flex">
<FaClock className="my-auto mr-2" />
<p>{node.data.position?.time}</p>
</div>
<div className="flex">
<FaBatteryHalf className="my-auto mr-2" />
<p>{node.data.position?.batteryLevel}</p>
</div>
</div>
}
/>
@@ -19,6 +19,7 @@ const SidebarUISettings = (props: SidebarUISettingsProps) => {
<NavItem
isDropdown={true}
isNested={false}
open={false}
titleContent={
<div className="flex">
<FaCog className="my-auto mr-2" />
@@ -30,6 +31,7 @@ const SidebarUISettings = (props: SidebarUISettingsProps) => {
<NavItem
isDropdown={false}
isNested={true}
open={false}
titleContent={
<>
<div className="my-auto">
@@ -71,6 +73,7 @@ const SidebarUISettings = (props: SidebarUISettingsProps) => {
onClick={() => {
props.SetLanguage(LanguageEnum.ENGLISH);
}}
open={false}
isDropdown={false}
isNested={true}
titleContent={
@@ -81,6 +84,7 @@ const SidebarUISettings = (props: SidebarUISettingsProps) => {
onClick={() => {
props.SetLanguage(LanguageEnum.JAPANESE);
}}
open={false}
isDropdown={false}
isNested={true}
titleContent={