antoncoding/monarch

View on GitHub
app/markets/components/RiskIndicator.tsx

Summary

Maintainability
C
1 day
Test Coverage
import { Tooltip } from '@nextui-org/tooltip';
import { WarningWithDetail } from '@/utils/types';
import { WarningCategory } from '@/utils/types';

type RiskFlagProps = {
  level: 'green' | 'yellow' | 'red';
  description: string;
};

export function RiskIndicator({ level, description }: RiskFlagProps) {
  return (
    <Tooltip content={description}>
      <div className="gap flex">
        {level === 'green' && <div className="h-4 w-[4px] bg-green-500" />}
        {level === 'yellow' && <div className="h-4 w-[4px] bg-yellow-500" />}
        {level === 'red' && <div className="h-4 w-[4px] bg-red-500" />}
      </div>
    </Tooltip>
  );
}

export function RiskIndicatorFromWarning({
  market,
  category,
  greenDescription,
  yellowDescription,
  redDescription,
  isBatched = false,
}: {
  market: { warningsWithDetail: WarningWithDetail[] };
  category: WarningCategory;
  greenDescription: string;
  yellowDescription: string;
  redDescription: string;
  isBatched?: boolean;
}) {
  const warnings = market.warningsWithDetail.filter((w) => w.category === category);
  if (warnings.length === 0) {
    return <RiskIndicator level="green" description={greenDescription} />;
  }
  if (warnings.some((warning) => warning.level === 'alert')) {
    return (
      <RiskIndicator
        level="red"
        description={isBatched ? `One or more markets have: ${redDescription}` : redDescription}
      />
    );
  } else
    return (
      <RiskIndicator
        level="yellow"
        description={
          isBatched ? `One or more markets have: ${yellowDescription}` : yellowDescription
        }
      />
    );
}

export function MarketAssetIndicator({
  market,
  isBatched = false,
}: {
  market: { warningsWithDetail: WarningWithDetail[] };
  isBatched?: boolean;
}) {
  return (
    <RiskIndicatorFromWarning
      market={market}
      category={WarningCategory.asset}
      greenDescription="Recognized assets"
      yellowDescription="Some warnings flagged with the assets"
      redDescription="Potentially dangerous assets"
      isBatched={isBatched}
    />
  );
}

export function MarketOracleIndicator({
  market,
  isBatched = false,
}: {
  market: { warningsWithDetail: WarningWithDetail[] };
  isBatched?: boolean;
}) {
  return (
    <RiskIndicatorFromWarning
      market={market}
      category={WarningCategory.oracle}
      greenDescription="Recognized oracles"
      yellowDescription="Some warnings flagged with the oracle"
      redDescription="Some alerts flagged with the oracle"
      isBatched={isBatched}
    />
  );
}

export function MarketDebtIndicator({
  market,
  isBatched = false,
}: {
  market: { warningsWithDetail: WarningWithDetail[] };
  isBatched?: boolean;
}) {
  return (
    <RiskIndicatorFromWarning
      market={market}
      category={WarningCategory.debt}
      greenDescription="No bad debt"
      yellowDescription="Bad debt has occurred"
      redDescription="Bad debt higher than 1% of supply"
      isBatched={isBatched}
    />
  );
}