Integracion con los PODS

en el carrito ya se puede entrar en los pods

webapp/src/components/ShoppingCart.tsx

@@ -4,6 +4,9 @@ import { useEffect, useState } from 'react';
 import { Rock } from '../shared/shareddtypes';
 import CartItem from './CartItem';
 import '../css/ShoppingCart.css';
+import ProfileViewer from './solid-pods/ProfileViewer';
+import { useSession } from '@inrupt/solid-ui-react';
+import LoginPod from './solid-pods/LoginPod';
 
 
 
@@ -28,7 +31,7 @@ const Cart: React.FC<Props> = ({ cartContent, handleAddToCart, handleRemoveFromC
         <Grid sx = {{width: 500}}>
             <h1 id='title-cart'>Shopping Cart</h1>
             {cartContent.length === 0 ? <h3>No items in the cart</h3> : null}
-            {/* {check2(cartContent)} */}
+
 
             <div className="items-cart">
                 {cartContent.map(item => (
@@ -41,15 +44,8 @@ const Cart: React.FC<Props> = ({ cartContent, handleAddToCart, handleRemoveFromC
                 ))}
                 <h2 id="price-cart">Total: {getTotalPrice().toFixed(2)} €</h2>
             </div>
-            <Button
-                size="medium"
-                disableElevation
-                variant="contained"
-                disabled={cartContent.length === 0}
-                href = "/payment"
-            >
-                BUY
-            </Button>
+
+            <LoginPod></LoginPod>
 
         </Grid>
     )

webapp/src/components/solid-pods/LoginPod.tsx

@@ -2,16 +2,30 @@ import { useState, useEffect } from 'react';
 import { SessionProvider, useSession } from "@inrupt/solid-ui-react";
 import LoginForm from "./LoginForm"
 import ProfileViewer from "./ProfileViewer"
+import React from 'react';
+import { Rock } from '../../shared/shareddtypes';
 
 //import {createData} from "./code/insertExampleData"
 
-function LoginPod(): JSX.Element {
+
+function LoginPod():  JSX.Element   {
 //We use this state variable
 const [isLoggedIn, setIsLoggedIn] = useState(false);
 
 //With this we can control the login status for solid
 const { session } = useSession();
 
+
+function getCartContent() {
+  const memoryCart = localStorage.getItem("cart");
+  if (memoryCart) {
+    return JSON.parse(memoryCart);
+  } else {
+    return [];
+  }
+}
+
+
 //We have logged in
 session.onLogin(()=>{
   setIsLoggedIn(true)
@@ -24,9 +38,12 @@ session.onLogout(()=>{
 
   return (
     <SessionProvider sessionId="log-in-example">
-      {(!isLoggedIn) ? <LoginForm/> : <ProfileViewer/>}
+
+      {(!isLoggedIn) ? <LoginForm/> : <ProfileViewer cartContent={getCartContent()}/>}
     </SessionProvider>
   )
 }
 
 export default LoginPod;
+
+

webapp/src/components/solid-pods/ProfileViewer.tsx

@@ -2,8 +2,13 @@ import { useSession, CombinedDataProvider, Image, LogoutButton, Text } from "@in
 import { Button, Card, CardActionArea, CardContent, Container, Typography } from "@material-ui/core";
 import { FOAF, VCARD } from "@inrupt/lit-generated-vocab-common";
 import GetPodAddress from './GetPodAddress';
+import { Rock } from "../../shared/shareddtypes";
 
-const ProfileViewer = () => {
+type Props = {
+  cartContent: Rock[];
+};
+
+const ProfileViewer: React.FC<Props> = ({cartContent}) => {
   const { session } = useSession();
 
   return (
@@ -28,6 +33,15 @@ const ProfileViewer = () => {
         </Button>
       </LogoutButton>
 
+      <Button
+          size="medium"
+          disableElevation
+          variant="contained"
+          disabled={cartContent.length === 0}
+          href = "/payment"
+      >
+          BUY
+      </Button>
 
     </Container>
   );