@oxyhq/services 0.0.59 → 0.0.61

package/README.md

@@ -1,3 +1,107 @@
 # OxyServicesModule
 
-npm publish
+## Usage Instructions
+
+To use the OxyServicesModule, follow these steps:
+
+1. Install the package:
+   ```bash
+   npm install @oxyhq/services
+   ```
+
+2. Import the necessary components and hooks in your project:
+   ```javascript
+   import { useOxySession, getUserById, SignInButton, AccountSwitcherModal, SessionOwnerButton } from '@oxyhq/services';
+   ```
+
+3. Use the components and hooks in your application. For example, to use the `SignInButton` component:
+   ```javascript
+   import React from 'react';
+   import { SignInButton } from '@oxyhq/services';
+
+   const App = () => {
+     return (
+       <div>
+         <SignInButton />
+       </div>
+     );
+   };
+
+   export default App;
+   ```
+
+## Examples
+
+### Example 1: Using `useOxySession` Hook
+
+The `useOxySession` hook fetches session data and provides error handling and status management.
+
+```javascript
+import React from 'react';
+import { useOxySession } from '@oxyhq/services';
+
+const SessionComponent = () => {
+  const { session, status, error } = useOxySession();
+
+  if (status === 'loading') {
+    return <div>Loading...</div>;
+  }
+
+  if (status === 'error') {
+    return <div>Error: {error}</div>;
+  }
+
+  return (
+    <div>
+      <h1>Welcome, {session.user.name}!</h1>
+      <p>Email: {session.user.email}</p>
+    </div>
+  );
+};
+
+export default SessionComponent;
+```
+
+### Example 2: Using `getUserById` Function
+
+The `getUserById` function fetches user data by ID and handles possible errors.
+
+```javascript
+import React, { useEffect, useState } from 'react';
+import { getUserById } from '@oxyhq/services';
+
+const UserComponent = ({ userId }) => {
+  const [user, setUser] = useState(null);
+  const [error, setError] = useState(null);
+
+  useEffect(() => {
+    const fetchUser = async () => {
+      try {
+        const fetchedUser = await getUserById(userId);
+        setUser(fetchedUser);
+      } catch (err) {
+        setError(err.message);
+      }
+    };
+
+    fetchUser();
+  }, [userId]);
+
+  if (error) {
+    return <div>Error: {error}</div>;
+  }
+
+  if (!user) {
+    return <div>Loading...</div>;
+  }
+
+  return (
+    <div>
+      <h1>{user.name}</h1>
+      <p>Email: {user.email}</p>
+    </div>
+  );
+};
+
+export default UserComponent;
+```

package/dist/components/auth/AccountSwitcherModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccountSwitcherModal.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AccountSwitcherModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAyB/B,eAAO,MAAM,oBAAoB;aAEpB,MAAM,IAAI;2CAkErB,CAAC"}
+{"version":3,"file":"AccountSwitcherModal.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AccountSwitcherModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAyB/B,eAAO,MAAM,oBAAoB;aAEpB,MAAM,IAAI;2CA0ErB,CAAC"}

package/dist/components/auth/AccountSwitcherModal.js

@@ -9,6 +9,7 @@ import { PiSignOutBold } from "react-icons/pi";
 import { AiOutlineClose } from "react-icons/ai";
 import { Avatar } from "../../features/profile";
 import getUserById from "../../hooks/getUserById";
