Skip to content

Commit a194911

Browse files
committed
Merge branch 'main' into my-tinker-branch
2 parents 083d5a5 + 199933c commit a194911

24 files changed

Lines changed: 1179 additions & 190 deletions

File tree

.env.development

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
REACT_APP_BASE_URL=http://localhost:9002
22
# REACT_APP_BASE_URL=https://11561ba2d27f.ngrok.app
33
REACT_APP_ASSETS_BUCKET=http://localhost
4-
REACT_APP_DEMO_MODE=false
4+
REACT_APP_DEMO_MODE=true
55

66
# more info https://create-react-app.dev/docs/advanced-configuration
77
ESLINT_NO_DEV_ERRORS=true

README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
# H.O.R.N.E.T Storage Nostr Relay Panel
1+
![nostr Badge](https://img.shields.io/badge/nostr-8e30eb?style=flat) ![Go Badge](https://img.shields.io/badge/Go-00ADD8?logo=go&logoColor=white) <img src="https://static.wixstatic.com/media/e9326a_3823e7e6a7e14488954bb312d11636da~mv2.png" height="20">
22

3-
This repository is home to the hornet storage panal which is a typescript / react web application designed for managing a hornet storage nostr multimedia relay which can be found here: https://github.com/HORNET-Storage/hornet-storage
3+
# Dashboard Panel for H.O.R.N.E.T Storage Nostr Relay
4+
5+
This repository is home to the hornet storage panal which is a typescript / react web application designed for managing a hornet storage nostr multimedia relay which can be found here: https://github.com/HORNET-Storage/HORNETS-Nostr-Relay
46

57
### Live Demo
68
We have a live demo that can be found at http://hornetstorage.net for anyone that wants to see what the panel looks like.
79

8-
*All data displayed on the demo is read directly from the database however it is dummy data inserted for the sake of the demo*
9-
1010
## Key Features
1111
- Manage your hornet-storage relay config directly from the panel
1212
- Switch between our new dumb and smart model for accepting nostr notes

src/components/layouts/main/MainContent/MainContent.tsx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { BaseLayout } from '@app/components/common/BaseLayout/BaseLayout';
44

55
interface HeaderProps {
66
$isTwoColumnsLayout: boolean;
7+
$isDesktop: boolean;
78
}
89

910
export default styled(BaseLayout.Content)<HeaderProps>`
@@ -13,9 +14,14 @@ export default styled(BaseLayout.Content)<HeaderProps>`
1314
flex-direction: column;
1415
justify-content: space-between;
1516
17+
${(props) =>
18+
props?.$isDesktop &&
19+
css`
20+
z-index: 105;
21+
`}
22+
1623
@media only screen and ${media.md} {
17-
padding: ${LAYOUT.desktop.paddingVertical} 1.8rem 0
18-
${LAYOUT.desktop.paddingHorizontal};
24+
padding: ${LAYOUT.desktop.paddingVertical} 1.8rem 0 ${LAYOUT.desktop.paddingHorizontal};
1925
}
2026
2127
@media only screen and ${media.xl} {

src/components/layouts/main/MainLayout/MainLayout.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@ const MainLayout: React.FC = () => {
7474
style={isDesktop ? { overflowY: 'hidden' } : { overflowY: 'auto' }}
7575
id="main-content"
7676
$isTwoColumnsLayout={isTwoColumnsLayout}
77+
$isDesktop={isDesktop}
7778
>
7879
<div>
7980
<Outlet />

src/components/layouts/main/sider/sidebarNavigation.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,8 @@ export const useSidebarNavigation = (): SidebarNavigationItem[] => {
2727
},
2828
{
2929
title: 'common.relay-settings',
30-
key: 'storage-settings',
31-
url: '/storage-settings',
30+
key: 'relay-settings',
31+
url: '/relay-settings',
3232
icon: <StorageSettingsIcon />,
3333
},
3434
{
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import React, { useState } from 'react';
2+
import * as S from '../TopUpBalanceButton/TopUpBalanceButton.styles';
3+
import SendModal from '../SendModal/SendModal';
4+
import { useAppSelector } from '@app/hooks/reduxHooks';
5+
6+
const SendButton: React.FC = () => {
7+
const { theme } = useAppSelector((state) => state.theme);
8+
const [isModalOpen, setIsModalOpen] = useState(false);
9+
const handleButtonClick = () => {
10+
setIsModalOpen(true);
11+
};
12+
const handleModalClose = () => {
13+
setIsModalOpen(false);
14+
};
15+
return (
16+
<>
17+
<S.TopUpButton type={theme === 'dark' ? 'ghost' : 'primary'} block onClick={handleButtonClick}>
18+
{'Send'}
19+
</S.TopUpButton>
20+
<SendModal isOpen={isModalOpen} onOpenChange={handleModalClose} />
21+
</>
22+
);
23+
};
24+
25+
export default SendButton;
Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
import styled, { css } from 'styled-components';
2+
import { BaseCard } from '@app/components/common/BaseCard/BaseCard';
3+
import { BaseButton } from '@app/components/common/BaseButton/BaseButton';
4+
import { BaseRow } from '@app/components/common/BaseRow/BaseRow';
5+
export const ContentWrapper = styled.div`
6+
display: row;
7+
flex-direction: row;
8+
gap: 2rem;
9+
`;
10+
export const TextRow = styled.div`
11+
display: flex;
12+
flex-direction: row;
13+
gap: 1rem;
14+
`;
15+
16+
export const SubCard = styled(BaseCard)<{ $isMobile?: boolean }>`
17+
width: 30%;
18+
${(props) =>
19+
props.$isMobile &&
20+
css`
21+
width: 100%;
22+
`}
23+
background-color: var(--additional-background-color);
24+
cursor: pointer;
25+
box-shadow: 0px 0px 10px 0px var(--shadow-color);
26+
.ant-card-body {
27+
padding: 1rem 2rem;
28+
}
29+
`;
30+
export const SendBody = styled(BaseRow)`
31+
padding-bottom: 1rem;
32+
`;
33+
export const FormSpacer = styled.div`
34+
display: flex;
35+
flex-direction: column;
36+
gap: 1rem;
37+
`;
38+
export const FormHeader = styled.span`
39+
display: flex;
40+
font-size: 2rem;
41+
align-items: center;
42+
text-align: center;
43+
justify-content: center;
44+
width: 100%;
45+
padding-bottom: 1rem;
46+
`;
47+
48+
export const SubCardHeader = styled.span`
49+
font-size: 1.5rem;
50+
`;
51+
52+
export const InputHeader = styled.span`
53+
font-size: 1.5rem;
54+
`;
55+
56+
export const SubCardAmount = styled.span`
57+
font-size: 1.5rem;
58+
`;
59+
export const SubCardContent = styled.div`
60+
font-size: 1.3rem;
61+
height: 100%;
62+
display: flex;
63+
justify-content: space-around;
64+
flex-direction: column;
65+
align-items: center;
66+
text-align: center;
67+
gap: 3rem;
68+
padding-top: 1rem;
69+
padding-bottom: 1rem;
70+
`;
71+
72+
export const InputWrapper = styled.div`
73+
display: flex;
74+
min-width: 25vw;
75+
flex-direction: column;
76+
gap: 0.5rem;
77+
`;
78+
export const TiersRow = styled.div`
79+
display: flex;
80+
flex-direction: row;
81+
gap: 1rem;
82+
justify-content: space-around;
83+
`;
84+
85+
export const TiersCol = styled.div`
86+
display: flex;
87+
flex-direction: column;
88+
gap: 1rem;
89+
justify-content: space-around;
90+
`;
91+
export const SendFormButton = styled(BaseButton)`
92+
width: 100%;
93+
`;
94+
export const TiersContainer = styled.div`
95+
display: flex;
96+
flex-direction: column;
97+
gap: 1rem;
98+
transition: all 0.5s ease;
99+
padding: 1rem;
100+
.tier-hover:hover {
101+
background-color: var(--primary-color);
102+
}
103+
.selected {
104+
border: 1px solid var(--primary-color);
105+
}
106+
.invalidAmount {
107+
border: 1px solid var(--error-color);
108+
}
109+
`;
110+
export const BalanceInfo = styled.small`
111+
color: var(--subtext-color);
112+
`;
113+
114+
export const Recipient = styled.span`
115+
color: var(--subtext-color);
116+
word-break: break-all;
117+
`;
118+
export const ErrorText = styled.small`
119+
color: var(--error-color);
120+
display: flex;
121+
flex-direction: row;
122+
align-items: center;
123+
`;
124+
export const AddressText = styled.span`
125+
text-decoration: underline;
126+
color: var(--text-main-color);
127+
`;
128+
129+
export const RateValueWrapper = styled.div`
130+
display: flex;
131+
flex-direction: column;
132+
gap: 1rem;
133+
`;
134+
export const RateValue = styled.span`
135+
color: green;
136+
`;
137+
export const RBFWrapper = styled.div`
138+
display: flex;
139+
flex-direction: row;
140+
gap: 1rem;
141+
align-items: center;
142+
justify-content: center;
143+
`;

0 commit comments

Comments
 (0)