@xyo-network/os-react-runtime 7.2.1 → 7.3.1

package/src/modules/widgets/Types/Stat/Stat.tsx

@@ -1,41 +0,0 @@
-import { Skeleton } from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { FlexGrowCol } from '@xylabs/react-flexbox'
-import React from 'react'
-
-import type { InsightStatProps } from './InsightStatProps.ts'
-import { InsightSubtitle } from './Subtitle.tsx'
-import { InsightUnit } from './Unit.tsx'
-import { InsightValue } from './Value.tsx'
-
-export interface InsightStatBoxProps extends InsightStatProps, FlexBoxProps {}
-
-export const InsightStatBox: React.FC<InsightStatBoxProps> = ({
-  uiInsightValue, insightColor, subtitle, unit, ...props
-}) => (
-  <FlexGrowCol alignItems="start" {...props}>
-    {uiInsightValue
-      ? (
-          <>
-            <span>
-              <InsightValue variant="caption" color={insightColor}>
-                {uiInsightValue}
-              </InsightValue>
-              {unit
-                ? <InsightUnit variant="caption">{unit}</InsightUnit>
-                : null}
-            </span>
-            {subtitle
-              ? <InsightSubtitle variant="caption">{subtitle}</InsightSubtitle>
-              : null}
-          </>
-        )
-      : (
-          <Skeleton
-            height="100%"
-            width="100%"
-            sx={{ display: 'flex', minHeight: '50px' }}
-          />
-        )}
-  </FlexGrowCol>
-)

package/src/modules/widgets/Types/Stat/Subtitle.tsx

@@ -1,14 +0,0 @@
-import { styled, Typography } from '@mui/material'
-
-export const InsightSubtitle = styled(Typography, { name: 'InsightValueContext' })(({ theme }) => {
-  return {
-    '&.responsive-font-sizes': {
-      [theme.breakpoints.up('sm')]: { fontSize: 'calc(var(--baseFontSize) * 0.46)' },
-      [theme.breakpoints.up('md')]: { fontSize: 'calc(var(--baseFontSize) * 0.3)' },
-    },
-    '--baseFontSize': theme.spacing(1),
-    'fontSize': 'var(--baseFontSize)',
-    'letterSpacing': 0,
-    'opacity': 0.6,
-  }
-})

package/src/modules/widgets/Types/Stat/Unit.tsx

@@ -1,13 +0,0 @@
-import { styled, Typography } from '@mui/material'
-
-export const InsightUnit = styled(Typography, { name: 'InsightUnit' })(({ theme }) => {
-  return {
-    '&.responsive-font-sizes': {
-      [theme.breakpoints.up('sm')]: { fontSize: 'calc(var(--baseFontSize) * 0.57)' },
-      [theme.breakpoints.up('lg')]: { fontSize: 'calc(var(--baseFontSize) * 0.35)' },
-    },
-    'fontSize': `var(--insightUnitFontSize, ${theme.spacing(1.85)})`,
-    'fontWeight': 500,
-    'letterSpacing': 0,
-  }
-})

package/src/modules/widgets/Types/Stat/Value.tsx

@@ -1,16 +0,0 @@
-import { styled, Typography } from '@mui/material'
-
-export const InsightValue = styled(Typography, { name: 'InsightValue' })(({ theme }) => {
-  return {
-    '&.responsive-font-sizes': {
-      [theme.breakpoints.up('sm')]: { fontSize: 'calc(var(--baseFontSize) * 0.95)' },
-      [theme.breakpoints.up('md')]: { fontSize: 'calc(var(--baseFontSize) * 0.72)' },
-      [theme.breakpoints.up('lg')]: { fontSize: 'calc(var(--baseFontSize) * 0.62)' },
-    },
-    'fontSize': `var(--insightValueFontSize, ${theme.spacing(3)})`,
-    'letterSpacing': 0,
-    'lineHeight': 1,
-    'marginRight': theme.spacing(0.5),
-    'whiteSpace': 'nowrap',
-  }
-})

