ramda#or JavaScript Examples

SignedForLabTestContainer = () => {
  const { goTo } = useNavigation();
  const { isSubscriptionConfirmed } = useLabTest();
  const { isTriageEnMiddle, isTriageEnHigh } = useTriage();

  const handleLabTestResult = () => goTo(Routes.LabTestResult);

  const installPath = (() => {
    if (isIOSWebView()) {
      return 'https://apps.apple.com/pl/app/kwarantanna-domowa/id1502997499?l=pl';
    }

    return 'https://play.google.com/store/apps/details?id=pl.nask.droid.kwarantannadomowa';
  })();

  if (and(or(isTriageEnMiddle, isTriageEnHigh), isSubscriptionConfirmed)) {
    return <SignedForLabTest installPath={installPath} handleLabTestResult={handleLabTestResult} />;
  }

  return null;
}

ToggleButtonContainer = ({ active, onClick }) => {
  const { isTriageEnMiddle, isTriageEnHigh } = useTriage();

  const color = (() => {
    if (and(or(isTriageEnMiddle, isTriageEnHigh), not(active))) {
      return Color.white;
    }

    return Color.primary;
  })();

  return <ToggleButton onClick={onClick} color={color} active={active} />;
}

ExposureNotificationContactDetectionContainer = () => {
  const { goTo } = useNavigation();
  const { onClose } = useModalContext();
  const { occurredHighEn, occurredMiddleEn } = useExposureNotification();

  const handleReceiveLabTest = () => {
    onClose();
    goTo(Routes.LabTest);
  };

  const handleBack = () => {
    onClose();
    goTo(Routes.Home);
  };

  const resolveData = () => {
    if (occurredHighEn) {
      return { color: Color.red, icon: <EnHighIcon /> };
    }
    if (occurredMiddleEn) {
      return { color: Color.info, icon: <EnMiddleIcon /> };
    }

    return { color: Color.white, icon: null };
  };

  const renderComponent = () => (
    <ExposureNotificationContactDetection
      data={resolveData()}
      handleReceiveLabTest={handleReceiveLabTest}
      handleBack={handleBack}
    />
  );
  const renderEmptyView = () => null;

  return ifElse(() => or(occurredHighEn, occurredMiddleEn), renderComponent, renderEmptyView)();
}

SummaryRiskTest = () => {
  const { isEnHigh, isTorMiddle, isEnMiddle } = useHealthStats();
  const { isSubscriptionInProgress } = useLabTest();
  const isTorHigh = useTorHigh();

  const resolveView = () => {
    if (not(isSubscriptionInProgress) && (isEnMiddle || isEnHigh) && or(isTorMiddle, isTorHigh)) {
      return <LabTestReady />;
    }
    return <SimpleResult />;
  };

  return (
    <Layout hideBackButton fullHeight hideBell>
      <Styled.SummaryRiskTest data-cy="view-summary-risk-test">{resolveView()}</Styled.SummaryRiskTest>
    </Layout>
  );
}

SimpleResultContainer = () => {
  const { isTorLow, isTorMiddle, isEnMiddle, isEnHigh, noEn } = useHealthStats();
  const { isSubscriptionInProgress } = useLabTest();
  const isTorHigh = useTorHigh();

  const resolveParagraphsLabels = () => {
    if (isTorHigh) {
      return [
        'summary_risk_test_description_2_1',
        'summary_risk_test_description_2_2',
        'summary_risk_test_description_2_3'
      ];
    }

    if (isTorMiddle) {
      return ['summary_risk_test_description_3_1', 'summary_risk_test_description_2_2'];
    }

    if (isTorLow) {
      if (not(isSubscriptionInProgress) && or(isEnMiddle, isEnHigh)) {
        return ['summary_risk_test_description_3_1', 'summary_risk_test_description_2_2'];
      }

      return ['summary_risk_test_description_3_1'];
    }
    return [];
  };

  const resolveTitle = () => {
    if (noEn) {
      return <T i18nKey="summary_risk_test_title_2" />;
    }
    return <T i18nKey="summary_risk_test_title_3" />;
  };

  return <SimpleResult paragraphsLabels={resolveParagraphsLabels()} title={resolveTitle()} />;
}

