Fix: naming consistency in template-base (#235)

* fix: naming consistency in template-base

* fix: filename casing

tooling/template-base/components/Assets/gridSelector.tsx → tooling/template-base/components/Assets/GridSelector.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-const gridSelector = (
+const GridSelector = (
   <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path
       d="M1.58579 1.58579C1.21071 1.96086 1 2.46957 1 3V5C1 5.53043 1.21071 6.03914 1.58579 6.41421C1.96086 6.78929 2.46957 7 3 7H5C5.53043 7 6.03914 6.78929 6.41421 6.41421C6.78929 6.03914 7 5.53043 7 5V3C7 2.46957 6.78929 1.96086 6.41421 1.58579C6.03914 1.21071 5.53043 1 5 1H3C2.46957 1 1.96086 1.21071 1.58579 1.58579Z"
@@ -33,4 +33,4 @@ const gridSelector = (
   </svg>
 );
 
-export default gridSelector;
+export default GridSelector;

tooling/template-base/components/CTA/ButtonLink.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
-import share from '../Assets/share';
+import Share from '../Assets/Share';
 
 const ButtonLink = (props: { text: string; linkUrl: string }) => {
   return (
     <div className="m-8 flex justify-center">
       <a href={props.linkUrl} className="">
         <button className="flex flex-row justify-center shadow-md rounded-full bg-slate-100 text-black font-semibold text-lg w-80 h-11 py-2 text-center">
           {props.text}
-          <div className="pl-2 pt-1">{share}</div>
+          <div className="pl-2 pt-1">{Share}</div>
         </button>
       </a>
     </div>

tooling/template-base/components/LearnerAccess/LearnerAccess.tsx

@@ -10,8 +10,8 @@ import { GlobalTypes, LoadingDots, useContentGroupsQuery } from '@thoughtindustr
 import LearnerAccessContext from './Context/context';
 import { getAvailableTabs } from './Utilities/utilities';
 import { useTranslation } from 'react-i18next';
-import dropDownClosed from '../Assets/dropDownClosed';
-import dropDownOpen from '../Assets/dropDownOpen';
+import DropDownClosed from '../Assets/DropDownClosed';
+import DropDownOpen from '../Assets/DropDownOpen';
 
 const localizedTabLabelMapping: { [key in TabKey]: string } = {
   [TabKey.Current]: 'dashboard.current',
@@ -99,9 +99,9 @@ const LearnerAccess = ({
         >
           {activeTabKey}
           {dropDownActive ? (
-            <div className="pt-2">{dropDownOpen}</div>
+            <div className="pt-2">{DropDownOpen}</div>
           ) : (
-            <div className="pt-2">{dropDownClosed}</div>
+            <div className="pt-2">{DropDownClosed}</div>
           )}
         </button>
         {dropDownActive && (

tooling/template-base/components/LearnerAccess/LoadBookmarks.tsx

@@ -1,6 +1,7 @@
-import React, { useRef, useState, DragEvent } from 'react';
-import dropDownClosed from '../Assets/dropDownClosed';
-import dropDownOpen from '../Assets/dropDownOpen';
+import React, { useState } from 'react';
+import DropDownClosed from '../Assets/DropDownClosed';
+import DropDownOpen from '../Assets/DropDownOpen';
+
 import {
   useUserBookmarksQuery,
   useUserBookmarksByFolderQuery,
@@ -265,9 +266,9 @@ const LoadBookmarks = (): JSX.Element => {
                 onClick={() => setListViewDropDown(!listViewDropDown)}
               >
                 {listViewDropDown ? (
-                  <div className="h-2">{dropDownOpen}</div>
+                  <div className="h-2">{DropDownOpen}</div>
                 ) : (
-                  <div className="h-2">{dropDownClosed}</div>
+                  <div className="h-2">{DropDownClosed}</div>
                 )}
               </button>
             </div>

tooling/template-base/components/LearnerAccess/LoadUserLearning.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
-import listViewSelector from '../Assets/listViewSelector';
-import gridSelected from '../Assets/gridSelector';
+import ListViewSelector from '../Assets/ListViewSelector';
+import GridSelector from '../Assets/GridSelector';
 
 import { LoadedComponentProps } from './Types/types';
 import {
@@ -81,7 +81,7 @@ const LoadUserLearning = ({
           )}
           onClick={() => setGridActive(false)}
         >
-          <div>{listViewSelector}</div>
+          <div>{ListViewSelector}</div>
         </button>
 
         {/* grid display button */}
@@ -92,7 +92,7 @@ const LoadUserLearning = ({
           )}
           onClick={() => setGridActive(true)}
         >
-          <div>{gridSelected}</div>
+          <div>{GridSelector}</div>
         </button>
       </div>
 

tooling/template-base/components/LearnerAccess/Views/DisplayListView.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
-import dropDownClosed from '../../Assets/dropDownClosed';
-import dropDownOpen from '../../Assets/dropDownOpen';
+import DropDownClosed from '../../Assets/DropDownClosed';
+import DropDownOpen from '../../Assets/DropDownOpen';
 import LearnerAccessListDisplayDropDown from './ListDisplayDropDown';
 import defaultLogo from '../../Assets/logoImage';
 
@@ -72,9 +72,9 @@ const LearnerAccessDisplayListView = ({ item }: ContentUiProps) => {
               onClick={() => setListViewDropDown(!listViewDropDown)}
             >
               {listViewDropDown ? (
-                <div className="h-2">{dropDownOpen}</div>
+                <div className="h-2">{DropDownOpen}</div>
               ) : (
-                <div className="h-2">{dropDownClosed}</div>
+                <div className="h-2">{DropDownClosed}</div>
               )}
             </button>
           </div>

tooling/template-base/components/Navigation/CurrentUserNavBar.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { useState } from 'react';
 import Logo from '../Logo/Logo';
-import dropDownClosed from '../Assets/dropDownClosed';
-import dropDownOpen from '../Assets/dropDownOpen';
+import DropDownClosed from '../Assets/DropDownClosed';
+import DropDownOpen from '../Assets/DropDownOpen';
 import Avatar from '../Avatar/Avatar';
 
 export default function CurrentUserNavBar() {
@@ -37,7 +37,7 @@ export default function CurrentUserNavBar() {
             <button id="icon" type="submit" className="" onClick={() => setNavbar(!navbar)}>
               <div className="flex items-center space-x-3 mr-3">
                 <Avatar size="" />
-                {navbar ? <div>{dropDownOpen} </div> : <div>{dropDownClosed}</div>}
+                {navbar ? <div>{DropDownOpen} </div> : <div>{DropDownClosed}</div>}
               </div>
             </button>
           </div>

tooling/template-base/components/Navigation/CurrentUserSmallScreenNavBar.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useState } from 'react';
 import Logo from '../Logo/Logo';
-import Xicon from '../Assets/xicon';
+import Xicon from '../Assets/Xicon';
 import Avatar from '../Avatar/Avatar';
 
 export default function CurrentUserSmallScreenNavBar() {

tooling/template-base/components/Navigation/UserLoginNavBar.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { useState } from 'react';
 import Logo from '../Logo/Logo';
-import xicon from '../Assets/xicon';
-import hamburger from '../Assets/hamburger';
+import Xicon from '../Assets/Xicon';
+import Hamburger from '../Assets/Hamburger';
 
 export default function UserLoginNavBar() {
   const [navbar, setNavbar] = useState(false);
@@ -42,7 +42,7 @@ export default function UserLoginNavBar() {
             onClick={() => setNavbar(!navbar)}
           >
             <button type="submit" className="" onClick={() => setNavbar(!navbar)}>
-              {navbar ? <div>{xicon}</div> : <div>{hamburger}</div>}
+              {navbar ? <div>{Xicon}</div> : <div>{Hamburger}</div>}
             </button>
           </div>
         </div>