From 2435a1a1bac63493d948e33594ce0ce00bcfa997 Mon Sep 17 00:00:00 2001
From: "Israel.Molestina" <molestinaisrael@gmail.com>
Date: Fri, 3 Feb 2023 14:31:11 -0500
Subject: [PATCH 1/2] converted to typescript

---
 .../pb_stat_value/{_stat_value.jsx => _stat_value.tsx} | 10 ++++------
 .../playbook/pb_stat_value/docs/_stat_value_unit.jsx   |  2 +-
 .../pb_kits/playbook/pb_stat_value/stat_value.test.js  |  0
 3 files changed, 5 insertions(+), 7 deletions(-)
 rename playbook/app/pb_kits/playbook/pb_stat_value/{_stat_value.jsx => _stat_value.tsx} (82%)
 create mode 100644 playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js

diff --git a/playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.jsx b/playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.tsx
similarity index 82%
rename from playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.jsx
rename to playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.tsx
index b156538ebd..2c43da70ef 100644
--- a/playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.jsx
+++ b/playbook/app/pb_kits/playbook/pb_stat_value/_stat_value.tsx
@@ -1,5 +1,3 @@
-/* @flow */
-
 import React from 'react'
 import classnames from 'classnames'
 
@@ -10,10 +8,10 @@ type StatValueProps = {
   className?: string,
   id?: string,
   unit?: string,
-  value: string | number
+  value: string | number,
 }
 
-const StatValue = (props: StatValueProps) => {
+const StatValue = (props: StatValueProps): React.ReactElement => {
   const {
     className,
     id,
@@ -21,7 +19,7 @@ const StatValue = (props: StatValueProps) => {
     value = 0,
   } = props
 
-  const displayValue = function(value) {
+  const displayValue = function(value: string | number) {
     if (value || value === 0) {
       return (
         <Title
@@ -33,7 +31,7 @@ const StatValue = (props: StatValueProps) => {
     }
   }
 
-  const displayUnit = function(unit) {
+  const displayUnit = function(unit: string) {
     if (unit) {
       return (
         <Title
diff --git a/playbook/app/pb_kits/playbook/pb_stat_value/docs/_stat_value_unit.jsx b/playbook/app/pb_kits/playbook/pb_stat_value/docs/_stat_value_unit.jsx
index 398521e903..cc39c690a2 100644
--- a/playbook/app/pb_kits/playbook/pb_stat_value/docs/_stat_value_unit.jsx
+++ b/playbook/app/pb_kits/playbook/pb_stat_value/docs/_stat_value_unit.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import StatValue from '../_stat_value.jsx'
+import StatValue from '../_stat_value'
 
 const StatValueUnit = (props) => {
   return (
diff --git a/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js b/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js
new file mode 100644
index 0000000000..e69de29bb2

From c6fad84203ec7b82fa1a6cf66d623732b17c990d Mon Sep 17 00:00:00 2001
From: "Israel.Molestina" <molestinaisrael@gmail.com>
Date: Fri, 3 Feb 2023 14:37:04 -0500
Subject: [PATCH 2/2] added tests

---
 .../playbook/pb_stat_value/stat_value.test.js | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js b/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js
index e69de29bb2..2dd72972bb 100644
--- a/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js
+++ b/playbook/app/pb_kits/playbook/pb_stat_value/stat_value.test.js
@@ -0,0 +1,27 @@
+import React from 'react'
+import { render, screen } from '../utilities/test-utils'
+
+import StatValue from './_stat_value'
+
+test('it renders the component with the value', () => {
+  render(
+    <StatValue
+        value={1048}
+    />
+  )
+
+  const kit = screen.getByText('1048')
+  expect(kit).toBeTruthy()
+})
+
+test('it renders the component with the unit', () => {
+  render(
+    <StatValue
+        unit="appt"
+        value="5,294"
+    />
+  )
+
+  const kit = screen.getByText('appt')
+  expect(kit).toBeTruthy()
+})
\ No newline at end of file