package/src/modules/widgets/Types/Stat/index.ts

@@ -1,3 +0,0 @@
-export * from './Insight.ts'
-export * from './InsightStatProps.ts'
-export * from './Stat.tsx'

package/src/modules/widgets/Types/Tables/BooleanTable.tsx

@@ -1,88 +0,0 @@
-import { CircleRounded } from '@mui/icons-material'
-import type { SvgIcon } from '@mui/material'
-import {
-  Paper, styled, TableRow, Typography,
-} from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import {
-  FlexCol, FlexGrowRow, FlexRow,
-} from '@xylabs/react-flexbox'
-import { alphaCss } from '@xylabs/react-theme'
-import type { ReactNode } from 'react'
-import React from 'react'
-
-export interface BooleanTablePropsItemProps {
-  name: string
-  value: boolean
-}
-
-const sampleData: BooleanTablePropsItemProps[] = [
-  { name: '@arietrouw', value: true },
-  { name: '@officialxyo', value: false },
-  { name: '0x187623121928634124', value: true },
-  { name: '@coinwithus', value: true },
-  { name: '0x871218376123894321', value: true },
-]
-
-export interface BooleanTableProps extends FlexBoxProps {
-  falseOutput?: ReactNode
-  items: BooleanTablePropsItemProps[]
-  tableHeaders: string[]
-  trueOutput?: ReactNode
-}
-
-export const StyledLightTableRow = styled(Paper, { name: 'StyledLightTableRow' })(({ theme }) => ({
-  backgroundColor: 'transparent',
-  padding: theme.spacing(0.75),
-}))
-
-export const StyledTableColumnTitle = styled(Typography, { name: 'StyledTableColumnTitle' })(({ theme }) => ({
-  color: theme.vars?.palette.text.secondary,
-  fontWeight: theme.typography.fontWeightBold,
-  textTransform: 'uppercase',
-}))
-
-export const DefaultTrueOutput = styled<typeof SvgIcon>(CircleRounded, { name: 'DefaultTrueOutput' })(({ theme }) => ({
-  fill: theme.vars?.palette.success.main,
-  fontSize: '10px',
-}))
-
-export const DefaultFalseOutput = styled<typeof SvgIcon>(CircleRounded, { name: 'DefaultFalseOutput' })(({ theme }) => ({
-  fill: alphaCss(theme.vars?.palette.text.disabled ?? '#111', 0.5),
-  fontSize: '10px',
-}))
-
-const defaultTrueOutput = <DefaultTrueOutput />
-const defaultFalseOutput = <DefaultFalseOutput />
-
-export const BooleanTable: React.FC<BooleanTableProps> = ({
-  items = sampleData,
-  tableHeaders,
-  trueOutput = defaultTrueOutput,
-  falseOutput = defaultFalseOutput,
-  ...props
-}) => {
-  return (
-    <FlexCol alignItems="stretch" {...props}>
-      <FlexRow paddingBottom={0.5} justifyContent="space-between">
-        {tableHeaders.map(name => (
-          <StyledTableColumnTitle key={name} variant="caption">
-            {name}
-          </StyledTableColumnTitle>
-        ))}
-      </FlexRow>
-      <FlexCol alignItems="stretch" gap={0.25}>
-        {items.slice(0, 4).map((item, index) => (
-          <TableRow key={index}>
-            <FlexGrowRow flexGrow={1} justifyContent="space-between">
-              <Typography variant="caption" noWrap maxWidth="70%">
-                {item.name}
-              </Typography>
-              {item.value ? trueOutput : falseOutput}
-            </FlexGrowRow>
-          </TableRow>
-        ))}
-      </FlexCol>
-    </FlexCol>
-  )
-}

package/src/modules/widgets/Types/Tables/index.ts

