Merge pull request #481 from mg3-codes/bool-value-rendering

0.5.7

CHANGELOG.md

@@ -2,6 +2,9 @@
 
 # Changelog
 
+## 0.5.7
+-   Fix boolean value rendering
+
 ## 0.5.6
 -   Upgrade to React 19
 -   Upgrade to AG Grid 33

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "dnd-spell-organizer",
 	"license": "MIT",
-	"version": "0.5.6",
+	"version": "0.5.7",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",

src/components/footer/index.tsx

@@ -61,7 +61,7 @@ const Footer = () => {
 
 	return (
 		<div className="footer">
-			<span className="version">Version: 0.5.6</span>
+			<span className="version">Version: 0.5.7</span>
 			<div className="links">
 				<Button variant="link" onClick={openHelpModal}>
 					Help

src/main.tsx

@@ -29,7 +29,7 @@ const rollbarConfig = {
 	enabled: import.meta.env.MODE === "production",
 	captureUncaught: true,
 	captureUnhandledRejections: true,
-	code_version: "0.5.6",
+	code_version: "0.5.7",
 	source_map_enabled: true,
 };
 

src/utility/cell-renderers.tsx

@@ -0,0 +1,15 @@
+/**
+ * @author Michael Gamlem III
+ * @copyright This file is subject to the terms and conditions defined in file 'LICENSE', which is part of the source code for this project.
+ * @format
+ */
+
+import type { CustomCellRendererProps } from "ag-grid-react";
+
+export const booleanCellRenderer = (
+	props: CustomCellRendererProps<boolean>,
+): React.ReactElement => (
+	<div className="d-flex justify-content-center align-items-center h-100 p-0">
+		{props?.value ? "✅" : "❌"}
+	</div>
+);

src/utility/table-defaults.ts

@@ -26,7 +26,7 @@ import SourceFilter from "../components/filters/source-filter/source-filter";
 import { Column, mapColumnToDisplayName } from "../enums/columns";
 import type Spell from "../types/spell";
 import type { TableRow } from "../types/table-row";
-
+import { booleanCellRenderer } from "./cell-renderers";
 import { areaValueComparator } from "./comparators";
 import {
 	rangeTooltipValueGetter,
@@ -35,7 +35,6 @@ import {
 import {
 	areaValueFormatter,
 	attackValueFormatter,
-	booleanValueFormatter,
 	castingTimeValueFormatter,
 	damageTypeValueFormatter,
 	durationValueFormatter,
@@ -186,7 +185,7 @@ export const getDefaultColumnDefinitions = (
 		filterParams: {
 			spellPropertyName: "ritual",
 		},
-		valueFormatter: booleanValueFormatter,
+		cellRenderer: booleanCellRenderer,
 		initialWidth: 100,
 		hide: defaultColumnIsHidden(Column.Ritual),
 	},
@@ -197,7 +196,7 @@ export const getDefaultColumnDefinitions = (
 		filterParams: {
 			spellPropertyName: "concentration",
 		},
-		valueFormatter: booleanValueFormatter,
+		cellRenderer: booleanCellRenderer,
 		initialWidth: 150,
 		hide: defaultColumnIsHidden(Column.Concentration),
 	},
@@ -208,7 +207,7 @@ export const getDefaultColumnDefinitions = (
 		filterParams: {
 			spellPropertyName: "verbal",
 		},
-		valueFormatter: booleanValueFormatter,
+		cellRenderer: booleanCellRenderer,
 		initialWidth: 100,
 		hide: defaultColumnIsHidden(Column.Verbal),
 	},
@@ -219,7 +218,7 @@ export const getDefaultColumnDefinitions = (
 			spellPropertyName: "somatic",
 		},
 		filter: BooleanFilter,
-		valueFormatter: booleanValueFormatter,
+		cellRenderer: booleanCellRenderer,
 		initialWidth: 110,
 		hide: defaultColumnIsHidden(Column.Somatic),
 	},

src/utility/value-formatters.ts

@@ -46,10 +46,6 @@ export const attackValueFormatter = (
 	return params.value === 0 ? "" : mapNumberToAttackDisplayName(params.value);
 };
 
-export const booleanValueFormatter = (
-	params: ValueFormatterParams<boolean>,
-): string => (params.value === true ? "✅" : "❌");
-
 export const castingTimeValueFormatter = (
 	params: ValueFormatterParams<Spell, number>,
 ): string => {