Update tests, apply formatting

src/components/greeter.tsx

@@ -68,7 +68,7 @@ export const getGreeting = (greetings: Array<IGreetingProps>): string => {
  * @returns {string} extension for that number
  */
 export const getExtension = (day: number) => {
-  let extension = "";
+  let extension = "th";
 
   if (day % 10 === 1) {
     extension = "st";
@@ -76,8 +76,6 @@ export const getExtension = (day: number) => {
     extension = "nd";
   } else if (day % 10 === 3) {
     extension = "rd";
-  } else if (isBetween(day, 4, 20) || (day > 20 && day % 10 >= 4)) {
-    extension = "th";
   }
 
   return extension;

src/components/icon.tsx

@@ -48,9 +48,7 @@ const IconContainer = styled.i`
  * @returns {React.ReactNode} the icon node
  */
 export const Icon = ({ name, size }: IIconProps) => (
-  <IconContainer about={size}>
-    {name}
-  </IconContainer>
+  <IconContainer about={size}>{name}</IconContainer>
 );
 
 /**

src/components/select.tsx

@@ -8,8 +8,9 @@ export interface IItemProps {
 export interface ISelectProps {
   items: Array<IItemProps>;
   onChange: (item: any) => void;
-  current: string;
+  current?: string;
   className?: string;
+  testId?: string;
 }
 
 const update = (
@@ -20,18 +21,24 @@ const update = (
   onChange(items.find((item) => item.value.toString() === e.target.value));
 };
 
-const Select = ({ items, onChange, current, className }: ISelectProps) => (
+const Select = ({
+  items,
+  onChange,
+  current,
+  className,
+  testId,
+}: ISelectProps) => (
   <select
-    data-testid="select"
+    data-testid={"select" + (testId ? "-" + testId : "")}
     onChange={(e) => update(items, onChange, e)}
     className={className}
+    defaultValue={current}
   >
     {items.map(({ label, value }, index) => (
       <option
-        data-testid={"option-" + index}
+        data-testid={"option-" + (testId ? testId + "-" : "") + index}
         key={[label, index].join("")}
         value={value.toString()}
-        selected={current === label}
       >
         {label}
       </option>

src/components/settings.tsx

@@ -91,7 +91,6 @@ const Settings = ({ themes, search }: ISettingsProps) => {
 
   const currentLightTheme = getTheme("light").label;
   const currentDarkTheme = getTheme("dark").label;
-  console.log(currentLightTheme, currentDarkTheme);
 
   if (themes || search) {
     return (
@@ -105,12 +104,14 @@ const Settings = ({ themes, search }: ISettingsProps) => {
                 items={themes}
                 onChange={(theme: IThemeProps) => setNewLightTheme(theme)}
                 current={currentLightTheme}
+                testId="light"
               ></ThemeSelect>
               <ThemeHeader>Dark</ThemeHeader>
               <ThemeSelect
                 items={themes}
                 onChange={(theme: IThemeProps) => setNewDarkTheme(theme)}
                 current={currentDarkTheme}
+                testId="dark"
               ></ThemeSelect>
             </FormContainer>
             <Button