From 71aa5edf5d3bb7da74299c9b87f348da6a3fbc7c Mon Sep 17 00:00:00 2001
From: Myrto Kontouli <myrto.kontouli@atomlearning.co.uk>
Date: Wed, 26 Jul 2023 21:09:57 +0100
Subject: [PATCH] refactor: rename OptionallyVisuallyHiddenContainer to
 OptionalVisuallyHiddenWrapper to match naming to CSSWrapper and make more
 grammatical sense

---
 .../data-table/DataTableGlobalFilter.tsx      |  6 ++--
 .../OptionalVisuallyHiddenWrapper.test.tsx    | 30 +++++++++++++++++++
 .../OptionalVisuallyHiddenWrapper.tsx}        |  4 ++-
 ...tionalVisuallyHiddenWrapper.test.tsx.snap} |  4 +--
 .../optional-visually-hidden-wrapper/index.ts |  1 +
 ...OptionallyVisuallyHiddenContainer.test.tsx | 26 ----------------
 .../index.ts                                  |  1 -
 7 files changed, 39 insertions(+), 33 deletions(-)
 create mode 100644 lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.test.tsx
 rename lib/src/utilities/{optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.tsx => optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.tsx} (76%)
 rename lib/src/utilities/{optionally-visually-hidden-container/__snapshots__/OptionallyVisuallyHiddenContainer.test.tsx.snap => optional-visually-hidden-wrapper/__snapshots__/OptionalVisuallyHiddenWrapper.test.tsx.snap} (69%)
 create mode 100644 lib/src/utilities/optional-visually-hidden-wrapper/index.ts
 delete mode 100644 lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.test.tsx
 delete mode 100644 lib/src/utilities/optionally-visually-hidden-container/index.ts

diff --git a/lib/src/components/data-table/DataTableGlobalFilter.tsx b/lib/src/components/data-table/DataTableGlobalFilter.tsx
index 4706e0d8c..7e6f1ff39 100644
--- a/lib/src/components/data-table/DataTableGlobalFilter.tsx
+++ b/lib/src/components/data-table/DataTableGlobalFilter.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { debounce } from 'throttle-debounce'
 
-import { OptionallyVisuallyHiddenContainer } from '../../utilities/optionally-visually-hidden-container'
+import { OptionalVisuallyHiddenWrapper } from '../../utilities/optional-visually-hidden-wrapper'
 import { Label } from '../label'
 import { SearchInput } from '../search-input'
 import { AsyncDataState } from './DataTable.types'
@@ -43,11 +43,11 @@ export const DataTableGlobalFilter: React.FC<DataTableSearchProps> = ({
 
   return (
     <>
-      <OptionallyVisuallyHiddenContainer hidden={hideLabel}>
+      <OptionalVisuallyHiddenWrapper hidden={hideLabel}>
         <Label css={{ mb: '$3' }} htmlFor={label}>
           {label}
         </Label>
-      </OptionallyVisuallyHiddenContainer>
+      </OptionalVisuallyHiddenWrapper>
       <SearchInput
         {...props}
         defaultValue={globalFilter}
diff --git a/lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.test.tsx b/lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.test.tsx
new file mode 100644
index 000000000..72ef628a8
--- /dev/null
+++ b/lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.test.tsx
@@ -0,0 +1,30 @@
+import { render } from '@testing-library/react'
+import * as React from 'react'
+
+import { OptionalVisuallyHiddenWrapper } from '.'
+
+const OptionalVisuallyHiddenWrapperImplementation = (props) => {
+  return (
+    <OptionalVisuallyHiddenWrapper {...props}>
+      <p>hello</p>
+    </OptionalVisuallyHiddenWrapper>
+  )
+}
+
+describe('OptionalVisuallyHidden component', () => {
+  it('renders hidden content', async () => {
+    const { container } = render(
+      <OptionalVisuallyHiddenWrapperImplementation hidden />
+    )
+
+    expect(container).toMatchSnapshot()
+  })
+
+  it('renders visible content', async () => {
+    const { container } = render(
+      <OptionalVisuallyHiddenWrapperImplementation />
+    )
+
+    expect(container).toMatchSnapshot()
+  })
+})
diff --git a/lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.tsx b/lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.tsx
similarity index 76%
rename from lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.tsx
rename to lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.tsx
index 0182da652..b15e177b6 100644
--- a/lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.tsx
+++ b/lib/src/utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.tsx
@@ -1,7 +1,7 @@
 import * as VisuallyHidden from '@radix-ui/react-visually-hidden'
 import * as React from 'react'
 
-export const OptionallyVisuallyHiddenContainer: React.FC<{
+export const OptionalVisuallyHiddenWrapper: React.FC<{
   hidden?: boolean
 }> = ({ children, hidden = false }) => {
   if (hidden) return <VisuallyHidden.Root>{children}</VisuallyHidden.Root>
@@ -13,3 +13,5 @@ export const OptionallyVisuallyHiddenContainer: React.FC<{
     <>{children}</>
   ) : null
 }
+
+OptionalVisuallyHiddenWrapper.displayName = 'OptionalVisuallyHiddenWrapper'
diff --git a/lib/src/utilities/optionally-visually-hidden-container/__snapshots__/OptionallyVisuallyHiddenContainer.test.tsx.snap b/lib/src/utilities/optional-visually-hidden-wrapper/__snapshots__/OptionalVisuallyHiddenWrapper.test.tsx.snap
similarity index 69%
rename from lib/src/utilities/optionally-visually-hidden-container/__snapshots__/OptionallyVisuallyHiddenContainer.test.tsx.snap
rename to lib/src/utilities/optional-visually-hidden-wrapper/__snapshots__/OptionalVisuallyHiddenWrapper.test.tsx.snap
index 4a0768755..649270c71 100644
--- a/lib/src/utilities/optionally-visually-hidden-container/__snapshots__/OptionallyVisuallyHiddenContainer.test.tsx.snap
+++ b/lib/src/utilities/optional-visually-hidden-wrapper/__snapshots__/OptionalVisuallyHiddenWrapper.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`TopBar component renders hidden content 1`] = `
+exports[`OptionalVisuallyHidden component renders hidden content 1`] = `
 <div>
   <span
     style="position: absolute; border: 0px; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; word-wrap: normal;"
@@ -12,7 +12,7 @@ exports[`TopBar component renders hidden content 1`] = `
 </div>
 `;
 
-exports[`TopBar component renders visible content 1`] = `
+exports[`OptionalVisuallyHidden component renders visible content 1`] = `
 <div>
   <p>
     hello
diff --git a/lib/src/utilities/optional-visually-hidden-wrapper/index.ts b/lib/src/utilities/optional-visually-hidden-wrapper/index.ts
new file mode 100644
index 000000000..9dd0c19e9
--- /dev/null
+++ b/lib/src/utilities/optional-visually-hidden-wrapper/index.ts
@@ -0,0 +1 @@
+export { OptionalVisuallyHiddenWrapper } from './OptionalVisuallyHiddenWrapper'
diff --git a/lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.test.tsx b/lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.test.tsx
deleted file mode 100644
index fd3a81cfe..000000000
--- a/lib/src/utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.test.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import { render, screen } from '@testing-library/react'
-import * as React from 'react'
-
-import { OptionallyVisuallyHiddenContainer } from '.'
-
-describe('TopBar component', () => {
-  it('renders hidden content', async () => {
-    const { container } = render(
-      <OptionallyVisuallyHiddenContainer hidden>
-        <p>hello</p>
-      </OptionallyVisuallyHiddenContainer>
-    )
-
-    expect(container).toMatchSnapshot()
-  })
-
-  it('renders visible content', async () => {
-    const { container } = render(
-      <OptionallyVisuallyHiddenContainer>
-        <p>hello</p>
-      </OptionallyVisuallyHiddenContainer>
-    )
-
-    expect(container).toMatchSnapshot()
-  })
-})
diff --git a/lib/src/utilities/optionally-visually-hidden-container/index.ts b/lib/src/utilities/optionally-visually-hidden-container/index.ts
deleted file mode 100644
index 0cdd2a69c..000000000
--- a/lib/src/utilities/optionally-visually-hidden-container/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { OptionallyVisuallyHiddenContainer } from './OptionallyVisuallyHiddenContainer'