@@ -14,6 +14,7 @@ import MenuItem from "@mui/material/MenuItem";
1414import Select from "@mui/material/Select" ;
1515import Stack from "@mui/material/Stack" ;
1616import TextField from "@mui/material/TextField" ;
17+ import Tooltip from "@mui/material/Tooltip" ;
1718import { type FormikContextType , useFormik } from "formik" ;
1819import type { FC } from "react" ;
1920import { useQuery , useMutation } from "react-query" ;
@@ -204,6 +205,23 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
204205const canSharePortsPublic =
205206canSharePorts && template . max_port_share_level === "public" ;
206207
208+ const publicMenuItem = (
209+ < >
210+ { canSharePortsPublic ?(
211+ < MenuItem value = "public" > Public</ MenuItem >
212+ ) :(
213+ < Tooltip title = "This workspace template does not allow sharing ports with unauthenticated users." >
214+ { /* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */ }
215+ < div >
216+ < MenuItem value = "public" disabled >
217+ Public
218+ </ MenuItem >
219+ </ div >
220+ </ Tooltip >
221+ ) }
222+ </ >
223+ ) ;
224+
207225return (
208226< >
209227< div
@@ -429,12 +447,7 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
429447< MenuItem value = "authenticated" >
430448 Authenticated
431449</ MenuItem >
432- < MenuItem
433- value = "public"
434- disabled = { ! canSharePortsPublic }
435- >
436- Public
437- </ MenuItem >
450+ { publicMenuItem }
438451</ Select >
439452</ FormControl >
440453< Button
@@ -499,9 +512,7 @@ export const PortForwardPopoverView: FC<PortForwardPopoverViewProps> = ({
499512label = "Sharing Level"
500513>
501514< MenuItem value = "authenticated" > Authenticated</ MenuItem >
502- < MenuItem value = "public" disabled = { ! canSharePortsPublic } >
503- Public
504- </ MenuItem >
515+ { publicMenuItem }
505516</ TextField >
506517< LoadingButton
507518variant = "contained"