@@ -1 +0,0 @@
-export * from './BooleanTable.tsx'

package/src/modules/widgets/Types/index.ts

@@ -1,4 +0,0 @@
-export * from './BarGraph/index.ts'
-export * from './DataColumns/index.ts'
-export * from './Examples/index.ts'
-export * from './Tables/index.ts'

package/src/modules/widgets/WidgetCard.tsx

@@ -1,111 +0,0 @@
-import {
-  ArrowForwardRounded, HistoryRounded, RefreshRounded,
-} from '@mui/icons-material'
-import {
-  Box, CardContent, IconButton, Tooltip, Typography, useTheme,
-} from '@mui/material'
-import { ButtonEx } from '@xylabs/react-button'
-import {
-  FlexCol, FlexGrowRow, FlexRow,
-} from '@xylabs/react-flexbox'
-import { alphaCss } from '@xylabs/react-theme'
-import type { SimpleCardProps } from '@xyo-network/react-card'
-import { CardEx } from '@xyo-network/react-card'
-import { DateTime } from 'luxon'
-import type { ReactNode } from 'react'
-import React from 'react'
-
-export interface WidgetCardProps extends SimpleCardProps {
-  timeOfData: number
-  widgetContent: ReactNode
-  widgetName: string
-  widgetPath: string
-}
-
-export const WidgetCard: React.FC<WidgetCardProps> = ({
-  widgetName, widgetContent, widgetPath, timeOfData = 1_715_875_087, ...props
-}) => {
-  const theme = useTheme()
-
-  const formatTimeOfData = () => {
-    const timeNow = DateTime.now().toSeconds()
-    const secondsSinceDataRefreshed: number = timeNow - timeOfData
-
-    const getYearsAndMonths = () => {
-      const years = Math.floor(secondsSinceDataRefreshed / 31_536_000)
-      const months = Math.ceil((secondsSinceDataRefreshed - years * 31_536_000) / 2_628_288)
-      if (months === 12) {
-        return `${years + 1} Years Ago`
-      } else if (years > 1 && months > 1) {
-        return `${years} Years, ${months} Months Ago`
-      } else if (years === 1 && months > 1) {
-        return `${years} Year, ${months} Months Ago`
-      } else if (years > 1 && months === 1) {
-        return `${years} Years, ${months} Month Ago`
-      } else if (years === 1 && months === 1) {
-        return `${years} Year, ${months} Month Ago`
-      } else {
-        return `About ${years} Years Ago`
-      }
-    }
-
-    if (secondsSinceDataRefreshed < 60) {
-      return 'Less than 1 Minute Ago'
-    } else if (secondsSinceDataRefreshed < 3600) {
-      return `${DateTime.fromSeconds(secondsSinceDataRefreshed).toFormat('m')} Minutes Ago`
-    } else if (secondsSinceDataRefreshed < 86_400) {
-      return `${Math.ceil(secondsSinceDataRefreshed / 3600)} Hours Ago`
-    } else if (secondsSinceDataRefreshed < 2_628_288) {
-      return `${Math.ceil(secondsSinceDataRefreshed / 86_400)} Days Ago`
-    } else if (secondsSinceDataRefreshed < 31_536_000) {
-      return `${Math.ceil(secondsSinceDataRefreshed / 2_628_288)} Months Ago`
-    } else {
-      return getYearsAndMonths()
-    }
-  }
-
-  return (
-    <CardEx
-      {...props}
-      sx={{
-        backgroundColor: alphaCss(theme.vars?.palette.background.paper ?? '#000', 0.4),
-        display: 'flex',
-        height: '300px',
-        width: '300px',
-      }}
-    >
-      <CardContent sx={{ height: '100%', padding: 1 }}>
-        <FlexCol sx={{
-          alignItems: 'stretch', height: '100%', justifyContent: 'space-between',
-        }}
-        >
-          <FlexCol alignItems="stretch">
-            <FlexGrowRow justifyContent="space-between" alignItems="center">
-              <Typography color={theme.vars?.palette.text.primary} fontWeight={theme.typography.fontWeightMedium} variant="h6">
-                {widgetName}
-              </Typography>
-              <IconButton>
-                <RefreshRounded />
-              </IconButton>
-            </FlexGrowRow>
-            <Box paddingY={2}>{widgetContent}</Box>
-          </FlexCol>
-          <FlexRow justifyContent="space-between" alignItems="center">
-            <Tooltip title={DateTime.fromSeconds(timeOfData).toFormat('DD ttt')}>
-              <FlexRow
-                gap={0.5}
-                sx={{ opacity: 0.5 }}
-              >
-                <HistoryRounded fontSize="small" color="inherit" />
-                <Typography variant="body2">{formatTimeOfData()}</Typography>
-              </FlexRow>
-            </Tooltip>
-            <ButtonEx size="small" to={widgetPath}>
-              <ArrowForwardRounded fontSize="small" />
-            </ButtonEx>
-          </FlexRow>
-        </FlexCol>
-      </CardContent>
-    </CardEx>
-  )
-}

