message: t()

in frontend/src/containers/AddMetric.tsx [58:176]


          message: t("AddMetricScreen.MetricSuccessfullyAdded"),
        },
        metrics: newMetrics,
        showTitle: state.showTitle !== false,
        oneMetricPerRow: state.oneMetricPerRow === true,
        metricTitle: state.metricTitle || "",
        datasetType: state.datasetType || undefined,
      }
    );
  };

  const handlePercentage = (e: React.ChangeEvent<HTMLInputElement>) => {
    if (e.target.value === "Percentage") {
      setsymbolType("Percentage");
    } else if (e.target.value === "Currency") {
      setsymbolType("Currency");
    } else if (e.target.value === "") {
      setsymbolType("SelectAnOption");
    }
  };

  const onCancel = () => {
    history.push(
      (state && state.origin) || `/admin/dashboard/${dashboardId}/add-metrics`,
      {
        metrics: state && state.metrics ? [...state.metrics] : [],
        showTitle: state && state.showTitle !== false,
        oneMetricPerRow: state && state.oneMetricPerRow === true,
        metricTitle: (state && state.metricTitle) || "",
        datasetType: state.datasetType || undefined,
      }
    );
  };

  if (!state || !state.metrics) {
    setTimeout(onCancel, 1000);
    return null;
  }

  const crumbs = [
    {
      label: t("Dashboards"),
      url: "/admin/dashboards",
    },
    {
      label: dashboard?.name,
      url: `/admin/dashboard/edit/${dashboardId}`,
    },
  ];

  if (!loading) {
    crumbs.push({
      label: t("AddMetricScreen.AddMetric"),
      url: "",
    });
  }

  return (
    <>
      <Breadcrumbs crumbs={crumbs} />

      {loading || loadingSettings ? (
        <Spinner
          className="text-center margin-top-9"
          label={t("LoadingSpinnerLabel")}
        />
      ) : (
        <>
          <div className="grid-row">
            <div className="grid-col-auto">
              <PrimaryActionBar>
                <h1 id="addMetricFormHeader" className="margin-top-0">
                  {t("AddMetricScreen.AddMetric")}
                </h1>

                <form
                  aria-labelledby="addMetricFormHeader"
                  onSubmit={handleSubmit(onSubmit)}
                  className="usa-form usa-form--large"
                  data-testid="AddMetricForm"
                >
                  <fieldset className="usa-fieldset">
                    <legend className="usa-hint grid-col-6">
                      {t("AddMetricScreen.Configure")}
                    </legend>

                    <TextField
                      id="title"
                      name="title"
                      label={t("AddMetricScreen.MetricTitle")}
                      hint={t("AddMetricScreen.MetricTitleHint")}
                      register={register}
                      error={
                        errors.title && t("AddMetricScreen.MetricTitleError")
                      }
                      required
                    />
                    <NumberField
                      id="value"
                      name="value"
                      label={t("AddMetricScreen.MetricValue")}
                      hint={t("AddMetricScreen.MetricValueHint")}
                      register={register}
                      error={
                        errors.value && t("AddMetricScreen.MetricValueError")
                      }
                      className="width-50"
                      step={0.01}
                      required
                    />

                    <Dropdown
                      id="percentage"
                      name="percentage"
                      label={t("NumberFormat")}
                      hint={t("AddMetricScreen.MetricFormatHint")}
                      options={[
                        { value: "", label: t("SelectAnOption") },
                        {