diff --git a/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx b/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx index 35ad4e2..ebc03df 100644 --- a/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx +++ b/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx @@ -110,7 +110,6 @@ export const BarAnimationDelayChart: React.FC = () => { yAxis: { name: noData ? '' : t('charts.gigabytes'), nameTextStyle: { - padding: noData ? [0, 0] : [0, -24], align: 'left', }, axisLabel: { diff --git a/src/components/layouts/main/sider/MainSider/MainSider.styles.ts b/src/components/layouts/main/sider/MainSider/MainSider.styles.ts index 8fcc36f..8abe687 100644 --- a/src/components/layouts/main/sider/MainSider/MainSider.styles.ts +++ b/src/components/layouts/main/sider/MainSider/MainSider.styles.ts @@ -83,6 +83,7 @@ export const SiderLogoDiv = styled.div` `; export const BrandSpan = styled.span` + margin: 0 1rem; font-weight: 600; font-size: 0.9rem; diff --git a/src/components/medical-dashboard/activityCard/ActivityChart.tsx b/src/components/medical-dashboard/activityCard/ActivityChart.tsx index df5bcca..51644ce 100644 --- a/src/components/medical-dashboard/activityCard/ActivityChart.tsx +++ b/src/components/medical-dashboard/activityCard/ActivityChart.tsx @@ -252,6 +252,9 @@ export const ActivityChart: React.FC = () => { name: noData ? '' : t('charts.gigabytes'), type: 'value', min: 0, + nameTextStyle: { + align: 'left', + }, axisLabel: { formatter: '{value} GB', color: themeObject[theme].textLight, diff --git a/src/components/nft-dashboard/activityStory/ActivityStoryItem/ActivityStoryItem.tsx b/src/components/nft-dashboard/activityStory/ActivityStoryItem/ActivityStoryItem.tsx index 280ac0b..2c09cd1 100644 --- a/src/components/nft-dashboard/activityStory/ActivityStoryItem/ActivityStoryItem.tsx +++ b/src/components/nft-dashboard/activityStory/ActivityStoryItem/ActivityStoryItem.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useEffect, useState} from 'react'; import { useTranslation } from 'react-i18next'; import { WalletTransaction } from '@app/api/activity.api'; import { Dates } from '@app/constants/Dates'; @@ -7,19 +7,36 @@ import { CurrencyTypeEnum } from '@app/interfaces/interfaces'; import * as S from './ActivityStoryItem.styles'; import { BaseRow } from '@app/components/common/BaseRow/BaseRow'; import { BaseCol } from '@app/components/common/BaseCol/BaseCol'; +function makeHexId(length: number): string { + const characters = 'abcdef0123456789'; + let result = ''; + for (let i = 0; i < length; i++) { + result += characters.charAt(Math.floor(Math.random() * characters.length)); + } + return result; +} export const ActivityStoryItem: React.FC = ({ witness_tx_id, date, output, value }) => { const { t } = useTranslation(); + const [transactionId, setTransactionId] = useState(null); + + // Effect to initialize the transaction ID when the component mounts + useEffect(() => { + if (!witness_tx_id) { + setTransactionId(makeHexId(64)); + } + }, [witness_tx_id]); - // Convert value to number const numericValue = parseFloat(value); + + return ( {t('Witness Transaction ID')}: - {witness_tx_id} + {witness_tx_id ? witness_tx_id : transactionId} {t('Output')}: diff --git a/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx b/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx index 1eef07f..66ecc5a 100644 --- a/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx +++ b/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx @@ -44,7 +44,7 @@ export const TrendingCreators: React.FC = () => { profile11, ], }; - const { isTablet: isTabletOrHigher, isDesktop } = useResponsive(); + const { isTablet: isTabletOrHigher } = useResponsive(); const { t } = useTranslation(); const goPrev = () => { @@ -72,11 +72,14 @@ export const TrendingCreators: React.FC = () => { drag="free" gap=".2rem" snap="false" - autoSpeed={isDesktop ? 0.7 : 0.8} + autoSpeed={isTabletOrHigher ? 0.7 : 0.8} flickPower="500" breakpoints={{ 8000: { - perPage: 8, // Large desktops and above + perPage: 10, // Large desktops and above + }, + 1920: { + perPage: 10, }, 1600: { perPage: 8, // Smaller desktops diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index b0e3698..ec2a88d 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -107,13 +107,13 @@ "nuclear": "Nuclear", "oil": "Oil", "kinds": "Kinds", - "pie": "Nostr Relay Contents", + "pie": "Nostr Relay Storage", "scatter": "Scatter", "search": "Search Engine", "union": "Union Ads", "video": "Video Ads", "visitorsFrom": "Contents from", - "monthlyDataUsage": "Notes and Media", + "monthlyDataUsage": "Notes vs Media", "notes": "Notes", "media": "Media" }, diff --git a/src/pages/RelaySettingsPage.tsx b/src/pages/RelaySettingsPage.tsx index 8383dd7..3075fc9 100644 --- a/src/pages/RelaySettingsPage.tsx +++ b/src/pages/RelaySettingsPage.tsx @@ -69,32 +69,32 @@ const RelaySettingsPage: React.FC = () => { const { isDesktop } = useResponsive(); const categories = [ - { id: 1, name: 'Basic Features' }, - { id: 2, name: 'Extra Features' }, - { id: 3, name: 'Git Features' }, + { id: 1, name: 'Basic Nostr Features' }, + { id: 2, name: 'Extra Nostr Features' }, + { id: 3, name: 'GitNestr Features' }, ]; const noteOptions = [ { kind: 0, kindString: 'kind0', description: 'Metadata', category: 1 }, { kind: 1, kindString: 'kind1', description: 'Text Note', category: 1 }, { kind: 2, kindString: 'kind2', description: 'Recommend Relay', category: 1 }, - { kind: 3, kindString: 'kind3', description: 'Contacts', category: 1 }, + { kind: 3, kindString: 'kind3', description: 'Follow List', category: 1 }, { kind: 5, kindString: 'kind5', description: 'Event Deletion', category: 1 }, { kind: 6, kindString: 'kind6', description: 'Repost', category: 1 }, { kind: 7, kindString: 'kind7', description: 'Reaction', category: 1 }, { kind: 8, kindString: 'kind8', description: 'Badge Award', category: 2 }, { kind: 16, kindString: 'kind16', description: 'Generic Repost', category: 1 }, { kind: 10000, kindString: 'kind10000', description: 'Mute List', category: 1 }, - { kind: 10001, kindString: 'kind10001', description: 'Pin List', category: 1 }, - { kind: 10002, kindString: 'kind10002', description: 'Relay List Metadata', category: 1 }, + { kind: 10001, kindString: 'kind10001', description: 'Pinned Note(s)', category: 1 }, + { kind: 10002, kindString: 'kind10002', description: 'Tiny Relay List', category: 1 }, { kind: 1984, kindString: 'kind1984', description: 'Reporting', category: 1 }, - { kind: 30000, kindString: 'kind30000', description: 'Follow List', category: 1 }, + { kind: 30000, kindString: 'kind30000', description: 'Custom Follow List', category: 1 }, { kind: 30008, kindString: 'kind30008', description: 'Profile Badge', category: 2 }, { kind: 30009, kindString: 'kind30009', description: 'Badge Definition', category: 2 }, - { kind: 30023, kindString: 'kind30023', description: 'Long-Form Content', category: 1 }, + { kind: 30023, kindString: 'kind30023', description: 'Formatted Articles', category: 1 }, { kind: 30079, kindString: 'kind30079', description: 'Event Paths', category: 1 }, - { kind: 9734, kindString: 'kind9734', description: 'Lightning Zap Request', category: 2 }, - { kind: 9735, kindString: 'kind9735', description: 'Lightning Zap Invoice Receipts', category: 2 }, + //{ kind: 9734, kindString: 'kind9734', description: 'Lightning Zap Request', category: 2 }, + { kind: 9735, kindString: 'kind9735', description: 'Zap Receipt', category: 2 }, { kind: 10011, kindString: 'kind10011', description: 'Issue Notes', category: 3 }, { kind: 10022, kindString: 'kind10022', description: 'PR Notes', category: 3 }, { kind: 9803, kindString: 'kind9803', description: 'Commit Notes', category: 3 }, @@ -437,7 +437,8 @@ const RelaySettingsPage: React.FC = () => { @@ -451,7 +452,7 @@ const RelaySettingsPage: React.FC = () => { /> - +
@@ -553,7 +554,7 @@ const RelaySettingsPage: React.FC = () => { @@ -581,7 +582,7 @@ const RelaySettingsPage: React.FC = () => {

{group.name}

{group.notes.map((note) => ( -
+
{ {settings.mode !== 'smart' && (

{'Add to Blacklist'}

{ style={{ display: 'flex', flexDirection: 'row', gap: '.5rem', alignItems: 'center' }} key={kind} > -
+
- {kind} + {`kind`+kind}
removeDynamicKind(kind)} > Remove @@ -826,7 +827,7 @@ const RelaySettingsPage: React.FC = () => { { /> - +
@@ -950,7 +951,7 @@ const RelaySettingsPage: React.FC = () => { @@ -977,7 +978,7 @@ const RelaySettingsPage: React.FC = () => {

{group.name}

{group.notes.map((note) => ( -
+
{
{settings.mode === 'unlimited' && ( -
+

{'Add to Blacklist'}

-
+
setNewKind(e.target.value)} placeholder="Enter new kind" /> { @@ -1025,7 +1026,7 @@ const RelaySettingsPage: React.FC = () => {
{ > {(settings.dynamicKinds || []).map((kind) => (
-
+
@@ -1047,7 +1048,7 @@ const RelaySettingsPage: React.FC = () => { isActive={true} style={{ fontSize: '1.2rem', paddingRight: '.8rem', paddingLeft: '.8rem' }} > - {kind} + {`kind`+kind}
removeDynamicKind(kind)}> diff --git a/src/pages/uiComponentsPages/UIComponentsPage.styles.ts b/src/pages/uiComponentsPages/UIComponentsPage.styles.ts index 81f4a62..7ee6e08 100644 --- a/src/pages/uiComponentsPages/UIComponentsPage.styles.ts +++ b/src/pages/uiComponentsPages/UIComponentsPage.styles.ts @@ -115,7 +115,7 @@ export const CheckboxLabel = styled.label` `; // Scaling up the BaseSwitch by increasing its dimensions export const LargeSwitch = styled(BaseSwitch)` - transform: scale(1.2); // Adjust the scale factor as needed + transform: scale(1.05); // Adjust the scale factor as needed transform-origin: center; & .modeSwitch{ background-image: linear-gradient(to right,red,red), linear-gradient(to right,var(--background-color),var(--background-color)); diff --git a/src/styles/GlobalStyle.ts b/src/styles/GlobalStyle.ts index edcca9b..9f172cc 100644 --- a/src/styles/GlobalStyle.ts +++ b/src/styles/GlobalStyle.ts @@ -258,13 +258,14 @@ export default createGlobalStyle` opacity:.75; } .checkboxHeader{ - padding: 0rem 0 1.4rem 0; + padding: 0rem 0 .5rem 0; } .grid-checkbox-group { width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); - gap: 1.8rem; + column-gap: 1rem; + row-gap: 1.6rem; } .grid-mobile-checkbox-group{ display: grid; @@ -273,9 +274,16 @@ export default createGlobalStyle` gap: 1.2rem; } + .checkbox-container{ + display: flex; + align-items: center; + } + .checkbox-container{ + white-space: nowrap; + } .grid-checkbox-group.large-label { - grid-template-columns: repeat(auto-fill, minmax(195px, 1fr)); + grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); } .switch-container{ padding-bottom: 1rem;