package/src/modules/widgets/WidgetCardExamples.tsx

@@ -1,31 +0,0 @@
-import { Stack } from '@mui/material'
-import type { FlexBoxProps } from '@xylabs/react-flexbox'
-import { useIsDark } from '@xylabs/react-theme'
-import React from 'react'
-
-import { xyoDark, xyoLight } from '../../img/index.ts'
-import { DappPage } from '../Dapp/index.ts'
-import { StackOfWidgets } from './StackOfWidgets.tsx'
-import {
-  ExampleBarGraphWidget, ExampleBooleanTableWidget, ExampleTwoColTwoStatWidget,
-} from './Types/index.ts'
-
-export const WidgetCardExamples: React.FC<FlexBoxProps> = () => {
-  // resolve the default name code for the palette
-  const darkMode = useIsDark()
-
-  return (
-    <DappPage
-      sx={{ backgroundImage: darkMode ? `url(${xyoDark})` : `url(${xyoLight})`, backgroundSize: 'cover' }}
-      container="xl"
-      title="Example Widget Cards"
-    >
-      <Stack gap={2} flexDirection="row" flexWrap="wrap">
-        <ExampleTwoColTwoStatWidget />
-        <ExampleBarGraphWidget />
-        <ExampleBooleanTableWidget />
-        <StackOfWidgets />
-      </Stack>
-    </DappPage>
-  )
-}

package/src/modules/widgets/index.ts

@@ -1,2 +0,0 @@
-export * from './WidgetCard.tsx'
-export * from './WidgetCardExamples.tsx'

package/src/settings/Theme/ThemeCssVars.ts

