diff --git a/src/common/animations/Animation.tsx b/src/common/animations/Animation.tsx
index f72e3cf..26eacc3 100644
--- a/src/common/animations/Animation.tsx
+++ b/src/common/animations/Animation.tsx
@@ -1,13 +1,9 @@
-import React, { useRef } from 'react';
+import { useRef } from 'react';
 import { CSSTransition } from 'react-transition-group';
 
 const TRANSITION_DURATION = 500;
 
-const Animation = ({
-  name,
-  timeout,
-  children,
-}) => {
+const Animation = ({ name, timeout, children }) => {
   const nodeRef = useRef(null);
   return (
     <CSSTransition
diff --git a/src/common/animations/FadeIn.tsx b/src/common/animations/FadeIn.tsx
index 4702921..92ea621 100644
--- a/src/common/animations/FadeIn.tsx
+++ b/src/common/animations/FadeIn.tsx
@@ -1,11 +1,9 @@
 import './fadeIn.scss';
 
-import React from 'react';
-
 import Animation from './Animation';
 
 const FadeIn = ({ children }) => (
-  <Animation name='fadeIn' timeout={[400, 700, 700]}>
+  <Animation name="fadeIn" timeout={[400, 700, 700]}>
     {children}
   </Animation>
 );
diff --git a/src/common/animations/Slide.tsx b/src/common/animations/Slide.tsx
index 357ba6c..c6602e7 100644
--- a/src/common/animations/Slide.tsx
+++ b/src/common/animations/Slide.tsx
@@ -1,11 +1,9 @@
 import './slide.scss';
 
-import React from 'react';
-
 import Animation from './Animation';
 
 const Slide = ({ children }) => (
-  <Animation name='slide' timeout={[0, 200, 200]}>
+  <Animation name="slide" timeout={[0, 200, 200]}>
     {children}
   </Animation>
 );
diff --git a/src/components/ColorPicker/ColorPicker.stories.tsx b/src/components/ColorPicker/ColorPicker.stories.tsx
index 630c8a5..18dca0b 100644
--- a/src/components/ColorPicker/ColorPicker.stories.tsx
+++ b/src/components/ColorPicker/ColorPicker.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { ColorPicker } from './ColorPicker';
diff --git a/src/components/clock/clock.scss b/src/components/clock/Clock.scss
similarity index 100%
rename from src/components/clock/clock.scss
rename to src/components/clock/Clock.scss
diff --git a/src/components/clock/Clock.tsx b/src/components/clock/Clock.tsx
index dd92321..bd10794 100644
--- a/src/components/clock/Clock.tsx
+++ b/src/components/clock/Clock.tsx
@@ -1,6 +1,6 @@
-import './clock.scss';
+import './Clock.scss';
 
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import classNames from 'classnames';
 
 //import Slide from '../../common/animations/Slide';
@@ -62,12 +62,12 @@ const Delimiter = ({ hidden = false, delimiterBlinking }) => {
   return <span className={className}>:</span>;
 };
 
-const AmPm = ({ hours }: {hours: number}) => {
+const AmPm = ({ hours }: { hours: number }) => {
   const ampm = hours < 12 ? 'am' : 'pm';
   return <span className="clock__ampm">{ampm}</span>;
 };
 
-const Clock = ({ className }: {className: string}) => {
+const Clock = ({ className }: { className: string }) => {
   const { state } = useSettingsSlice();
   const { use24format: use24, delimiterBlinking, displaySeconds, animateDigits } = state;
   const [{ minutes, hours, seconds }, setTime] = useState(newTime);
diff --git a/src/components/settings/Settings.tsx b/src/components/settings/Settings.tsx
index 0e7a8eb..4527080 100644
--- a/src/components/settings/Settings.tsx
+++ b/src/components/settings/Settings.tsx
@@ -1,6 +1,6 @@
 import './Settings.scss';
 
-import React, { useRef, useState } from 'react';
+import React, { useState } from 'react';
 import classNames from 'classnames';
 
 import SettingsGroups from './SettingsGroups/SettingsGroups';
diff --git a/src/components/settings/SettingsGroups/SettingsGroups.stories.tsx b/src/components/settings/SettingsGroups/SettingsGroups.stories.tsx
index 3350def..c18ec95 100644
--- a/src/components/settings/SettingsGroups/SettingsGroups.stories.tsx
+++ b/src/components/settings/SettingsGroups/SettingsGroups.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import SettingsGroups from './SettingsGroups';
diff --git a/src/components/settings/SettingsGroups/SettingsGroups.tsx b/src/components/settings/SettingsGroups/SettingsGroups.tsx
index 381eb01..f7aa1c2 100644
--- a/src/components/settings/SettingsGroups/SettingsGroups.tsx
+++ b/src/components/settings/SettingsGroups/SettingsGroups.tsx
@@ -1,7 +1,6 @@
 import './SettingsGroups.scss';
 
 import classNames from 'classnames';
-
 import SettingsGroupTile from '../SettingsGroupTile/SettingsGroupTile';
 import type { SettingsGroup } from '../settings-groups';
 
diff --git a/src/components/settings/SettingsPanel/SettingsPanel.tsx b/src/components/settings/SettingsPanel/SettingsPanel.tsx
index c985334..a063d06 100644
--- a/src/components/settings/SettingsPanel/SettingsPanel.tsx
+++ b/src/components/settings/SettingsPanel/SettingsPanel.tsx
@@ -1,6 +1,7 @@
-import classNames from 'classnames';
 import './SettingsPanel.scss';
 
+import classNames from 'classnames';
+
 import { PropsWithChildren } from 'react';
 
 type Props = PropsWithChildren<{
diff --git a/src/components/settings/SettingsPanelBackground/SettingsPanelBackground.tsx b/src/components/settings/SettingsPanelBackground/SettingsPanelBackground.tsx
index 1401f4d..88f7af6 100644
--- a/src/components/settings/SettingsPanelBackground/SettingsPanelBackground.tsx
+++ b/src/components/settings/SettingsPanelBackground/SettingsPanelBackground.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { colors, gradientAngles, gradients, images, patterns } from '../../../config';
 import lang from '../../../services/lang';
 import { ColorPicker } from '../../ColorPicker/ColorPicker';
diff --git a/src/components/settings/SettingsPanelClock/SettingsPanelClock.tsx b/src/components/settings/SettingsPanelClock/SettingsPanelClock.tsx
index 18c787a..56c8f88 100644
--- a/src/components/settings/SettingsPanelClock/SettingsPanelClock.tsx
+++ b/src/components/settings/SettingsPanelClock/SettingsPanelClock.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { useSettingsSlice } from '../../../store/slices/settingsSlice';
 import { SettingsPanel } from '../SettingsPanel/SettingsPanel';
 import SwitchOption from '../SwitchOption/SwitchOption';
diff --git a/src/components/settings/SettingsPanelDock/SettingsPanelDock.tsx b/src/components/settings/SettingsPanelDock/SettingsPanelDock.tsx
index ac2594d..8636e77 100644
--- a/src/components/settings/SettingsPanelDock/SettingsPanelDock.tsx
+++ b/src/components/settings/SettingsPanelDock/SettingsPanelDock.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import lang from '../../../services/lang';
 import { dock } from '../../../config';
 import { DockURL } from '../../../config/dock';
diff --git a/src/components/settings/SettingsPanelText/SettingsPanelText.tsx b/src/components/settings/SettingsPanelText/SettingsPanelText.tsx
index 291260c..810621a 100644
--- a/src/components/settings/SettingsPanelText/SettingsPanelText.tsx
+++ b/src/components/settings/SettingsPanelText/SettingsPanelText.tsx
@@ -1,4 +1,4 @@
-import React, { ChangeEvent } from 'react';
+import { ChangeEvent } from 'react';
 import { colors, fonts } from '../../../config';
 import lang from '../../../services/lang';
 import { ColorPicker } from '../../ColorPicker/ColorPicker';
diff --git a/src/components/settings/SettingsSection/SettingsSection.stories.tsx b/src/components/settings/SettingsSection/SettingsSection.stories.tsx
index 0c882a3..d9b4f9e 100644
--- a/src/components/settings/SettingsSection/SettingsSection.stories.tsx
+++ b/src/components/settings/SettingsSection/SettingsSection.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { SettingsSection } from './SettingsSection';
diff --git a/src/components/settings/SettingsSection/SettingsSection.tsx b/src/components/settings/SettingsSection/SettingsSection.tsx
index a66ba77..7cfb5da 100644
--- a/src/components/settings/SettingsSection/SettingsSection.tsx
+++ b/src/components/settings/SettingsSection/SettingsSection.tsx
@@ -1,5 +1,6 @@
 import './SettingsSection.scss';
-import React, { PropsWithChildren } from 'react';
+
+import { PropsWithChildren } from 'react';
 
 type Props = PropsWithChildren<{
   title: string;
diff --git a/src/components/settings/Slider/Slider.stories.tsx b/src/components/settings/Slider/Slider.stories.tsx
index 103c950..23e90e5 100644
--- a/src/components/settings/Slider/Slider.stories.tsx
+++ b/src/components/settings/Slider/Slider.stories.tsx
@@ -1,4 +1,4 @@
-import React, { ChangeEvent, useState } from 'react';
+import { ChangeEvent, useState } from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { Slider } from './Slider';
diff --git a/src/components/settings/Slider/Slider.tsx b/src/components/settings/Slider/Slider.tsx
index 3fc4d14..3d8859b 100644
--- a/src/components/settings/Slider/Slider.tsx
+++ b/src/components/settings/Slider/Slider.tsx
@@ -1,6 +1,6 @@
 import './Slider.scss';
 
-import React, { InputHTMLAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 
 export const Slider = ({ min, max, value, ...rest }: InputHTMLAttributes<HTMLInputElement>) => {
   const zeroBasedValue: number = parseFloat(value as string) - parseFloat(min as string);
diff --git a/src/components/settings/Switch/Switch.stories.tsx b/src/components/settings/Switch/Switch.stories.tsx
index 1efaec9..ac6286a 100644
--- a/src/components/settings/Switch/Switch.stories.tsx
+++ b/src/components/settings/Switch/Switch.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import Switch from './Switch';
diff --git a/src/components/settings/Switch/Switch.tsx b/src/components/settings/Switch/Switch.tsx
index c7724d9..e49d769 100644
--- a/src/components/settings/Switch/Switch.tsx
+++ b/src/components/settings/Switch/Switch.tsx
@@ -1,6 +1,6 @@
 import './Switch.scss';
 
-import React, { InputHTMLAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 import classNames from 'classnames';
 
 const Switch = ({ className, checked, ...rest }: InputHTMLAttributes<HTMLInputElement>) => {
diff --git a/src/components/settings/SwitchOption/SwitchOption.stories.tsx b/src/components/settings/SwitchOption/SwitchOption.stories.tsx
index cbf3dfd..eda776a 100644
--- a/src/components/settings/SwitchOption/SwitchOption.stories.tsx
+++ b/src/components/settings/SwitchOption/SwitchOption.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import SwitchOption from './SwitchOption';
diff --git a/src/components/settings/SwitchOption/SwitchOption.tsx b/src/components/settings/SwitchOption/SwitchOption.tsx
index 1f4590d..dc157c9 100644
--- a/src/components/settings/SwitchOption/SwitchOption.tsx
+++ b/src/components/settings/SwitchOption/SwitchOption.tsx
@@ -1,6 +1,6 @@
 import './SwitchOption.scss';
 
-import React, { PropsWithChildren } from 'react';
+import { PropsWithChildren } from 'react';
 import Switch from '../Switch/Switch';
 
 type Props = PropsWithChildren<{
diff --git a/src/components/weather/Current.tsx b/src/components/weather/Current.tsx
index 1f42921..e7ea71f 100644
--- a/src/components/weather/Current.tsx
+++ b/src/components/weather/Current.tsx
@@ -1,22 +1,20 @@
 import './current.scss';
 
-import * as React from 'react';
-
 import Icon from './Icon';
 import type { WeatherResponseCurrent, WeatherResponseLocation } from '../../types';
 
 type Props = {
-  data: WeatherResponseCurrent,
-  location: WeatherResponseLocation,
-  temperatureUnits: 'c' | 'f',
+  data: WeatherResponseCurrent;
+  location: WeatherResponseLocation;
+  temperatureUnits: 'c' | 'f';
 };
 
 const CurrentWeather = ({ data, location, temperatureUnits }: Props) => (
-  <div className='weather-current'>
-    <div className='weather-current__city'>{location.city}</div>
-    <Icon className='weather-current__icon' code={data.code} title={data.text} />
-    <div className='weather-current__temperature'>{data.temp}</div>
-    <div className='weather-current__degrees'>°{temperatureUnits.toUpperCase()}</div>
+  <div className="weather-current">
+    <div className="weather-current__city">{location.city}</div>
+    <Icon className="weather-current__icon" code={data.code} title={data.text} />
+    <div className="weather-current__temperature">{data.temp}</div>
+    <div className="weather-current__degrees">°{temperatureUnits.toUpperCase()}</div>
   </div>
 );
 
diff --git a/src/components/weather/Error.tsx b/src/components/weather/Error.tsx
index d398725..ff740d2 100644
--- a/src/components/weather/Error.tsx
+++ b/src/components/weather/Error.tsx
@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import lang from '../../services/lang';
 import ErrorMessage from '../error/ErrorMessage';
 
@@ -33,7 +31,7 @@ const WeatherError = ({ error }: Props) => {
     }
   }
 
-  return <ErrorMessage className='weather__error'>{message}</ErrorMessage>;
+  return <ErrorMessage className="weather__error">{message}</ErrorMessage>;
 };
 
 export default WeatherError;
diff --git a/src/components/weather/Forecast.tsx b/src/components/weather/Forecast.tsx
index 57e3d2c..5b12f6a 100644
--- a/src/components/weather/Forecast.tsx
+++ b/src/components/weather/Forecast.tsx
@@ -1,7 +1,5 @@
 import './forecast.scss';
 
-import * as React from 'react';
-
 import type { WeatherResponseForecast } from '../../types';
 import lang from '../../services/lang';
 import Icon from './Icon';
@@ -21,19 +19,19 @@ export const getDay = (date: string) => {
 };
 
 type Props = {
-  data: WeatherResponseForecast,
+  data: WeatherResponseForecast;
 };
 
 const WeatherForecast = (props: Props) => (
-  <div className='weather-forecast'>
-    {props.data.map(day => (
-      <div className='weather-forecast__day' key={day.date}>
-        <div className='weather-forecast__day__name'>{getDay(day.date)}</div>
-        <Icon className='weather-forecast__day__icon' code={day.code} title={day.text} />
-        <div className='weather-forecast__day__temperature'>
-          <span className='weather-forecast__day__temperature--max'>{day.max}&deg;</span>
-          <span className='weather-forecast__day__temperature__separator'>/</span>
-          <span className='weather-forecast__day__temperature--min'>{day.min}&deg;</span>
+  <div className="weather-forecast">
+    {props.data.map((day) => (
+      <div className="weather-forecast__day" key={day.date}>
+        <div className="weather-forecast__day__name">{getDay(day.date)}</div>
+        <Icon className="weather-forecast__day__icon" code={day.code} title={day.text} />
+        <div className="weather-forecast__day__temperature">
+          <span className="weather-forecast__day__temperature--max">{day.max}&deg;</span>
+          <span className="weather-forecast__day__temperature__separator">/</span>
+          <span className="weather-forecast__day__temperature--min">{day.min}&deg;</span>
         </div>
       </div>
     ))}
diff --git a/src/components/weather/Icon.tsx b/src/components/weather/Icon.tsx
index f6a72b7..a2c6fd9 100644
--- a/src/components/weather/Icon.tsx
+++ b/src/components/weather/Icon.tsx
@@ -1,6 +1,5 @@
 import './icon.scss';
 
-import * as React from 'react';
 import classNames from 'classnames';
 
 type Props = {
diff --git a/src/components/weather/__tests__/Current.test.js b/src/components/weather/__tests__/Current.test.js
index b0c9c0a..790b80f 100644
--- a/src/components/weather/__tests__/Current.test.js
+++ b/src/components/weather/__tests__/Current.test.js
@@ -1,30 +1,24 @@
-import React from 'react';
 import renderer from 'react-test-renderer';
 
 import Current from '../Current';
 
-
 describe('Components > weather > Current', () => {
   it('should match snapshot', () => {
     const testData = {
       code: '1',
       date: '18 Jan 2018',
       temp: -273,
-      text: 'test-text'
+      text: 'test-text',
     };
 
     const testLocation = {
-      city: 'TestCity'
+      city: 'TestCity',
     };
 
     const testTemperatureUnits = 'test-temp-unit';
 
-
     const component = renderer.create(
-      <Current
-        data={testData}
-        location={testLocation}
-        temperatureUnits={testTemperatureUnits} />
+      <Current data={testData} location={testLocation} temperatureUnits={testTemperatureUnits} />,
     );
 
     const tree = component.toJSON();
diff --git a/src/components/weather/__tests__/Forecast.test.js b/src/components/weather/__tests__/Forecast.test.js
index 01a0d97..ac19689 100644
--- a/src/components/weather/__tests__/Forecast.test.js
+++ b/src/components/weather/__tests__/Forecast.test.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import renderer from 'react-test-renderer';
 
 import Forecast, { daysBetween, getDay } from '../Forecast';
@@ -8,7 +7,7 @@ describe('Components > weather > Forecast', () => {
     /* global global */
     const OriginalDate = Date;
     // mock Date
-    global.Date = jest.fn().mockImplementation(a => new OriginalDate(a ? a : today));
+    global.Date = jest.fn().mockImplementation((a) => new OriginalDate(a ? a : today));
     global.Date.now = OriginalDate.now;
     // run function
     fn();