Remove default margin from client

Author: CannonLock

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pelicanplatform/components",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "homepage": "https://pelicanplatform.org",
   "repository": {
     "type": "git",

packages/components/src/AuthenticatedClient/AuthenticatedClient.tsx

@@ -78,8 +78,25 @@ function AuthenticatedClient() {
     } catch {}
   }, [namespace, objectUrl]);
 
+  console.log({
+    error,
+    setError,
+    objectUrl,
+    setObjectUrl,
+    collections,
+    loading,
+    authorizationRequired,
+    authorized,
+    handleLogin,
+    handleDownload,
+    handleUpload,
+    federation,
+    namespace,
+    getObjectList
+  })
+
   return (
-    <Box mt={6} {...(uploadRef.current?.dragHandlers ?? {})}>
+    <Box {...(uploadRef.current?.dragHandlers ?? {})}>
       <Box
         width={"100%"}
         sx={{
@@ -116,7 +133,7 @@ function AuthenticatedClient() {
                   if(!i.startsWith("/")) i = "/" + i;
                   if(i.endsWith("/")) i = i.slice(0, -1);
 
-                  setObjectUrl((prev) => prev + i)
+                  setObjectUrl((prev: string) => prev + i)
                   updateObjectList(objectUrl + i);
                 }}
               />

pnpm-lock.yaml

@@ -21,7 +21,7 @@
         "usehooks-ts": "^3.1.1",
         "@pelicanplatform/components": "workspace:*",
         "@pelicanplatform/web-client": "workspace:*",
-        "@pelicanplatform/web-client": "workspace:*"
+        "@pelicanplatform/hooks": "workspace:*"
     },
     "devDependencies": {
         "@types/node": "^20",

website/package.json

@@ -2,7 +2,8 @@
 
 import { Box, Container } from "@mui/material";
 import React from "react";
-import Client from "@pelicanplatform/components";
+import {AuthenticatedClient, PelicanClientProvider} from "@pelicanplatform/components";
+import ObjectUrlSetter from "../components/ObjectUrlSetter";
 
 export default function HomePageClient() {
 
@@ -16,10 +17,10 @@ export default function HomePageClient() {
         <Container maxWidth="lg">
             <Box minHeight={"90vh"} margin={4} width={"100%"} mx={"auto"}>
               {mounted &&
-                <Client
-                    objectUrl={"pelican://osg-htc.org/ospool/ap40"}
-                    enableAuth={true}
-                />
+                  <PelicanClientProvider initialObjectUrl={"pelican://osg-htc.org/ospool/ap40"} enableAuth={true} >
+                    <ObjectUrlSetter />
+                    <AuthenticatedClient />
+                  </PelicanClientProvider>
               }
             </Box>
         </Container>

website/src/app/HomePageClient.tsx

@@ -0,0 +1,36 @@
+"use client";
+
+import React from "react";
+import { TextField, Box } from "@mui/material";
+import { usePelicanClient } from "@pelicanplatform/hooks";
+
+/**
+ * ObjectUrlSetter component provides an input field to set the current object URL
+ * in the PelicanClientProvider context.
+ */
+export default function ObjectUrlSetter() {
+  const {
+    objectUrl,
+    setObjectUrl,
+    loading
+  } = usePelicanClient();
+
+  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setObjectUrl(event.target.value);
+  };
+
+  return (
+    <Box mb={2}>
+      <TextField
+        fullWidth
+        label="Object URL"
+        value={objectUrl}
+        onChange={handleChange}
+        disabled={loading}
+        placeholder="pelican://federation/namespace/path"
+        variant="outlined"
+        helperText="Enter a Pelican object URL"
+      />
+    </Box>
+  );
+}