mirror of https://github.com/coder/coder.git
fix: display tooltip when selection is disabled (#12439)
This commit is contained in:
parent
586586e9dd
commit
d2a74cf547
|
@ -14,6 +14,7 @@ import MenuItem from "@mui/material/MenuItem";
|
||||||
import Select from "@mui/material/Select";
|
import Select from "@mui/material/Select";
|
||||||
import Stack from "@mui/material/Stack";
|
import Stack from "@mui/material/Stack";
|
||||||
import TextField from "@mui/material/TextField";
|
import TextField from "@mui/material/TextField";
|
||||||
|
import Tooltip from "@mui/material/Tooltip";
|
||||||
import { type FormikContextType, useFormik } from "formik";
|
import { type FormikContextType, useFormik } from "formik";
|
||||||
import type { FC } from "react";
|
import type { FC } from "react";
|
||||||
import { useQuery, useMutation } from "react-query";
|
import { useQuery, useMutation } from "react-query";
|
||||||
|
@ -204,6 +205,23 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
|
||||||
const canSharePortsPublic =
|
const canSharePortsPublic =
|
||||||
canSharePorts && template.max_port_share_level === "public";
|
canSharePorts && template.max_port_share_level === "public";
|
||||||
|
|
||||||
|
const publicMenuItem = (
|
||||||
|
<>
|
||||||
|
{canSharePortsPublic ? (
|
||||||
|
<MenuItem value="public">Public</MenuItem>
|
||||||
|
) : (
|
||||||
|
<Tooltip title="This workspace template does not allow sharing ports with unauthenticated users.">
|
||||||
|
{/* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */}
|
||||||
|
<div>
|
||||||
|
<MenuItem value="public" disabled>
|
||||||
|
Public
|
||||||
|
</MenuItem>
|
||||||
|
</div>
|
||||||
|
</Tooltip>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div
|
<div
|
||||||
|
@ -429,12 +447,7 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
|
||||||
<MenuItem value="authenticated">
|
<MenuItem value="authenticated">
|
||||||
Authenticated
|
Authenticated
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem
|
{publicMenuItem}
|
||||||
value="public"
|
|
||||||
disabled={!canSharePortsPublic}
|
|
||||||
>
|
|
||||||
Public
|
|
||||||
</MenuItem>
|
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
<Button
|
<Button
|
||||||
|
@ -499,9 +512,7 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
|
||||||
label="Sharing Level"
|
label="Sharing Level"
|
||||||
>
|
>
|
||||||
<MenuItem value="authenticated">Authenticated</MenuItem>
|
<MenuItem value="authenticated">Authenticated</MenuItem>
|
||||||
<MenuItem value="public" disabled={!canSharePortsPublic}>
|
{publicMenuItem}
|
||||||
Public
|
|
||||||
</MenuItem>
|
|
||||||
</TextField>
|
</TextField>
|
||||||
<LoadingButton
|
<LoadingButton
|
||||||
variant="contained"
|
variant="contained"
|
||||||
|
|
Loading…
Reference in New Issue