resources/js/hooks/preloader/MagicPreloaderHook.tsx

@@ -0,0 +1,26 @@
+import React, { useState } from "react";
+import Preloader from "../../components/preloader/Preloader";
+
+//Хук для формирования пропсов управления состояний прелоадера, экспортируемых в компоненты страницы, где планируется вызывать прелоадер
+export const MagicPreloaderHook = () => {
+  //Стейт для видимости прелоадера
+  const [preloaderVisibleState, setPreloaderVisibleState] = useState<boolean>(true);
+  //Стейт для текста прелоадера
+  const [preloaderTextState, setPreloaderTextState] = useState<string>('загрузка');
+  //Сеттер для смены состояний прелоадера
+  function setPreloaderParams (visibleState: boolean, textState?: string)
+  {
+    setPreloaderVisibleState(visibleState)
+    textState ? setPreloaderTextState(textState) : true, []
+  };
+
+  return {
+    setPreloaderParams,
+    PreloaderComponent: ( {preloaderVisible = preloaderVisibleState, preloaderText = preloaderTextState} ) => (
+      <Preloader
+        visible={preloaderVisible}
+        text={preloaderText}
+      />
+    )
+  }
+}