-
Notifications
You must be signed in to change notification settings - Fork 27
/
StorageType.tsx
48 lines (46 loc) · 1.4 KB
/
StorageType.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import { Box, Button, Popover } from "@material-ui/core";
import PopupState, { bindPopover, bindTrigger } from "material-ui-popup-state";
import React from "react";
import { StorageClasses } from "types/disk";
import { VerticalHeadTable } from "widgets/VerticalHeadTable";
interface Props {
storageClasses: StorageClasses;
}
export const StorageType: React.FC<Props> = (props) => {
const { storageClasses } = props;
return (
<PopupState variant="popover" popupId={"disks-creation-helper"}>
{(popupState) => (
<>
<Button color="primary" size="small" variant="text" {...bindTrigger(popupState)}>
Type of storage
</Button>
<Popover
{...bindPopover(popupState)}
anchorOrigin={{
vertical: "bottom",
horizontal: "center",
}}
transformOrigin={{
vertical: "top",
horizontal: "center",
}}
>
<VerticalHeadTable
items={storageClasses.map((x) => ({
name: "Type: " + x.name,
content: (
<Box>
<Button variant="text" href={x.docLink} target="_blank">
Details
</Button>
</Box>
),
}))}
/>
</Popover>
</>
)}
</PopupState>
);
};