CurrentStateTextContainer = ({ hideContactDetectedText }) => {
  const { isCovidConfirmed, isCovidManual } = useHealthStats();
  const { isSubscriptionConfirmed } = useLabTest();
  const {
    isTriageTorLow,
    isTriageTorMiddle,
    isTriageTorHighNoCovid,
    isTriageTorHighCovid,
    isTriageEnLow,
    isTriageEnMiddle,
    isTriageEnHigh,
    isTriageTorMiddleEnLow,
    isTriageTorHighNoCovidEnLow,
    isTriageTorHighCovidEnLow
  } = useTriage();

  const currentState = (() => {
    if (isSubscriptionConfirmed) {
      return 'result_analysis_variant_9';
    }
    if (isCovidConfirmed) {
      return 'result_analysis_variant_8';
    }
    if (isCovidManual) {
      return 'result_analysis_variant_7';
    }

    if (or(isTriageTorLow, isTriageEnLow)) {
      return 'result_analysis_variant_2';
    }

    if (or(or(isTriageTorMiddle, isTriageEnMiddle), isTriageTorMiddleEnLow)) {
      return 'result_analysis_variant_3';
    }

    if (
      or(
        or(or(isTriageTorHighNoCovid, isTriageTorHighCovid), or(isTriageEnHigh, isTriageTorHighNoCovidEnLow)),
        isTriageTorHighCovidEnLow
      )
    ) {
      return 'result_analysis_variant_4';
    }

    return 'result_analysis_variant_1';
  })();

  const contactDetected = (() => {
    if (hideContactDetectedText) {
      return undefined;
    }

    if (or(isTriageEnMiddle, isTriageEnHigh)) {
      return 'result_analysis_variant_10';
    }

    return undefined;
  })();

  return <CurrentStateText contactDetected={contactDetected} currentState={currentState} />;
}

CustomCallToActionButtonContainer = () => {
  const { goTo } = useNavigation();
  const { isSubscriptionConfirmed } = useLabTest();
  const { isCovidConfirmed, isCovidManual } = useHealthStats();
  const {
    isTriageTorLow,
    isTriageTorMiddle,
    isTriageTorHighNoCovid,
    isTriageTorHighCovid,
    isTriageEnLow,
    isTriageEnMiddle,
    isTriageEnHigh,
    isTriageTorMiddleEnLow,
    isTriageTorHighNoCovidEnLow,
    isTriageTorHighCovidEnLow
  } = useTriage();

  const recommendationsText = <T i18nKey="result_analysis_text_26" />;
  const recommendationsAction = component => () => goTo(Routes.Recommendations, { component });
  const torText = <T i18nKey="result_analysis_text_4" />;
  const torAction = () => goTo(Routes.Diagnosis);

  const createData = (action, text) => ({ action, text });

  const data = (() => {
    if (isCovidConfirmed) {
      return createData(recommendationsAction(RecommendationsComponents.SickApprove), recommendationsText);
    }
    if (isCovidManual) {
      return createData(recommendationsAction(RecommendationsComponents.SickReported), recommendationsText);
    }

    if (isTriageTorLow) {
      return null;
    }
    if (or(isTriageTorMiddle, isTriageTorMiddleEnLow)) {
      return createData(recommendationsAction(RecommendationsComponents.RiskTestMiddle), recommendationsText);
    }
    if (or(isTriageTorHighNoCovid, isTriageTorHighNoCovidEnLow)) {
      return createData(recommendationsAction(RecommendationsComponents.RiskTestHighNoCovid), recommendationsText);
    }
    if (or(isTriageTorHighCovid, isTriageTorHighCovidEnLow)) {
      return createData(recommendationsAction(RecommendationsComponents.RiskTestHighCovid), recommendationsText);
    }

    if (isTriageEnLow) {
      return null;
    }
    if (and(isTriageEnMiddle, isSubscriptionConfirmed)) {
      return createData(recommendationsAction(RecommendationsComponents.ExposureMiddle), recommendationsText);
    }
    if (and(isTriageEnMiddle, not(isSubscriptionConfirmed))) {
      return createData(recommendationsAction(RecommendationsComponents.ExposureMiddle), recommendationsText);
    }
    if (and(isTriageEnHigh, isSubscriptionConfirmed)) {
      return createData(recommendationsAction(RecommendationsComponents.ExposureHighPinApprove), recommendationsText);
    }
    if (and(isTriageEnHigh, not(isSubscriptionConfirmed))) {
      return createData(recommendationsAction(RecommendationsComponents.ExposureHigh), recommendationsText);
    }
    return createData(torAction, torText);
  })();

  if (data === null) {
    return null;
  }

  return <CustomCallToActionButton text={data.text} action={data.action} />;
}

