* add tailwindcss * add header component with logo and add torrent buttons * remove bootstrap from few files replace it with tailwindcss classes, add card which diplay all nessesarry information about torrent and current state * Add modal component and reorganize components folder * add useModal hook to render modal though react portal, remove UrlPromptModal and replace it with useModal. * add taliwindcss to Desctop app * removed bootstrap from deleteTorrentModal replace it with useModal * replacing bootstrap with useModal * saving * Saving * Header and cards now look good * Modals still broken... * still doesnt work * Finally it scrolls * Continuing to fix bugs * Continuing to fix bugs * Aler * Getting better * Desktop doesnt work with tailwind somehow * Desktop now works with tailwind * Styles fully work * (De)select all buttons * fix alert styles * Animate progress bar * Progress bar + error colors * Fix error message * Torrent status icon (#56) * add statusIcon component to display icon of the torrent status * change props name and remove isDownloading variable * Tweak styles for icon * Tweak styles * Update styles --------- Co-authored-by: Artur Lozovski <arccik@gmail.com>
35 lines
818 B
TypeScript
35 lines
818 B
TypeScript
import { type ReactNode, createContext, useContext, useState } from "react";
|
|
|
|
interface ModalContextProps {
|
|
isOpen: boolean;
|
|
openModal: () => void;
|
|
closeModal: () => void;
|
|
}
|
|
|
|
const ModalContext = createContext<ModalContextProps | undefined>(undefined);
|
|
|
|
export const ModalProvider = ({ children }: { children: ReactNode }) => {
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
|
|
const openModal = () => {
|
|
setIsOpen(true);
|
|
};
|
|
|
|
const closeModal = () => {
|
|
setIsOpen(false);
|
|
};
|
|
|
|
return (
|
|
<ModalContext.Provider value={{ isOpen, openModal, closeModal }}>
|
|
{children}
|
|
</ModalContext.Provider>
|
|
);
|
|
};
|
|
|
|
export const useModal = () => {
|
|
const context = useContext(ModalContext);
|
|
if (!context) {
|
|
throw new Error("useModal must be used within a ModalProvider");
|
|
}
|
|
return context;
|
|
};
|