refactor: small code improvements

refactor: remove unused code

refactor: extract loader component

refactor: prevent keyword collision

refactor: cleanup hook pending states

apps/client/src/views/ViewLoader.tsx

@@ -4,7 +4,7 @@ import { overrideStylesURL } from '../common/api/constants';
 import { useRuntimeStylesheet } from '../common/hooks/useRuntimeStylesheet';
 import useViewSettings from '../common/hooks-query/useViewSettings';
 
-import style from './ViewLoader.module.scss';
+import Loader from './common/loader/Loader';
 
 export default function ViewLoader({ children }: PropsWithChildren) {
   const { data } = useViewSettings();
@@ -15,16 +15,7 @@ export default function ViewLoader({ children }: PropsWithChildren) {
   // suspense would have the advantage of being triggered also by react-query
 
   if (!shouldRender) {
-    return (
-      <div className={style.loader}>
-        <div className={style.ellipsis}>
-          <div />
-          <div />
-          <div />
-          <div />
-        </div>
-      </div>
-    );
+    return <Loader />;
   }
 
   // eslint-disable-next-line react/jsx-no-useless-fragment -- ensuring JSX return