fix libcurl? and orgainize

src/components/layout-components.tsx

@@ -1,10 +1,10 @@
 import { useEffect, useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
-import { fetch } from "@/utils/fetch";
+import { fetch } from "@/lib/fetch";
 import { libcurl } from "libcurl.js/bundled";
 import { useAsync } from "@/hooks";
-import encoder from "@/utils/encoder";
-import { openCloaked } from "@/utils/open-cloaked";
+import encoder from "@/lib/encoder";
+import { openCloaked } from "@/lib/open-cloaked";
 import type { Application } from "@/types/apps";
 import {
 	LucideHome,

src/components/shortcut-card.tsx

@@ -2,7 +2,7 @@ import { Link } from "react-router-dom";
 import { useAsync } from "@/hooks";
 import { libcurl } from "libcurl.js/bundled";
 import type { Application } from "@/types/apps";
-import encoder from "@/utils/encoder";
+import encoder from "@/lib/encoder";
 import {
 	Card,
 	CardContent,

src/components/shortcut-carousel.tsx

@@ -1,8 +1,8 @@
 import { useEffect } from "react";
-import { fetch } from "@/utils/fetch";
+import { fetch } from "@/lib/fetch";
 import { libcurl } from "libcurl.js/bundled";
 import { Link } from "react-router-dom";
-import encoder from "@/utils/encoder";
+import encoder from "@/lib/encoder";
 import {
 	Carousel,
 	CarouselContent,
@@ -54,30 +54,30 @@ export function ShortcutCarousel() {
 	return (
 		<Carousel>
 			<CarouselContent>
-				{!appError
-					? !loading
-						? apps
-							? apps
-									.filter((app) => app.featured)
-									.map((app) => (
-										<CarouselItem key={app.name} className="basis-1/4">
-											<Link
-												key={app.name}
-												to={`/view/${encodeURIComponent(encoder.encode(app.url))}`}
-												className="group relative"
-											>
-												<AppImage imageUrl={app.image} />
-												<div className="invisible absolute bottom-0 left-0 flex h-full w-full items-end justify-start rounded-lg bg-gradient-to-t from-card to-accent/50 p-4 text-left text-foreground group-hover:visible">
-													<h3 className="text-center font-medium">
-														{app.name}
-													</h3>
-												</div>
-											</Link>
-										</CarouselItem>
-									))
-							: null
-						: null
-					: null}
+				{!appError ? (
+					!loading ? (
+						apps ? (
+							apps
+								.filter((app) => app.featured)
+								.map((app) => (
+									<CarouselItem key={app.name} className="basis-1/4">
+										<Link
+											key={app.name}
+											to={`/view/${encodeURIComponent(encoder.encode(app.url))}`}
+											className="group relative"
+										>
+											<AppImage imageUrl={app.image} />
+											<div className="invisible absolute bottom-0 left-0 flex h-full w-full items-end justify-start rounded-lg bg-gradient-to-t from-card to-accent/50 p-4 text-left text-foreground group-hover:visible">
+												<h3 className="text-center font-medium">{app.name}</h3>
+											</div>
+										</Link>
+									</CarouselItem>
+								))
+						) : null
+					) : (
+						<Skeleton className="h-32 w-[56rem]" />
+					)
+				) : null}
 			</CarouselContent>
 			<CarouselPrevious />
 			<CarouselNext />

src/hooks/index.ts

@@ -1,7 +1,7 @@
 import localforage from "localforage";
 import { useState, useEffect, useRef, useCallback } from "react";
-import { fetch } from "@/utils/fetch";
-import { transports } from "@/utils/transports";
+import { fetch } from "@/lib/fetch";
+import { transports } from "@/lib/transports";
 
 interface Options {
 	useCurrentData?: boolean;

src/main-layout.tsx → src/layouts/main-layout.tsx

@@ -18,8 +18,8 @@ import {
 	TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { Navbar } from "@/components/layout-components";
-import packageJson from "../package.json";
-import encoder from "./utils/encoder";
+import packageJson from "../../package.json";
+import encoder from "../lib/encoder";
 const projectsUsed = [
 	{
 		name: "Ultraviolet",

src/root-layout.tsx → src/layouts/root-layout.tsx

@@ -1,6 +1,6 @@
 import { Helmet } from "react-helmet-async";
 import { useConfig } from "@/hooks";
-import Meta from "@/components/Meta";
+import Meta from "@/components/meta";
 import { Toaster } from "@/components/ui/toaster";
 import { Outlet } from "react-router-dom";
 const allowedOrigins = [

src/pages/Apps.tsx

@@ -6,7 +6,7 @@ import { useState, useEffect, useRef } from "react";
 import { useAsync } from "@/hooks";
 import type { Application } from "@/types/apps";
 import { Loader2, X } from "lucide-react";
-import { fetch } from "@/utils/fetch";
+import { fetch } from "@/lib/fetch";
 export default function Apps() {
 	const { loading, data: apps, error, run } = useAsync<Application[]>([]);
 	const [searchTerm, setSearchTerm] = useState("");

src/pages/Home.tsx

@@ -1,7 +1,7 @@
 import { useRef, useCallback, useEffect, useState } from "react";
-import { throttle } from "@/utils/throttle";
+import { throttle } from "@/lib/throttle";
 import { Link, useNavigate } from "react-router-dom";
-import encoder from "@/utils/encoder";
+import encoder from "@/lib/encoder";
 import {
 	Command,
 	CommandGroup,

src/pages/Settings.tsx

@@ -1,6 +1,6 @@
-import ProxySettings from "./settings/ProxySettings";
-import CloakSettings from "./settings/CloakSettings";
-import SearchSettings from "./settings/SearchSettings";
+import ProxySettings from "./settings/proxy";
+import CloakSettings from "./settings/cloak";
+import SearchSettings from "./settings/search";
 
 export default function Settings() {
 	return (

src/pages/View.tsx

@@ -1,7 +1,7 @@
 import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 import { Link, useParams } from "react-router-dom";
 import type { Eruda as baseEruda } from "eruda";
-import encoder from "@/utils/encoder";
+import encoder from "@/lib/encoder";
 import {
 	ArrowUpRightFromSquare,
 	ChevronLeft,
@@ -21,10 +21,10 @@ import {
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { useToast } from "@/components/ui/use-toast";
-import { throttle } from "@/utils/throttle";
+import { throttle } from "@/lib/throttle";
 import { useSuggestions, useConfig } from "@/hooks";
 import type { NavButton } from "@/types/view";
-import { injectPlugins } from "@/utils/injector";
+import { injectPlugins } from "@/lib/injector";
 interface Eruda extends baseEruda {
 	_isInit: boolean;
 }

src/pages/settings/CloakSettings.tsx → src/pages/settings/cloak.tsx

@@ -19,7 +19,7 @@ import {
 import { Label } from "@/components/ui/label";
 import { useToast } from "@/components/ui/use-toast";
 import { useConfig } from "@/hooks";
-import { openCloaked } from "@/utils/open-cloaked";
+import { openCloaked } from "@/lib/open-cloaked";
 import { Skeleton } from "@/components/ui/skeleton";
 
 export default function CloakSettings() {

src/pages/settings/ProxySettings.tsx → src/pages/settings/proxy.tsx

@@ -20,7 +20,7 @@ import {
 	SelectContent,
 	SelectItem,
 } from "@/components/ui/select";
-import { unregisterServiceWorker } from "@/utils/swUtil";
+import { unregisterServiceWorker } from "@/lib/sw";
 export default function ProxySettings() {
 	const { toast } = useToast();
 	const [config, reset, loading] = useConfig("proxy"); // Using the useConfig hook to get proxy settings

src/routes.tsx

@@ -1,19 +1,19 @@
 import { useEffect } from "react";
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 // layouts
-import RootLayout from "@/root-layout";
-import MainLayout from "@/main-layout";
+import RootLayout from "@/layouts/root-layout";
+import MainLayout from "@/layouts/main-layout";
 // pages
-import Home from "@/pages/Home";
-import View from "@/pages/View";
-import Settings from "@/pages/Settings";
-import Apps from "@/pages/Apps";
-import ServiceWorkerError from "@/pages/ServiceWorkerError";
+import Home from "@/pages/home";
+import View from "@/pages/view";
+import Settings from "@/pages/settings";
+import Apps from "@/pages/apps";
+import ServiceWorkerError from "@/pages/sw-error";
 import Error from "@/pages/error";
 // utils
 import { libcurl } from "libcurl.js/bundled";
 import { useConfig } from "./hooks";
-import { transports } from "./utils/transports";
+import { transports } from "./lib/transports";
 import {
 	SetTransport,
 	registerRemoteListener,
@@ -56,20 +56,19 @@ const routes = createBrowserRouter([
 export default function AppRoutes() {
 	const [config] = useConfig("proxy");
 	useEffect(() => {
-		libcurl.set_websocket(config.wispServer);
-		libcurl.onload = () => {
-			console.log(
-				"\x1b[34;49;1m[Ephemeral] \x1B[32mINFO: Libcurl.js version " +
-					libcurl.version.lib +
-					" loaded",
-			);
-			if (libcurl.ready) window.dispatchEvent(new Event("libcurlReady"));
-		};
 		try {
 			registerRemoteListener(navigator.serviceWorker.controller!);
 			SetTransport(transports[config.transport], {
 				wisp: config.wispServer,
 			});
+			libcurl.set_websocket(config.wispServer);
+			if (libcurl.ready) {
+				console.log(
+					"\x1b[34;49;1m[Ephemeral] \x1B[32mINFO: Libcurl.js version " +
+						libcurl.version.lib +
+						" loaded",
+				);
+			}
 		} catch (e) {
 			console.error(e);
 		}