IconContainer = () => {
  const { isCovidConfirmed, isCovidManual } = useHealthStats();
  const {
    isTriageTorLow,
    isTriageTorMiddle,
    isTriageTorHighNoCovid,
    isTriageTorHighCovid,
    isTriageEnLow,
    isTriageEnMiddle,
    isTriageEnHigh,
    isTriageTorMiddleEnLow,
    isTriageTorHighNoCovidEnLow,
    isTriageTorHighCovidEnLow
  } = useTriage();

  const icon = (() => {
    if (or(isCovidConfirmed, isCovidManual)) {
      return <VirusHigh />;
    }

    if (isTriageTorLow) {
      return <FaceLow />;
    }

    if (or(isTriageTorMiddle, isTriageTorMiddleEnLow)) {
      return <FaceMiddle />;
    }

    if (
      or(or(isTriageTorHighNoCovid, isTriageTorHighCovid), or(isTriageTorHighNoCovidEnLow, isTriageTorHighCovidEnLow))
    ) {
      return <FaceHigh />;
    }
    if (isTriageEnLow) {
      return <ENLow />;
    }
    if (isTriageEnMiddle) {
      return <ENMiddle />;
    }
    if (isTriageEnHigh) {
      return <ENHigh />;
    }

    return null;
  })();

  const isBig = or(isTriageEnMiddle, isTriageEnHigh);

  if (icon === null) {
    return null;
  }

  return <Icon icon={icon} isBig={isBig} />;
}

ResultAnalysisWrapperContainer = ({ children }) => {
  const { isCovidConfirmed, isCovidManual } = useHealthStats();
  const {
    isTriageTorLow,
    isTriageTorMiddle,
    isTriageTorHighNoCovid,
    isTriageTorHighCovid,
    isTriageEnLow,
    isTriageEnMiddle,
    isTriageEnHigh,
    isTriageTorMiddleEnLow,
    isTriageTorHighNoCovidEnLow,
    isTriageTorHighCovidEnLow
  } = useTriage();

  const resolvePipeColor = () => {
    if (or(isCovidConfirmed, isCovidManual)) {
      return Color.red;
    }
    if (
      or(
        or(or(isTriageTorHighNoCovid, isTriageTorHighCovid), or(isTriageEnHigh, isTriageTorHighNoCovidEnLow)),
        isTriageTorHighCovidEnLow
      )
    ) {
      return Color.red;
    }
    if (isTriageEnMiddle) {
      return Color.info;
    }
    if (or(isTriageTorMiddle, isTriageTorMiddleEnLow)) {
      return Color.info;
    }
    if (or(isTriageTorLow, isTriageEnLow)) {
      return Color.green_1;
    }

    return Color.gradient_c2;
  };

  const resolveBackgroundColor = () => {
    if (isTriageEnMiddle) {
      return Color.info;
    }
    if (isTriageEnHigh) {
      return Color.red;
    }
    return Color.white;
  };

  const resolveFontColor = () => {
    if (or(isTriageEnMiddle, isTriageEnHigh)) {
      return Color.white;
    }
    return Color.black;
  };

  return (
    <ResultAnalysisWrapper
      pipeColor={resolvePipeColor()}
      backgroundColor={resolveBackgroundColor()}
      fontColor={resolveFontColor()}
    >
      {children}
    </ResultAnalysisWrapper>
  );
}

useTorHigh = () => {
  const { isTorHighNoCovid, isTorHigCovid } = useHealthStats();

  return or(isTorHighNoCovid, isTorHigCovid);
}