Resolve name issues in imports

src/components/Background/Background.jsx

@@ -1,4 +1,4 @@
-import styles from "./background.module.css";
+import styles from "./Background.module.css";
 import { useEffect, useRef, useState } from "react";
 
 const Background = ({ children, className }) => {

src/components/Filter/Filter.tsx

@@ -1,5 +1,5 @@
 import styles from "./Filter.module.css";
-import Button from "../ui/Button/button";
+import Button from "../ui/Button/Button";
 import React from "react";
 
 type FiltersType = {

src/components/Footer/Footer.jsx

@@ -1,8 +1,8 @@
 import styles from "./Footer.module.css"
 import {Link} from "react-router";
 import {useState} from "react";
-import Modal from "../ui/Modal/modal.tsx";
-import Button from "../ui/Button/button.tsx";
+import Modal from "../ui/Modal/Modal";
+import Button from "../ui/Button/Button";
 import scrollToTop from "../../utils/scrollToTop.js";
 
 export default function Footer(){

src/components/ToolBar/ToolBar.jsx

@@ -1,7 +1,7 @@
 import styles from "./ToolBar.module.css"
 import CreateEventBtn from "./tools/CreateEventBtn/CreateEventBtn.jsx";
-import SearchBtn from "./tools/SearchBtn.tsx";
-import FilterBtn from "./tools/FilterBtn.tsx";
+import SearchBtn from "./tools/SearchBtn";
+import FilterBtn from "./tools/FilterBtn";
 
 function ToolBar({setFilters, filters, showCreate = true}) {
 

src/components/ToolBar/tools/CreateEventBtn/CreateEventBtn.jsx

@@ -1,8 +1,8 @@
-import styles from "./createEventBtn.module.css"
+import styles from "./CreateEventBtn.module.css"
 import { useState, useContext } from "react";
-import Modal from "../../../ui/Modal/modal.tsx";
-import Button from "../../../ui/Button/button.tsx";
-import TextInput from "../../../ui/Input/input.tsx";
+import Modal from "../../../ui/Modal/Modal";
+import Button from "../../../ui/Button/Button";
+import TextInput from "../../../ui/Input/Input";
 import { EventContext } from "../../../../contexts/events/EventContext.js";
 import {AuthContext} from "../../../../contexts/auth/AuthContext.ts";
 

src/components/ToolBar/tools/SearchBtn.tsx

@@ -1,5 +1,5 @@
 import styles from "../ToolBar.module.css"
-import Button from "../../ui/Button/button";
+import Button from "../../ui/Button/Button";
 import { useEffect, useState } from "react";
 import SearchBar from "../../SearchBar/SearchBar";
 

src/components/ui/Button/Button.tsx

@@ -1,5 +1,5 @@
 import { ReactNode, MouseEventHandler } from "react";
-import styles from "./button.module.css";
+import styles from "./Button.module.css";
 
 type ButtonVariant = "primary" | "danger" | "transparent" | "default";
 

src/components/ui/Input/Input.tsx

@@ -1,4 +1,4 @@
-import styles from "./input.module.css";
+import styles from "./Input.module.css";
 import { useState, ChangeEvent, InputHTMLAttributes } from "react";
 
 interface TextInputProps extends InputHTMLAttributes<HTMLInputElement> {

src/components/ui/Loading/Loading.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import styles from "./loading.module.css";
+import styles from "./Loading.module.css";
 
 const Loading: React.FC = () => {
     return (

src/components/ui/Modal/Modal.tsx

@@ -31,8 +31,8 @@ const Modal = ({ open, onClose, children, title }) => {
 export default Modal;*/
 
 import { createPortal } from "react-dom";
-import styles from "./modal.module.css";
-import Button from "../Button/button";
+import styles from "./Modal.module.css";
+import Button from "../Button/Button";
 import { ReactNode, MouseEvent } from "react";
 
 interface ModalProps {

src/components/ui/themeSwitcher/ThemeSwitcher.jsx

@@ -1,4 +1,4 @@
-import Button from "../button/button.tsx";
+import Button from "../Button/Button.tsx";
 import { useState, useEffect } from "react";
 import styles from "./ThemeSwitcher.module.css";
 

src/components/ui/themeSwitcher/ThemeSwitcher.tsx

@@ -31,7 +31,7 @@ export default function ThemeSwitcher() {
     </Button>
 }*/
 
-import Button from "../Button/button";
+import Button from "../Button/Button";
 import { useState, useEffect } from "react";
 import styles from "./ThemeSwitcher.module.css";
 

src/layout.jsx

@@ -1,7 +1,7 @@
 import { Outlet } from "react-router";
 import Footer from "./components/Footer/Footer.jsx"
 import Header from "./components/Header/Header.jsx";
-import Background from "./components/Background/background.jsx";
+import Background from "./components/Background/Background.jsx";
 import { Navigate } from "react-router";
 import {  useContext} from "react";
 import { AuthContext } from "./contexts/auth/AuthContext.js";

src/pages/Admin/AdminPage.jsx

@@ -4,7 +4,7 @@ import IncompleteEvents from "./components/IncompleteEvent/IncompleteEvent.jsx";
 import PendingMembers from "./components/pendingMembers/PendingMembers.jsx";
 import { AuthContext } from "../../contexts/auth/AuthContext.js";
 import { useNavigate } from "react-router";
-import RegisterMember from "./components/registerMember/registerMember.tsx";
+import RegisterMember from "./components/registerMember/registerMember";
 
 
 function AdminPage() {

src/pages/Admin/components/pendingMembers/PendingMembers.jsx

@@ -1,7 +1,7 @@
 import React, {useState, useEffect, useContext} from "react";
-import Button from "../../../../components/ui/Button/button.tsx";
+import Button from "../../../../components/ui/Button/Button";
 import styles from "./PendingMembers.module.css";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import Modal from "../../../../components/ui/Modal/Modal";
 import validateUser from "../../../../utils/users/validateUser.js";
 import deleteOtherUser from "../../../../utils/users/deleteOtherUser.js";
 import { PendingMembersContext } from "../../../../contexts/pendingMembers/PendingMembersContext";

src/pages/Admin/components/registerMember/registerMember.tsx

@@ -1,11 +1,11 @@
 import React, { useState } from "react"
 import styles from "./registerMember.module.css"
-import TextInput from "../../../../components/ui/Input/input"
-import Button from "../../../../components/ui/Button/button";
+import TextInput from "../../../../components/ui/Input/Input"
+import Button from "../../../../components/ui/Button/Button";
 import Response from "../../../../interfaces/response.interface";
 import ResponseData from "./responseData.inteface";
 import adminCreateUser from "../../../../utils/users/adminCreateUser";
-import Modal from "../../../../components/ui/Modal/modal";
+import Modal from "../../../../components/ui/Modal/Modal";
 
 
 const RegisterMember: React.FC = () => {

src/pages/Events/components/Event/Event.jsx

@@ -1,7 +1,7 @@
 import styles from "./Event.module.css";
 import { useState, useEffect } from "react";
 import { useNavigate } from "react-router";
-import Button from "/src/components/ui/Button/button"
+import Button from "/src/components/ui/Button/Button"
 
 function Event({event}){
 

src/pages/Home/components/Calendar/calendar.jsx

@@ -2,7 +2,7 @@ import {useState, useMemo, useEffect, useContext} from "react";
 import styles from "./calendar.module.css";
 import {formatDateLetterJS} from "../../../../utils/date/formatDateLetter.js";
 import {EventContext} from "../../../../contexts/events/EventContext.js";
-import Button from "../../../../components/ui/Button/button.jsx";
+import Button from "../../../../components/ui/Button/Button";
 import {AuthContext} from "../../../../contexts/auth/AuthContext.ts";
 
 function Calendar() {

src/pages/Login/LoginPage.jsx

@@ -1,6 +1,6 @@
 import styles from "./LoginPage.module.css";
 import LoginForm from "./components/loginform/loginForm.jsx";
-import Background from "../../components/Background/background.jsx";
+import Background from "../../components/Background/Background.jsx";
 import { useEffect, useContext } from "react";
 import { AuthContext } from "../../contexts/auth/AuthContext.js";
 import { useNavigate } from "react-router";

src/pages/Login/components/loginform/loginForm.tsx

@@ -1,8 +1,8 @@
 import { useState, useContext, FormEvent } from "react";
 import styles from "./loginForm.module.css";
-import Button from "../../../../components/ui/Button/button";
-import Input from "../../../../components/ui/Input/input";
-import Modal from "../../../../components/ui/Modal/modal";
+import Button from "../../../../components/ui/Button/Button";
+import Input from "../../../../components/ui/Input/Input";
+import Modal from "../../../../components/ui/Modal/Modal";
 import { useNavigate } from "react-router-dom";
 import { AuthContext, AuthContextType } from "../../../../contexts/auth/AuthContext";
 

src/pages/PageNotFound/PageNotFound.jsx

@@ -1,4 +1,4 @@
-import Background from "../../components/Background/background.jsx";
+import Background from "../../components/Background/Background.jsx";
 import styles from "./PageNotFound.module.css"
 import { useNavigate } from "react-router";
 import { APP_CONFIG } from "../../config/appConfig.js";

src/pages/Profile/components/SettingsModal/SettingsModal.tsx

@@ -1,10 +1,10 @@
 import {useContext, useState, ChangeEvent} from "react";
-import Modal from "../../../../components/ui/Modal/modal";
-import Button from "../../../../components/ui/Button/button";
+import Modal from "../../../../components/ui/Modal/Modal";
+import Button from "../../../../components/ui/Button/Button";
 import styles from "./SettingsModal.module.css";
-import ThemeSwitcher from "../../../../components/ui/themeSwitcher/ThemeSwitcher.jsx";
+import ThemeSwitcher from "../../../../components/ui/themeSwitcher/ThemeSwitcher";
 import {AuthContext} from "../../../../contexts/auth/AuthContext";
-import TextInput from "../../../../components/ui/Input/input";
+import TextInput from "../../../../components/ui/Input/Input";
 import updateUser from "../../../../utils/users/updateUser.js";
 import deleteUser from "../../../../utils/users/deleteUser.js";
 

src/pages/Profile/components/manageMember/ManageMember.jsx

@@ -1,5 +1,5 @@
-import Button from "../../../../components/ui/Button/button.tsx";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import Button from "../../../../components/ui/Button/Button";
+import Modal from "../../../../components/ui/Modal/Modal";
 import {useContext, useState} from "react";
 import styles from "./manageMember.module.css"
 import DeactivateMemberBtn from "./deactivateMember/deactivateMemberBtn.jsx";

src/pages/Profile/components/manageMember/deactivateMember/deactivateMemberBtn.jsx

@@ -1,5 +1,5 @@
-import Button from "../../../../../components/ui/Button/button.tsx";
-import Modal from "../../../../../components/ui/Modal/modal.tsx";
+import Button from "../../../../../components/ui/Button/Button";
+import Modal from "../../../../../components/ui/Modal/Modal";
 import { useState } from "react";
 import deactivateUser from "../../../../../utils/users/deactivateUser.js"
 import { useNavigate } from "react-router";

src/pages/Profile/components/manageMember/modifyrole/ModifyRole.jsx

@@ -1,9 +1,9 @@
 import styles from "../manageMember.module.css";
-import Button from "../../../../../components/ui/Button/button.tsx";
+import Button from "../../../../../components/ui/Button/Button";
 import modifyRole from "../../../../../utils/users/modifyRole.js";
 import { useState, useEffect } from "react";
 import getRoles from "../../../../../utils/getRoles.js";
-import Modal from "../../../../../components/ui/Modal/modal.tsx";
+import Modal from "../../../../../components/ui/Modal/Modal";
 
 export default function ModifyRole({ user }) {
 

src/pages/Register/RegisterPage.jsx

@@ -1,12 +1,12 @@
 import styles from "./RegisterPage.module.css";
-import Background from "../../components/Background/background.jsx";
-import Input from "../../components/ui/Input/input.tsx";
-import Button from "../../components/ui/Button/button.tsx";
+import Background from "../../components/Background/Background.jsx";
+import Input from "../../components/ui/Input/Input";
+import Button from "../../components/ui/Button/Button";
 import {useContext, useEffect, useState} from "react";
 import register from "../../utils/register.js";
 import { useNavigate } from "react-router";
 import { AuthContext } from "../../contexts/auth/AuthContext.js";
-import Modal from "../../components/ui/Modal/modal.tsx";
+import Modal from "../../components/ui/Modal/Modal";
 
 
 function RegisterPage() {

src/pages/Volunteers/VolunteersPage.tsx

@@ -6,7 +6,7 @@ import ToolBar from "../../components/ToolBar/ToolBar";
 import filter from "../../utils/filter";
 import getUserById from "../../utils/users/getUserById";
 import User from "./interfaces/user.interface";
-import Loading from "../../components/ui/Loading/loading";
+import Loading from "../../components/ui/Loading/Loading";
 
 interface Filters {
     alphabetical: "asc" | "desc";

src/pages/Volunteers/components/VolunteersCard/VolunteerCard.tsx

@@ -1,6 +1,6 @@
 import styles from "./VolunteersCard.module.css";
 import { useNavigate } from "react-router";
-import Button from "../../../../components/ui/Button/button";
+import Button from "../../../../components/ui/Button/Button";
 import User from "../../interfaces/user.interface"
 
 interface VolunteersCardProps {

src/pages/eventDetail/components/EventTask/EventTask.jsx

@@ -1,11 +1,11 @@
 import styles from "./eventTask.module.css";
 import { formatDateLetter } from "../../../../utils/date/formatDateLetter.js";
-import Button from "../../../../components/ui/Button/button.tsx";
+import Button from "../../../../components/ui/Button/Button";
 import assign from "../../../../utils/tasks/assign.js";
 import unAssign from "../../../../utils/tasks/unAssign.js";
 import { useContext, useEffect, useState } from "react";
 import isAssigned from "../../../../utils/tasks/isAssigned.js";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import Modal from "../../../../components/ui/Modal/Modal";
 import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
 import DeleteTaskBtn from "../deleteTaskBtn/deleteTaskBtn.jsx";
 

src/pages/eventDetail/components/createTaskBtn/createTaskBtn.jsx

@@ -1,8 +1,8 @@
 import styles from "../../eventDetail.module.css";
-import Button from "../../../../components/ui/Button/button.tsx";
+import Button from "../../../../components/ui/Button/Button";
 import {useContext, useState} from "react";
-import TextInput from "../../../../components/ui/Input/input.tsx";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import TextInput from "../../../../components/ui/Input/Input";
+import Modal from "../../../../components/ui/Modal/Modal";
 import createTaskApi from "../../../../utils/tasks/createTask.js";
 import {EventDetailContext} from "../../../../contexts/eventDetail/eventDetail.js";
 

src/pages/eventDetail/components/deleteEventBtn/deleteEventBtn.jsx

@@ -1,6 +1,6 @@
 import styles from "../../eventDetail.module.css";
-import Button from "../../../../components/ui/Button/button.tsx";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import Button from "../../../../components/ui/Button/Button";
+import Modal from "../../../../components/ui/Modal/Modal";
 import { useContext, useState } from "react";
 import { EventDetailContext } from "../../../../contexts/eventDetail/eventDetail.js";
 import { EventContext } from "../../../../contexts/events/EventContext.js";

src/pages/eventDetail/components/deleteTaskBtn/deleteTaskBtn.jsx

@@ -1,9 +1,9 @@
 import { useContext } from "react";
 import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
 import { EventDetailContext } from "../../../../contexts/eventDetail/eventDetail.js";
-import Button from "../../../../components/ui/Button/button.tsx";
+import Button from "../../../../components/ui/Button/Button";
 import { useState } from "react";
-import Modal from "../../../../components/ui/Modal/modal.tsx";
+import Modal from "../../../../components/ui/Modal/Modal";
 import styles from "../../eventDetail.module.css";
 
 export default function DeleteTaskBtn({ taskId, eventId, taskName }) {

src/pages/waitValidationPage/ValidationErrorPage.jsx

@@ -1,6 +1,6 @@
 import styles from "./validationErrorPage.module.css"
-import Background from "../../components/Background/background.jsx";
-import Button from "../../components/ui/Button/button.tsx";
+import Background from "../../components/Background/Background.jsx";
+import Button from "../../components/ui/Button/Button";
 import { useContext } from "react";
 import { AuthContext } from "../../contexts/auth/AuthContext.js";
 import { Navigate, useNavigate, Link } from "react-router";

src/router.js

@@ -3,7 +3,7 @@ import Layout from "./layout.jsx";
 import HomePage from "./pages/Home/HomePage";
 import LoginPage from "./pages/Login/LoginPage";
 import RegisterPage from "./pages/Register/RegisterPage.jsx";
-import VolunteersPage from "./pages/Volunteers/VolunteersPage.tsx";
+import VolunteersPage from "./pages/Volunteers/VolunteersPage";
 import ProfilePage from "./pages/Profile/ProfilePage";
 import EventsPage from "./pages/Events/EventsPage.jsx";
 import AdminPage from "./pages/Admin/AdminPage.jsx";

src/stories/Button.stories.jsx

@@ -1,6 +1,6 @@
 import { fn } from 'storybook/test';
 
-import Button from '../components/ui/Button/button.tsx';
+import Button from '../components/ui/Button/Button';
 
 
 export default {

src/stories/Input.stories.jsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import TextInput from "../components/ui/Input/input.tsx";
+import TextInput from "../components/ui/Input/Input";
 
 
 export default {

src/stories/Loading.stories.jsx

@@ -1,4 +1,4 @@
-import Loading from "../components/ui/Loading/loading.tsx";
+import Loading from "../components/ui/Loading/Loading";
 
 
 export default {

src/stories/Modal.stories.jsx

@@ -1,5 +1,5 @@
-import Modal from "../components/ui/Modal/modal.tsx";
-import Button from "../components/ui/Button/button.tsx";
+import Modal from "../components/ui/Modal/Modal";
+import Button from "../components/ui/Button/Button";
 import { useState } from "react";
 
 export default {

src/stories/ThemeSwitcher.stories.jsx

@@ -1,5 +1,5 @@
-import ThemeSwitcher from "../components/ui/themeSwitcher/ThemeSwitcher.jsx";
-import Background from "../components/Background/background.jsx";
+import ThemeSwitcher from "../components/ui/themeSwitcher/ThemeSwitcher";
+import Background from "../components/Background/Background.jsx";
 
 export default {
     title: 'UI/ThemeSwitcher',