@@ -1,228 +0,0 @@
-import {
-  createTheme, darken, lighten,
-} from '@mui/material'
-import { alphaCss } from '@xylabs/react-theme'
-
-declare module '@mui/material/styles' {
-  interface PaletteOptions {
-    iconBgGradientBuilder: (baseColor: string) => string
-    iconBgHoverGradientBuilder: (baseColor: string) => string
-    iconGradient: string
-    iconGradientHover: string
-  }
-  interface Palette {
-    iconBgGradientBuilder: (baseColor: string) => string
-    iconBgHoverGradientBuilder: (baseColor: string) => string
-    iconGradient: string
-    iconGradientHover: string
-  }
-}
-
-export const defaultIconBackground = '#A060E0'
-export const defaultIconBackgroundHover = '#bdade8'
-
-const DynamicIconBgGradientBuilder = {
-  iconBgGradientBuilder: (baseColor: string) => `linear-gradient(148deg, ${baseColor} 0%, ${darken(baseColor, 0.3)} 100%);`,
-  iconBgHoverGradientBuilder: (baseColor: string) => `linear-gradient(148deg, ${lighten(baseColor, 0.5)} 0%, ${lighten(baseColor, 0.2)} 100%);`,
-}
-
-const StaticIconBgGradient = {
-  iconGradient: `linear-gradient(148deg, ${defaultIconBackground} 0%, ${darken(defaultIconBackground, 0.35)} 100%);`,
-  iconGradientHover: `linear-gradient(148deg, ${defaultIconBackgroundHover} 0%, ${darken(defaultIconBackgroundHover, 0.35)} 100%);`,
-}
-
-const lightPalette = {
-  background: {
-    default: '#F4F4F4',
-    paper: '#FFFFFF',
-  },
-  error: {
-    dark: '#AA0E0E',
-    light: '#F15555',
-    main: '#D81111',
-  },
-  ...DynamicIconBgGradientBuilder,
-  ...StaticIconBgGradient,
-  primary: { main: '#463dc6', light: '#b2adfb' },
-  secondary: { main: '#186ecc' },
-  success: {
-    dark: '#347f21',
-    light: '#94dd80',
-    main: '#62bc50',
-  },
-  text: {
-    disabled: '#49454D',
-    primary: '#0d0d47',
-    secondary: '#49454D',
-  },
-  warning: { main: '#ffc805' },
-}
-const darkPalette = {
-  background: {
-    default: '#020223',
-    paper: '#19193F',
-  },
-  error: { main: '#f6594e' },
-  success: {
-    main: '#7efc81',
-    contrastText: '#011e01',
-  },
-  ...DynamicIconBgGradientBuilder,
-  ...StaticIconBgGradient,
-  primary: { main: '#5658F3', light: '#7c72ff' },
-  secondary: {
-    main: '#66caf7',
-    contrastText: '#020223',
-  },
-  warning: { main: '#f7d866' },
-  text: {
-    disabled: '#a5acdb',
-    primary: '#E3E4EB',
-    secondary: '#e3e4eba3',
-  },
-}
-
-/** @deprecated - use theme from \@xylabs/react-theme */
-export const ThemeCssVars = createTheme({
-  colorSchemes: {
-    dark: { palette: darkPalette },
-    light: { palette: lightPalette },
-  },
-  components: {
-    MuiAccordion: {
-      styleOverrides: {
-        root: {
-          '&.Mui-expanded': { '&$expanded': { margin: '4px 0' } },
-          'boxShadow': 'none',
-        },
-      },
-    },
-    MuiAccordionSummary: { styleOverrides: { root: { boxShadow: 'none' } } },
-    MuiAppBar: {
-      styleOverrides: {
-        root: ({ theme }) => ({
-          WebkitBackdropFilter: 'blur(20px)',
-          backdropFilter: 'blur(20px)',
-          backgroundColor: alphaCss(theme.vars?.palette.background.paper ?? '#000', 0.2),
-          boxShadow: 'none',
-          color: '#16163D',
-          ...theme.applyStyles('dark', { color: '#CBC4CE' }),
-        }),
-      },
-    },
-    MuiCard: {
-      defaultProps: { elevation: 0 },
-      styleOverrides: {
-        root: ({ theme }) => ({
-          WebkitBackdropFilter: 'blur(20px)',
-          backdropFilter: 'blur(20px)',
-          backgroundColor: alphaCss(theme.vars?.palette.background.paper ?? '#000', 0.7),
-          display: 'flex',
-          flexDirection: 'column',
-          justifyContent: 'space-between',
-        }),
-      },
-    },
-    MuiCardContent: {
-      styleOverrides: {
-        root: {
-          // This is to get rid of the extra padding at the end of Card Content that misaligns padding when there's only 1 item
-          '&:last-child': { paddingBottom: '16px' },
-        },
-      },
-    },
-    MuiCardHeader: {
-      styleOverrides: {
-        content: {
-          display: 'flex',
-          flexDirection: 'column',
-          overflow: 'hidden',
-        },
-      },
-    },
-    MuiChip: {
-      styleOverrides: {
-        root: {
-          borderRadius: 4,
-          fontWeight: 400,
-        },
-      },
-    },
-    MuiContainer: { styleOverrides: { root: { maxWidth: 'xl' } } },
-    MuiDrawer: {
-      styleOverrides: {
-        root: ({ theme }) => ({
-          '& .MuiTypography-root, & .MuiButton-root': { color: '#FFFFFF' },
-          'paperProps': { backgroundColor: '#19193F' },
-          ...theme.applyStyles('dark', { color: theme.vars?.palette.secondary.main }),
-        }),
-      },
-    },
-    MuiFilledInput: {
-      defaultProps: { disableUnderline: true },
-      styleOverrides: {
-        root: ({ theme }) => ({
-          '&.Mui-error': { border: `${theme.vars?.palette.error.main} 1px solid` },
-          'border': 'transparent 1px solid',
-          'borderRadius': theme.shape.borderRadius,
-        }),
-      },
-    },
-    MuiLink: {
-      defaultProps: { underline: 'none' },
-      styleOverrides: { root: { '&:hover': { filter: 'brightness(75%)' } } },
-    },
-    MuiPaper: { defaultProps: { elevation: 0 } },
-    MuiTableCell: {
-      styleOverrides: {
-        body: {
-          fontFamily: 'monospace',
-          whiteSpace: 'nowrap',
-        },
-        head: {
-          fontWeight: 700,
-          whiteSpace: 'nowrap',
-        },
-      },
-    },
-    MuiTooltip: {
-      styleOverrides: {
-        tooltip: ({ theme }) => ({
-          ...theme.typography.body1,
-          color: 'inherit',
-          maxWidth: 250,
-          border: `1px solid ${theme.vars?.palette.background.default}`,
-          backgroundColor: theme.vars?.palette.background.paper,
-          padding: theme.spacing(1),
-          boxShadow: 'rgba(17, 12, 46, 0.15) 0px 48px 100px 0px',
-        }),
-      },
-    },
-  },
-  shape: { borderRadius: 6 },
-  spacing: 12,
-  typography: {
-    allVariants: { fontFamily: ['Manrope', 'san-serif'].join(',') },
-    body1: { fontSize: '16px' },
-    button: {
-      fontSize: '1rem',
-      textTransform: 'capitalize',
-    },
-    fontWeightBold: 700,
-    fontWeightLight: 300,
-    fontWeightMedium: 600,
-    fontWeightRegular: 500,
-    h1: { fontSize: '3.2rem' },
-    h2: { fontSize: '2.7rem' },
-    h3: { fontSize: '2.24rem' },
-    h4: { fontSize: '2rem' },
-    h5: { fontSize: '1.5rem' },
-    h6: { fontSize: '1.2rem' },
-    subtitle1: {
-      fontWeight: 300,
-      opacity: '50%',
-      textTransform: 'uppercase',
-    },
-    subtitle2: { opacity: '50%' },
-  },
-})

