Skip to content
Snippets Groups Projects
index.tsx 1.25 KiB
Newer Older
  • Learn to ignore specific revisions
  • Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
    import { useState } from 'react';
    
    import { Page } from '../../components/Page';
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
    import APIService from "../../services/APIService";
    
    import { getHumanSize } from '../../commons/utils';
    import { BucketInfo } from '../../models/bucket';
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
    
    const BucketView = (bucketInfo: BucketInfo) => {
    
      const creationDate = new Date(bucketInfo.creation_date);
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
      return (
        <div className="bg-slate-100 w-2/3 mb-4 p-4 rounded-lg">
    
          <h1 className="text-2xl font-bold mb-2">{bucketInfo.name}</h1>
          <hr className="mb-2"></hr>
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
          <p>Created: {creationDate.toString()}</p>
    
          <p><b>Usage</b>: {getHumanSize(bucketInfo.size)}</p>
          <p><b>Object</b>: {bucketInfo.objects}</p>
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
        </div>
      )
    }
    
    
    export const Buckets = () => {
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
      const [isFirstRender, setIsFirstRender] = useState(true);
      const [buckestList, setBucketLists] = useState<BucketInfo[]>([]);
    
      if (isFirstRender) {
        setIsFirstRender(false);
        APIService.get("buckets")
          .then(data => {
            console.log(data);
    
            setBucketLists(data["buckets"]);
    
      return (
        <Page title='Buckets'>
    
          {buckestList ? buckestList.map(bucketInfo =>
    
    Jacopo Gasparetto's avatar
    Jacopo Gasparetto committed
            <BucketView
    
              key={bucketInfo.name + bucketInfo.creation_date}
              {...bucketInfo}
            />
          ) : null}