+import styles from "./styles/session-owner-modal.module.css";
 export const AccountSwitcherModal = forwardRef(({ onClose }, ref) => {
     const { session } = useOxySession();
     const [user, setUser] = useState(null);
@@ -23,11 +24,16 @@ export const AccountSwitcherModal = forwardRef(({ onClose }, ref) => {
     }, [session]);
     if (!session)
         return null;
+    const handleBackdropClick = (e) => {
+        if (e.currentTarget === e.target) {
+            onClose();
+        }
+    };
     return (React.createElement(motion.div, { initial: { opacity: 0, y: "100%" }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: "100%" }, transition: {
             ease: "easeInOut",
             duration: 0.2,
-        }, className: "fixed m-auto top-0 bottom-0 left-0 right-0 w-fit h-fit z-10 flex flex-col items-center justify-center\n    space-y-3 rounded-3xl bg-indigo-50 px-5 py-3 text-sm font-medium text-zinc-700\n    shadow-md shadow-[#b4bebb]", role: "group" },
-        React.createElement("button", { className: "absolute right-3 top-3 rounded-full bg-indigo-50 p-1 hover:bg-zinc-200" },
+        }, className: styles.container, role: "group", onClick: handleBackdropClick },
+        React.createElement("button", { className: "absolute right-3 top-3 rounded-full bg-indigo-50 p-1 hover:bg-zinc-200", onClick: onClose },
             React.createElement(AiOutlineClose, { className: "h-5 w-5 rounded-full stroke-2 text-zinc-700" })),
         React.createElement("p", null, session?.user?.email),
         React.createElement("div", { className: "h-20 w-20 rounded-full border" },

package/dist/hooks/getUserById.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getUserById.d.ts","sourceRoot":"","sources":["../../src/hooks/getUserById.ts"],"names":[],"mappings":"AAGA,UAAU,IAAI;IACZ,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,WAAW,QAAe,MAAM,GAAG,MAAM,EAAE,WAAW,CAAC,MAAM,IAAI,CAAC,EAAE,kBAiBzE,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"getUserById.d.ts","sourceRoot":"","sources":["../../src/hooks/getUserById.ts"],"names":[],"mappings":"AAGA,UAAU,IAAI;IACZ,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,WAAW,QAAe,MAAM,GAAG,MAAM,EAAE,WAAW,CAAC,MAAM,IAAI,CAAC,EAAE,kBA4BzE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/hooks/getUserById.js

@@ -3,6 +3,9 @@ import { OXY_AUTH_URL } from "../config";
 const getUserById = async (id, fields) => {
     try {
         const response = await axios.get(OXY_AUTH_URL + `/api/users/${id}`);
+        if (response.status !== 200) {
+            throw new Error(`Unexpected response status: ${response.status}`);
+        }
         const user = fields
             ? fields.reduce((obj, key) => ({ ...obj, [key]: response.data[key] }), {})
             : response.data;
@@ -10,7 +13,15 @@ const getUserById = async (id, fields) => {
     }
     catch (error) {
         if (axios.isAxiosError(error)) {
-            throw new Error(error.message);
+            if (error.response) {
+                throw new Error(`Network error: ${error.message}, Status code: ${error.response.status}`);
+            }
+            else if (error.request) {
+                throw new Error("Network error: No response received from server.");
+            }
+            else {
+                throw new Error(`Network error: ${error.message}`);
+            }
         }
         else {
             throw new Error("An unknown error occurred while loading the user data.");

package/dist/hooks/useOxySession.d.ts

@@ -1,4 +1,3 @@
-type UserRole = "ADMIN" | "USER";
 interface SessionModel {
     user: {
         id: string;
@@ -9,9 +8,6 @@ interface SessionModel {
         verified: boolean;
         avatar: string;
         created_at: string;
-        isTwoFactorEnabled: boolean;
-        isOAuth: boolean;
-        role: UserRole;
     };
 }
 type SessionState = {

package/dist/hooks/useOxySession.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useOxySession.d.ts","sourceRoot":"","sources":["../../src/hooks/useOxySession.ts"],"names":[],"mappings":"AAOA,KAAK,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAEjC,UAAU,YAAY;IACpB,IAAI,EAAE;QACJ,EAAE,EAAE,MAAM,CAAC;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,UAAU,EAAE,MAAM,CAAC;QACnB,kBAAkB,EAAE,OAAO,CAAC;QAC5B,OAAO,EAAE,OAAO,CAAC;QACjB,IAAI,EAAE,QAAQ,CAAC;KAChB,CAAC;CACH;AAED,KAAK,YAAY,GAAG;IAClB,OAAO,EAAE,YAAY,GAAG,IAAI,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,eAAe,2EAuC1B,CAAC;AAEH,iBAAS,aAAa;;;;EAQrB;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"useOxySession.d.ts","sourceRoot":"","sources":["../../src/hooks/useOxySession.ts"],"names":[],"mappings":"AAOA,UAAU,YAAY;IACpB,IAAI,EAAE;QACJ,EAAE,EAAE,MAAM,CAAC;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,OAAO,CAAC;QAClB,MAAM,EAAE,MAAM,CAAC;QACf,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;CACH;AAED,KAAK,YAAY,GAAG;IAClB,OAAO,EAAE,YAAY,GAAG,IAAI,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,eAAe,2EA4D1B,CAAC;AAEH,iBAAS,aAAa;;;;EAQrB;AAED,eAAe,aAAa,CAAC"}

package/dist/hooks/useOxySession.js

@@ -26,12 +26,39 @@ export const useSessionStore = create((set) => {
                     // If the session ID was found in the URL parameters, set it in local storage
                     await localforage.setItem("clientKey", clientKey);
                 }
-                const responseSessions = await axios.get(OXY_AUTH_URL + "/api/sessions/" + clientKey);
-                const responseCurrentSession = await axios.get(OXY_AUTH_URL + "/api/session/" + responseSessions?.data.sessions[0].id);
-                set({ session: responseCurrentSession.data, status: "success" });
+                const response = await axios.get(OXY_AUTH_URL + "/api/session/" + clientKey);
+                if (response.status !== 200) {
+                    throw new Error(`Unexpected response status: ${response.status}`);
+                }
+                set({ session: response.data, status: "success" });
             }
             catch (error) {
-                set({ error, status: "error" });
+                if (axios.isAxiosError(error)) {
+                    if (error.response) {
+                        set({
+                            error: `Network error: ${error.message}, Status code: ${error.response.status}`,
+                            status: "error",
+                        });
+                    }
+                    else if (error.request) {
+                        set({
+                            error: "Network error: No response received from server.",
+                            status: "error",
+                        });
+                    }
+                    else {
+                        set({
+                            error: `Network error: ${error.message}`,
+                            status: "error",
+                        });
+                    }
+                }
+                else {
+                    set({
+                        error: "An unknown error occurred while loading the session data.",
+                        status: "error",
+                    });
+                }
             }
         },
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/services",
-  "version": "0.0.59",
+  "version": "0.0.61",
   "description": "",
   "homepage": "https://oxy.so/",
   "main": "./dist/index.js",
@@ -13,7 +13,7 @@
     "copy:css": "ncp temp dist",
     "build:ts": "tsc",
     "build": "npm run build:scss && npm run build:ts && npm run copy:css",
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "jest",
     "lint": "eslint src/**/*.{ts,tsx}"
   },
   "keywords": [],
@@ -25,6 +25,7 @@
     "url": "https://github.com/OxyHQ/OxyServicesModule.git"
   },
   "devDependencies": {
+    "@types/jest": "^29.5.3",
     "@types/next-auth": "^3.15.0",
     "@types/node": "^20.12.12",
     "@types/react": "^18.3.3",
@@ -33,6 +34,7 @@
     "@typescript-eslint/parser": "^7.0.1",
     "autoprefixer": "^10.4.19",
     "eslint": "^8.56.0",
+    "jest": "^29.6.2",
     "ncp": "^2.0.0",
     "sass": "^1.77.2",
     "tailwindcss": "^3.4.3",
@@ -43,9 +45,9 @@
     "axios": "^1.6.8",
     "clsx": "^2.1.1",
     "dotenv": "^16.4.5",
-    "framer-motion": "^11.3.19",
+    "framer-motion": "^11.2.9",
     "localforage": "^1.10.0",
-    "next": "^14.2.5",
+    "next": "^15.0.3",
     "postcss": "^8.4.38",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -54,4 +56,4 @@
     "zod": "^3.23.8",
     "zustand": "^4.5.2"
   }
-}
+}

package/dist/components/auth/AccountSwitcher.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-interface UserInfoProps {
-    setDisplayUserInfo: React.Dispatch<React.SetStateAction<boolean>>;
-}
-declare function UserInfo({ setDisplayUserInfo }: UserInfoProps): React.JSX.Element;
-export default UserInfo;
-//# sourceMappingURL=AccountSwitcher.d.ts.map

package/dist/components/auth/AccountSwitcher.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccountSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AccountSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,aAAa;IACrB,kBAAkB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CACnE;AAED,iBAAS,QAAQ,CAAC,EAAE,kBAAkB,EAAE,EAAE,aAAa,qBA8CtD;AAED,eAAe,QAAQ,CAAC"}

package/dist/components/auth/AccountSwitcher.js

@@ -1,27 +0,0 @@
-import React from "react";
-import Image from "next/image";
-import { signOut, useSession } from "next-auth/react";
-function UserInfo({ setDisplayUserInfo }) {
-    const { data: session } = useSession();
-    return (React.createElement("div", { className: "relative z-10 flex flex-col items-center justify-center\n    space-y-3 rounded-2xl bg-darkC2 px-5 py-3 text-sm font-medium text-textC\n    shadow-md shadow-[#b4bebb]" },
-        React.createElement("button", { onClick: () => setDisplayUserInfo((prev) => false), className: "absolute right-3 top-3 rounded-full bg-darkC2 p-1 hover:bg-darkC" }),
-        React.createElement("p", null, session?.user?.email),
-        React.createElement("div", { className: "h-20 w-20 rounded-full border" },
-            React.createElement(Image, { src: session?.user?.image, className: "h-full w-full rounded-full object-center", height: 500, width: 500, draggable: false, alt: "avatar" })),
-        React.createElement("h2", { className: "tablet:text-2xl text-xl font-normal" },
-            "Hi, ",
-            session?.user?.name,
-            "!"),
-        React.createElement("button", { className: "rounded-full border border-black px-7 py-2 text-textC2 hover:bg-[#d3dfee]" }, "Manage your Google Account"),
-        React.createElement("div", { className: "flex space-x-1" },
-            React.createElement("button", { className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-l-full bg-white py-3 pl-3  hover:bg-darkC" },
-                React.createElement("span", null, "Add account")),
-            React.createElement("button", { onClick: () => signOut(), className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-r-full bg-white py-3 pl-3  hover:bg-darkC" },
-                React.createElement("span", null, "Sign out"))),
-        React.createElement("div", { className: "flex h-10 items-center space-x-2 text-xs" },
-            React.createElement("span", null, "Privacy policy"),
-            React.createElement("span", { className: "-mt-[3px]" }, " . "),
-            " ",
-            React.createElement("span", null, "Terms of service"))));
-}
-export default UserInfo;

package/dist/components/auth/index.d.ts

@@ -1,3 +0,0 @@
-import SignInButton from "./SignInButton";
-export { SignInButton };
-//# sourceMappingURL=index.d.ts.map

package/dist/components/auth/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/auth/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/auth/index.js

@@ -1,2 +0,0 @@
-import SignInButton from "./SignInButton";
-export { SignInButton };

package/dist/components/auth/sign-in-button.module.css

@@ -1,33 +0,0 @@
-.container {
-  width: 100%;
-  padding: 0.7em;
-  border-radius: 100vmax;
-  font-size: var(--fs-milli);
-  font-weight: var(--fw-700);
-  color: var(--clr-dark);
-  background-color: var(--clr-light);
-  border: 1px solid var(--clr-auth-border);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  transition: background 0.2s ease-in-out;
-}
-.container:hover {
-  background-color: var(--clr-auth-button-hover);
-}
-.container:active {
-  background-color: var(--clr-auth-button-active);
-}
-.container:focus-visible {
-  outline: 2px solid var(--clr-light);
-  background-color: var(--clr-auth-button-hover);
-}
-.container svg {
-  width: var(--fs-h2);
-  height: var(--fs-h2);
-  fill: var(--clr-dark);
-  margin-right: 0.5em;
-}
-
-/*# sourceMappingURL=sign-in-button.module.css.map */

package/dist/components/auth/sign-in-button.module.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/components/auth/sign-in-button.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"sign-in-button.module.css"}