package/src/settings/Theme/ThemeProvider.tsx

@@ -1,20 +0,0 @@
-import { type SupportedColorScheme, ThemeProvider } from '@mui/material'
-import { XyosTheme } from '@xylabs/react-theme'
-import type { PropsWithChildren } from 'react'
-import React, { useMemo } from 'react'
-
-/** @deprecated - rely on websites to construct their own theme provider */
-export const AppOsThemeProvider: React.FC<PropsWithChildren> = ({ children }) => {
-  const initialValue: SupportedColorScheme | 'system' = useMemo(() => {
-    const validValues: SupportedColorScheme[] = ['light', 'dark']
-    const savedValue = localStorage.getItem('mui-mode')
-    if (savedValue && validValues.includes(savedValue as SupportedColorScheme)) return savedValue as SupportedColorScheme
-    return 'system'
-  }, [])
-
-  return (
-    <ThemeProvider theme={XyosTheme} defaultMode={initialValue}>
-      {children}
-    </ThemeProvider>
-  )
-}

package/src/settings/Theme/index.ts

@@ -1 +0,0 @@
-export * from './ThemeProvider.js'

package/src/settings/index.ts

@@ -1 +0,0 @@
-export * from './Theme/index.ts'

package/src/types/global.d.ts

@@ -1,11 +0,0 @@
-import type { XyOsGlobal } from '@xyo-network/os-model'
-
-export declare global {
-  interface Window {
-    ethereum: ethers
-    getXyOsGlobal: () => XyOsGlobal
-  }
-  namespace JSX {
-    type IntrinsicElements = React.JSX.IntrinsicElements
-  }
-}

