| 
 | 1 | +/**  | 
 | 2 | + * Copyright 2025 SAP SE  | 
 | 3 | + *  | 
 | 4 | + * Licensed under the Apache License, Version 2.0 (the "License");  | 
 | 5 | + * you may not use this file except in compliance with the License.  | 
 | 6 | + * You may obtain a copy of the License at  | 
 | 7 | + *  | 
 | 8 | + *     http://www.apache.org/licenses/LICENSE-2.0  | 
 | 9 | + *  | 
 | 10 | + * Unless required by applicable law or agreed to in writing, software  | 
 | 11 | + * distributed under the License is distributed on an "AS IS" BASIS,  | 
 | 12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  | 
 | 13 | + * See the License for the specific language governing permissions and  | 
 | 14 | + * limitations under the License.  | 
 | 15 | + */  | 
 | 16 | + | 
 | 17 | +import React from "react";  | 
 | 18 | +import { DataGrid, DataGridRow, IntroBox, LoadingIndicator, Message } from "@cloudoperators/juno-ui-components/index";  | 
 | 19 | +import useSortTableData from "../../hooks/useSortTable";  | 
 | 20 | +import MarketplaceDetails from "./MarketplaceDetails";  | 
 | 21 | + | 
 | 22 | +const Marketplace = (props) => {  | 
 | 23 | +  const { project, resource, publicCommitmentQuery, transferCommitment } = props;  | 
 | 24 | +  const { data, isLoading, isError, error } = publicCommitmentQuery;  | 
 | 25 | +  const publicCommitments = data?.commitments || [];  | 
 | 26 | + | 
 | 27 | +  const initialSortConfig = {  | 
 | 28 | +    expires_at: {  | 
 | 29 | +      direction: "ascending",  | 
 | 30 | +      sortStrategy: "numeric",  | 
 | 31 | +    },  | 
 | 32 | +  };  | 
 | 33 | +  const { items, TableSortHeader } = useSortTableData(publicCommitments, initialSortConfig);  | 
 | 34 | + | 
 | 35 | +  const headCells = [  | 
 | 36 | +    {  | 
 | 37 | +      key: "amount",  | 
 | 38 | +      label: "Amount",  | 
 | 39 | +      sortStrategy: "numeric",  | 
 | 40 | +    },  | 
 | 41 | +    {  | 
 | 42 | +      key: "availability_zone",  | 
 | 43 | +      label: "Zone",  | 
 | 44 | +      sortStrategy: "text",  | 
 | 45 | +    },  | 
 | 46 | +    {  | 
 | 47 | +      key: "duration",  | 
 | 48 | +      label: "Duration",  | 
 | 49 | +      sortStrategy: "text",  | 
 | 50 | +    },  | 
 | 51 | +    {  | 
 | 52 | +      key: "expires_at",  | 
 | 53 | +      label: "Expires",  | 
 | 54 | +      sortStrategy: "numeric",  | 
 | 55 | +    },  | 
 | 56 | +    {  | 
 | 57 | +      key: "edit",  | 
 | 58 | +      label: "Actions",  | 
 | 59 | +    },  | 
 | 60 | +  ];  | 
 | 61 | + | 
 | 62 | +  return (  | 
 | 63 | +    (isLoading && <LoadingIndicator className="m-auto" />) ||  | 
 | 64 | +    (isError && <Message variant="danger" text={error.toString()} />) ||  | 
 | 65 | +    (publicCommitments.length == 0 && <IntroBox text="No commitments available." />) || (  | 
 | 66 | +      <DataGrid columns={headCells.length}>  | 
 | 67 | +        <DataGridRow>  | 
 | 68 | +          {headCells.map((headCell) => (  | 
 | 69 | +            <TableSortHeader  | 
 | 70 | +              key={headCell.key}  | 
 | 71 | +              identifier={headCell.key}  | 
 | 72 | +              value={headCell.label}  | 
 | 73 | +              sortStrategy={headCell.sortStrategy}  | 
 | 74 | +            />  | 
 | 75 | +          ))}  | 
 | 76 | +        </DataGridRow>  | 
 | 77 | +        {items.map((commitment) => (  | 
 | 78 | +          <MarketplaceDetails  | 
 | 79 | +            key={commitment.id}  | 
 | 80 | +            project={project}  | 
 | 81 | +            resource={resource}  | 
 | 82 | +            commitment={commitment}  | 
 | 83 | +            transferCommitment={transferCommitment}  | 
 | 84 | +          />  | 
 | 85 | +        ))}  | 
 | 86 | +      </DataGrid>  | 
 | 87 | +    )  | 
 | 88 | +  );  | 
 | 89 | +};  | 
 | 90 | + | 
 | 91 | +export default Marketplace;  | 
0 commit comments