feat: add listening ports protocol selector #12915
Conversation
0964e8c to
c986370
Compare
| </Stack> | ||
| {filteredListeningPorts.length === 0 && ( | ||
| <HelpTooltipText css={styles.noPortText}> | ||
| {"No open ports were detected."} |
There was a problem hiding this comment.
| {"No open ports were detected."} | |
| No open ports were detected. |
| { | ||
| "The listening ports are exclusively accessible to you. Selecting HTTP/S will change the protocol for all listening ports." | ||
| } |
There was a problem hiding this comment.
| { | |
| "The listening ports are exclusively accessible to you. Selecting HTTP/S will change the protocol for all listening ports." | |
| } | |
| The listening ports are exclusively accessible to you. This option will change the protocol for all listening ports. |
| const filteredListeningPorts = (listeningPorts ? listeningPorts : []).filter( | ||
| (port) => { | ||
| for (let i = 0; i < filteredSharedPorts.length; i++) { | ||
| if (filteredSharedPorts[i].port === port.port) { | ||
| return false; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| return true; | ||
| }); | ||
| return true; | ||
| }, | ||
| ); |
There was a problem hiding this comment.
| const filteredListeningPorts = (listeningPorts ? listeningPorts : []).filter( | |
| (port) => { | |
| for (let i = 0; i < filteredSharedPorts.length; i++) { | |
| if (filteredSharedPorts[i].port === port.port) { | |
| return false; | |
| } | |
| } | |
| } | |
| return true; | |
| }); | |
| return true; | |
| }, | |
| ); | |
| const filteredListeningPorts = (listeningPorts ?? []).filter( | |
| (port) => filteredSharedPorts.every((sharedPort) => sharedPort.port !== port.port), | |
| ); |
| export const saveWorkspaceListeningPortsProtocol = ( | ||
| workspaceID: string, | ||
| protocol: WorkspaceAgentPortShareProtocol, | ||
| ) => { | ||
| localStorage.setItem( | ||
| `listening-ports-protocol-workspace-${workspaceID}`, | ||
| protocol, | ||
| ); | ||
| }; | ||
|
|
||
| export const getWorkspaceListeningPortsProtocol = ( | ||
| workspaceID: string, | ||
| ): WorkspaceAgentPortShareProtocol => { | ||
| return (localStorage.getItem( | ||
| `listening-ports-protocol-workspace-${workspaceID}`, | ||
| ) || "http") as WorkspaceAgentPortShareProtocol; | ||
| }; |
There was a problem hiding this comment.
I'm always wary of using localStorage for stuff like this. Can you share some of your rationale?
There was a problem hiding this comment.
I am too. We have had many group discussions (dean, jon, kyle, ben) around a few of the PRs coming out of Shared Ports about these protocol selection features. I've suggested keeping this state and other UX state in the DB in the past, but the group thought that putting this button in local storage is better than making a new table to track this stuff. We want an MVP that is feature complete, but can still iterate on later as we get customer feedback, and this was the solution we landed on for now.
There was a problem hiding this comment.
Gotcha. If it changes the protocol of all ports though, is it really "UI state"?
There was a problem hiding this comment.
I promise you I have brought up many different discussions about doing things with this on the backend but the conclusion the group came to was client side storage for now and that we can iterate on the design once we get feedback.
Relies on #12908 to be merged first.Closes #12902
Notes: