Sure! Here is a commit message based on the given diff:

"Refactor import paths for ErrorBoundary and Loading components to use index.tsx. Also updated the DisplayStyle in ErrorBoundary to use grid layout for centering. Updated import paths across

src/App.tsx

@@ -6,8 +6,8 @@ import { PersistGate as ReduxPersistGate } from 'redux-persist/integration/react
 
 import './global.css'
 
-import ErrorBoundary from './components/ErrorBoundary/ErrorBoundary'
-import Loading from './components/Loading/Loading'
+import ErrorBoundary from './components/ErrorBoundary'
+import Loading from './components/Loading'
 import Sidebar from './components/Sidebar'
 import HookLoaderComponent from './headlessComponents/GrobalHooks'
 import SnackBarRenderer from './headlessComponents/SnackBarRenderer'

src/components/ErrorBoundary/ErrorBoundary.tsx → src/components/ErrorBoundary/index.tsx

@@ -33,9 +33,8 @@ class ErrorBoundary extends Component<Props, State> {
 export default ErrorBoundary
 
 const LayoutStyle: React.CSSProperties = {
-  alignItems: 'center',
-  display: 'flex',
-  justifyContent: 'center',
+  display: 'grid',
+  placeContent: 'center',
   minHeight: '100vh',
   minWidth: '100%',
 }
@@ -48,9 +47,7 @@ const MessageStyle: React.CSSProperties = {
   padding: '40px',
 }
 
-export const ErrorBoundaryFallbackComponent: React.FC<
-  React.PropsWithChildren<unknown>
-> = () => (
+export const ErrorBoundaryFallbackComponent: React.FC = () => (
   <main style={LayoutStyle}>
     <section style={MessageStyle}>
       Something Error Ooccurring

src/components/Loading/Loading.stories.tsx

@@ -1,7 +1,7 @@
 import type { Story } from '@storybook/react'
 import React from 'react'
 
-import Loading from './Loading'
+import Loading from './index'
 
 export default {
   title: 'Components/Loading',

src/components/Loading/Loading.test.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 
 import TestRenderer from '../../lib/TestRenderer'
 
-import Loading from './Loading'
+import Loading from './index'
 
 test('should render Loading', () => {
   const { container } = TestRenderer(<Loading />)

src/components/Loading/Loading.tsx → src/components/Loading/index.tsx

@@ -4,7 +4,10 @@ import { CircleLoader } from 'react-spinners'
 const Loading: React.FC = memo(
   () => {
     return (
-      <div className="flex h-full w-full items-center justify-center">
+      <div
+        className="h-screen w-full grid place-content-center"
+        data-testid="loading"
+      >
         <CircleLoader size={250} color="#9CA3AF" />
       </div>
     )

src/headlessComponents/Installation.tsx

@@ -1,6 +1,6 @@
 import React, { memo } from 'react'
 
-import Loading from '../components/Loading/Loading'
+import Loading from '../components/Loading'
 import Signup from '../pages/Signup'
 import { useGetUserCountQuery } from '../redux/API'
 

src/pages/Dashboard/Edit/index.tsx

@@ -8,7 +8,7 @@ import { editPostFormValidator } from '../../../../validator'
 import Button from '../../../components/Button/Button'
 import Input from '../../../components/Input/Input'
 import Layout from '../../../components/Layout'
-import Loading from '../../../components/Loading/Loading'
+import Loading from '../../../components/Loading'
 import RTKQueryErrorMessages from '../../../components/RTKQueryErrorMessages/RTKQueryErrorMessages'
 import Textarea from '../../../components/Textarea/Textarea'
 import { selectAuthor } from '../../../redux/adminSlice'

src/pages/Dashboard/index.tsx

@@ -3,7 +3,7 @@ import { Link } from 'react-router-dom'
 
 import Button from '../../components/Button/Button'
 import Layout from '../../components/Layout'
-import Loading from '../../components/Loading/Loading'
+import Loading from '../../components/Loading'
 import PaginationButtonGroup from '../../components/Pagination/ButtonGroup'
 import usePagination from '../../components/Pagination/usePagination'
 import RTKQueryErrorMessages from '../../components/RTKQueryErrorMessages/RTKQueryErrorMessages'

src/pages/Index/PostList/index.tsx

@@ -1,6 +1,6 @@
 import React, { memo } from 'react'
 
-import Loading from '../../../components/Loading/Loading'
+import Loading from '../../../components/Loading'
 import ButtonGroup from '../../../components/Pagination/ButtonGroup'
 import usePagination from '../../../components/Pagination/usePagination'
 import RTKQueryErrorMessages from '../../../components/RTKQueryErrorMessages/RTKQueryErrorMessages'

src/pages/Post/Error.tsx

@@ -3,7 +3,7 @@ import type { FetchBaseQueryError } from '@reduxjs/toolkit/query'
 import * as Sentry from '@sentry/react'
 import React, { memo } from 'react'
 
-import { ErrorBoundaryFallbackComponent } from '../../components/ErrorBoundary/ErrorBoundary'
+import { ErrorBoundaryFallbackComponent } from '../../components/ErrorBoundary'
 import { useIsomorphicEffect } from '../../hooks/useIsomorphicEffect'
 import { enqueSnackbar } from '../../redux/snackbarSlice'
 import { dispatch } from '../../redux/store'

src/pages/Post/index.tsx

@@ -2,7 +2,7 @@ import React, { memo } from 'react'
 import { useParams } from 'react-router-dom'
 
 import { assertIsDefined } from '../../../lib/assertIsDefined'
-import Loading from '../../components/Loading/Loading'
+import Loading from '../../components/Loading'
 import { API } from '../../redux/API'
 import NotFound from '../NotFound'