diff --git a/www/src/components/Table/ColumnMenu/Settings/index.tsx b/www/src/components/Table/ColumnMenu/Settings/index.tsx
index 7864f682..771d64be 100644
--- a/www/src/components/Table/ColumnMenu/Settings/index.tsx
+++ b/www/src/components/Table/ColumnMenu/Settings/index.tsx
@@ -126,7 +126,7 @@ const ConfigFields = ({ fieldType, config, handleChange, tables, columns }) => {
defaultValue={5}
value={config.max}
getAriaValueText={(v) => `${v} max stars`}
- aria-labelledby="discrete-slider"
+ aria-labelledby="max-slider"
valueLabelDisplay="auto"
onChange={(_, v) => {
handleChange("max")(v);
@@ -136,6 +136,21 @@ const ConfigFields = ({ fieldType, config, handleChange, tables, columns }) => {
min={1}
max={15}
/>
+ Slider precision stars
+ `${v} rating step size`}
+ aria-labelledby="precision-slider"
+ valueLabelDisplay="auto"
+ onChange={(_, v) => {
+ handleChange("precision")(v);
+ }}
+ step={0.25}
+ marks
+ min={0.25}
+ max={1}
+ />
>
);
case FieldType.action:
diff --git a/www/src/components/Table/formatters/Rating.tsx b/www/src/components/Table/formatters/Rating.tsx
index dc59c075..5e56b082 100644
--- a/www/src/components/Table/formatters/Rating.tsx
+++ b/www/src/components/Table/formatters/Rating.tsx
@@ -19,7 +19,10 @@ export default function Rating({
onSubmit,
}: CustomCellProps) {
const classes = useStyles();
- const { max } = (column as any).config as { max: number };
+ const { max, precision } = (column as any).config as {
+ max: number;
+ precision: number;
+ };
return (
}
// TODO: Make this customisable in config
max={max ?? 5}
+ precision={precision ?? 1}
classes={{ root: classes.rating, iconEmpty: classes.iconEmpty }}
/>
);