function formatNumber(value, digits = 3) {
  return Number(value ?? 0).toFixed(digits);
}

export function formatParameterValue(parameterType, value) {
  if (parameterType === "float") {
    return formatNumber(value);
  }
  if (parameterType === "vec2" || parameterType === "color") {
    return (value ?? []).map((item) => formatNumber(item)).join(", ");
  }
  if (parameterType === "bool") {
    return value ? "Enabled" : "Disabled";
  }
  if (parameterType === "trigger") {
    return `Triggered ${Number(value ?? 0)} time${Number(value ?? 0) === 1 ? "" : "s"}`;
  }
  return `${value ?? ""}`;
}

export function ParameterValueDisplay({ parameterType, value, pending }) {
  const valueText = formatParameterValue(parameterType, value);
  return (
    <div className={`parameter__value${pending ? " parameter__value--pending" : ""}`}>
      {pending ? `Applied: ${valueText}` : valueText}
    </div>
  );
}