📝 - docs: further improvements to Kanban(Template) stories

maykinmedia · Oct 18, 2024 · 7fc5c69 · 7fc5c69
1 parent ae1780b
commit 7fc5c69
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 8 deletions.
diff --git a/src/components/data/kanban/kanban.stories.tsx b/src/components/data/kanban/kanban.stories.tsx
@@ -66,7 +66,7 @@ export const AdditionalFields: Story = {
   },
 };
 
-export const WithCustomPreview: Story = {
+export const CustomPreview: Story = {
   ...KanbanComponent,
   // @ts-expect-error - Fix never
   args: {
@@ -76,6 +76,7 @@ export const WithCustomPreview: Story = {
         alt={attributeData.title}
         src="/static/maykin_logo.png"
         height="24"
+        style={{ objectFit: "contain" }}
       />
     ),
   },

diff --git a/src/components/data/kanban/kanban.tsx b/src/components/data/kanban/kanban.tsx
@@ -331,7 +331,7 @@ export const KanbanSection: React.FC<KanbanSectionProps> = ({
     >
       {fieldset[0] && (
         <Toolbar directionResponsive={false} pad={false} variant="transparent">
-          <H3>{fieldset[0]}</H3>
+          <H3>{field2Title(fieldset[0])}</H3>
           <Badge rounded>{objectList.length}</Badge>
         </Toolbar>
       )}

diff --git a/src/lib/format/string.ts b/src/lib/format/string.ts
@@ -17,10 +17,16 @@ export const addSpaces = (string: string) =>
 
 /**
  * Converts "fieldName" to "Field name".
- * @param field
+ * @deprecated Use `field2title` instead.
  */
-export const field2Caption = (field: string): string =>
-  ucFirst(unHyphen(addSpaces(field)));
+export const field2Caption = (field: string): string => {
+  if (process && process?.env?.NODE_ENV !== "production") {
+    console.warn(
+      "DEPRECATION: `field2Caption` is deprecated, use `field2Title` instead.",
+    );
+  }
+  return ucFirst(unHyphen(addSpaces(field)));
+};
 
 interface Field2TitleOptions {
   addSpaces?: boolean;

diff --git a/src/templates/kanban/kanban.stories.tsx b/src/templates/kanban/kanban.stories.tsx
@@ -3,9 +3,9 @@ import * as React from "react";
 
 import { Badge, Outline } from "../../components";
 import {
+  CustomPreview as CustomPreviewComponentStory,
   Draggable as DraggableComponentStory,
   KanbanComponent as KanbanComponentStory,
-  WithCustomPreview as WithCustomPreviewComponentStory,
   WithToolbar as WithToolbarComponentStory,
 } from "../../components/data/kanban/kanban.stories";
 import { KanbanTemplate } from "./kanban";
@@ -120,11 +120,11 @@ export const WithSecondaryNavigation: Story = {
   },
 };
 
-export const WithCustomPreview: Story = {
+export const CustomPreview: Story = {
   ...kanbanTemplate,
   args: {
     ...kanbanTemplate.args,
-    kanbanProps: WithCustomPreviewComponentStory.args,
+    kanbanProps: CustomPreviewComponentStory.args,
   },
 };