package/src/types/images.d.ts

@@ -1,4 +0,0 @@
-declare module '*.png'
-declare module '*.jpg'
-declare module '*.gif'
-declare module '*.webp'

package/src/utils/DappInstallTypeFilters.ts

@@ -1,27 +0,0 @@
-import type { InstallationType, RegisteredDappSet } from '@xyo-network/os-model'
-import {
-  isInstalledDappSet, isPreInstalledDappSet, isUnInstalledDappSet,
-} from '@xyo-network/os-model'
-
-export const DappInstallTypeFilters: Record<
-  InstallationType,
-  (registeredDappSets: RegisteredDappSet[] | undefined) => RegisteredDappSet[] | undefined
-> = {
-  installed(registeredDappSets?: RegisteredDappSet[]) {
-    return registeredDappSets && registeredDappSets?.length > 0
-      ? registeredDappSets?.filter(isInstalledDappSet).toSorted((a, b) => (a.dapp.config.name.toUpperCase() < b.dapp.config.name.toUpperCase() ? -1 : 1))
-      : undefined
-  },
-  preInstalled(registeredDappSets?: RegisteredDappSet[]) {
-    return registeredDappSets && registeredDappSets?.length > 0
-      ? registeredDappSets
-          ?.filter(isPreInstalledDappSet)
-          .toSorted((a, b) => (a.dapp.config.name.toUpperCase() < b.dapp.config.name.toUpperCase() ? -1 : 1))
-      : undefined
-  },
-  uninstalled(registeredDappSets?: RegisteredDappSet[]) {
-    return registeredDappSets && registeredDappSets?.length > 0
-      ? registeredDappSets.filter(isUnInstalledDappSet).toSorted((a, b) => (a.dapp.config.name.toUpperCase() < b.dapp.config.name.toUpperCase() ? -1 : 1))
-      : undefined
-  },
-}

package/src/utils/getApiDomain.ts

@@ -1,14 +0,0 @@
-const getApiDomain = (localHost: boolean, apiDomain: string | undefined) => {
-  if (apiDomain !== undefined) {
-    return apiDomain
-  }
-  if (localHost) {
-    return 'http://localhost:8080'
-  }
-  if (location.hostname.startsWith('beta')) {
-    return 'https://beta.archivist.xyo.network'
-  }
-  return 'https://archivist.xyo.network'
-}
-
-export { getApiDomain }

package/src/utils/index.ts

@@ -1,3 +0,0 @@
-export * from './DappInstallTypeFilters.js'
-export * from './getApiDomain.ts'
-export * from './useOnWindowResize.js'

package/src/utils/useOnWindowResize.tsx

@@ -1,18 +0,0 @@
-import { useEffect, useState } from 'react'
-
-export const useOnWindowResize = () => {
-  const [resized, setResized] = useState<UIEvent>()
-
-  useEffect(() => {
-    const onResize = (event: UIEvent) => {
-      setResized(event)
-    }
-    globalThis.addEventListener('resize', onResize, false)
-
-    return () => {
-      globalThis.removeEventListener('resize', onResize)
-    }
-  }, [])
-
-  return resized
-}