Update AccountSwitcherModal and styles; refactor getUser error handling

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/services",
-  "version": "0.0.70",
+  "version": "0.0.72",
   "description": "",
   "homepage": "https://oxy.so/",
   "main": "./dist/index.js",

src/components/auth/AccountSwitcherModal.tsx

@@ -13,7 +13,7 @@ import { Avatar } from "../../features/profile";
 
 import getUserById from "../../hooks/getUserById";
 
-import styles from "./styles/session-owner-modal.module.css";
+import styles from "./styles/account-switcher-modal.module.css";
 
 interface User {
   id: string;
@@ -24,10 +24,15 @@ interface User {
   avatar: string;
 }
 
+interface AccountSwitcherModalProps {
+  onClose: () => void;
+}
+
 export const AccountSwitcherModal = forwardRef<
-  HTMLButtonElement,
-  { onClose: () => void }
->(({ onClose }, ref) => {
+  HTMLDivElement,
+  AccountSwitcherModalProps
+>((props, ref) => {
+  const { onClose } = props;
   const { session } = useOxySession();
   const [user, setUser] = useState<User | null>(null);
   const [error, setError] = useState<string | null>(null);
@@ -72,6 +77,7 @@ export const AccountSwitcherModal = forwardRef<
       className={styles.container}
       role="group"
       onClick={handleBackdropClick}
+      ref={ref}
     >
       <button
         className="absolute right-3 top-3 rounded-full bg-indigo-50 p-1 hover:bg-zinc-200"

src/components/auth/SessionOwnerButton.tsx

@@ -60,10 +60,7 @@ export const SessionOwnerButton = () => {
             background="none"
             minViewportWidth={500}
           >
-            <AccountSwitcherModal
-              ref={buttonRef}
-              onClose={() => setIsModalOpen(false)}
-            />
+            <AccountSwitcherModal onClose={() => setIsModalOpen(false)} />
           </Modal>
         )}
       </AnimatePresence>

src/hooks/get-user.ts

@@ -2,25 +2,29 @@ import axios from "axios";
 import { OXY_AUTH_URL } from "../config";
 
 export const getUser = async (id: string | undefined) => {
+  if (!id) {
+    throw new Error("User ID is required");
+  }
   try {
     const response = await axios.get(OXY_AUTH_URL + `/api/users/${id}`);
     return response.data;
   } catch (error: any) {
-    if (error.response) {
-      // The request was made and the server responded with a status code
-      // that falls out of the range of 2xx
-      console.log(error.response.data);
-      console.log(error.response.status);
-      console.log(error.response.headers);
-    } else if (error.request) {
-      // The request was made but no response was received
-      // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
-      // http.ClientRequest in node.js
-      console.log(error.request);
+    if (axios.isAxiosError(error)) {
+      if (error.response) {
+        // Server responded with a status code outside of 2xx
+        throw new Error(
+          `Server responded with status ${error.response.status}: ${error.response.data}`
+        );
+      } else if (error.request) {
+        // Request was made but no response received
+        throw new Error("No response received from server");
+      } else {
+        // Error setting up the request
+        throw new Error(`Axios error: ${error.message}`);
+      }
     } else {
-      // Something happened in setting up the request that triggered an Error
-      console.log("Error", error.message);
+      // Non-Axios error
+      throw error;
     }
-    console.log(error.config);
   }
 };