Each workspace/row is a machine so each workspace can execute your actions and handle your own state.
We added polling in the workspaces machine, so the list is updated automatically.
We are using an optimistic update to set the workspace into the "Queued" state. I think this is way better than having a spinner inside of the tooltip and tracking it down in the component.
To update the workspaces machines I had to code some "complex" logic because:
- If we just recreate all the machines, we would lose the workspace state. Eg. Let's say one workspace is updating the version and after polling the new workspace data we recreate it. It will lose all the previous states because it will be a new instance.
- To avoid that, I had to verify if new items were created and spawning, update the ones with new data and stop and remove the actors that are not present anymore.
- You can see that in the actionupdateWorkspaceRefs
I'm not adding tests right now because it will take some time and I have to jump into other priority website tasks. Knowing that, is ok we open an exception and merge this if the current tests are ok? I promise to add the tests when I finish the website priority stuff. 🤞

Closes#2001

BrunoQuaresma added5 commits

June 13, 2022 18:07

Add version tooltup

e5cbcd8

Add update action

9d92df2

Add pooling

58d6a6a

Fix pooling

b4bc684

Fix pulling and workspace data update

ca18646

BrunoQuaresma self-assigned this

Jun 14, 2022

BrunoQuaresma requested a review froma team as acode owner

June 14, 2022 17:19

Kira-Pilot reviewed

Jun 14, 2022

View reviewed changes

site/src/components/HelpTooltip/HelpTooltip.tsx

		const helpTooltipContext = useContext(HelpTooltipContext)

		if (!helpTooltipContext) {
		throw new Error("This hook should be used in side of the HelpTooltipContext.")

Copy link

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

❤️

Kira-Pilot reviewed

Jun 14, 2022

View reviewed changes

site/src/pages/WorkspacesPage/WorkspacesPageView.tsx OutdatedShow resolvedHide resolved

Kira-Pilot reviewed

Jun 14, 2022

View reviewed changes

site/src/pages/WorkspacesPage/WorkspacesPageView.tsx

		@@ -76,6 +84,78 @@ const WorkspaceHelpTooltip: React.FC = () => {
		)
		}

		const OutdatedHelpTooltip: React.FC<{ onUpdateVersion: () => void }> = ({ onUpdateVersion }) => {

Copy link

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

I think this file is getting really big.

Copy link

CollaboratorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Yes, it is but, for now, I think it is ok. What do you think?

Copy link

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

We can leave it for now. I want to talk about directory structure at the next FE Variety - maybe we can look at pulling stuff apart then.

Kira-Pilot reviewed

Jun 14, 2022

View reviewed changes

site/src/xServices/workspaces/workspacesXService.tsShow resolvedHide resolved

Kira-Pilot reviewed

Jun 14, 2022

View reviewed changes

site/src/xServices/workspaces/workspacesXService.ts


		export const workspacesMachine = createMachine(
		{
		tsTypes: {} as import("./workspacesXService.typegen").Typegen0,
		tsTypes: {} as import("./workspacesXService.typegen").Typegen1,

Copy link

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

What's thisTypegen1 vsTypegen0?

Copy link

CollaboratorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

It is auto-generated by XState types:https://xstate.js.org/docs/guides/typescript.html#typegen

Kira-Pilot reviewed

Jun 15, 2022

View reviewed changes

site/src/components/HelpTooltip/HelpTooltip.tsx

		export const HelpTooltip: React.FC<HelpTooltipProps> = ({ children, open, size = "medium" }) => {
		const styles = useStyles({ size })
		const [anchorEl, setAnchorEl] = useState<HTMLButtonElement \| null>(null)
		open = open ?? Boolean(anchorEl)
		const id = open ? "help-popover" : undefined

		const onClose = () => {
		setAnchorEl(null)
		}

Copy link

Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Seems like when I click to escape the tooltip, regardless of where I click, I am automatically routed to the workspace page. Sometimes I just want to close the tooltip without leaving the list. Could we suppress navigation on close?

Copy link

CollaboratorAuthor

BrunoQuaresmaJun 15, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

I think it is because you are clicking on a workspace row when you click outside of the tooltip.

Copy link

Member

Kira-PilotJun 15, 2022•
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

It does it even if I click somewhere else on the page. I think it is using the initial click into the tooltip to navigate.

Kira-Pilot approved these changes

Jun 15, 2022

View reviewed changes

Copy link

Member

Kira-Pilot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Pulled this down and it looks and works great!

BrunoQuaresmaand others added2 commits

June 15, 2022 10:20

Update site/src/pages/WorkspacesPage/WorkspacesPageView.tsx

d982d55

Co-authored-by: Kira Pilot <kira@coder.com>

Fix formatting and add more context

e6145bd

Copy link

CollaboratorAuthor

BrunoQuaresma commentedJun 15, 2022

Chromatic deploys are failing, I reviewed the storybooks and they look good. I send a support message tosupport@chromatic.com.

BrunoQuaresmaenabled auto-merge (squash)

June 15, 2022 13:38

BrunoQuaresma merged commitb225953 intomain

Jun 15, 2022

BrunoQuaresma deleted the bq/add-outdated-tooltip branch

June 15, 2022 13:52

Labels

None yet

2 participants

Movatterモバイル変換

feat: Add "Outdated" tooltip and "Update version" button in the Workspaces page#2322

feat: Add "Outdated" tooltip and "Update version" button in the Workspaces page#2322

Uh oh!

Conversation

BrunoQuaresma commentedJun 14, 2022

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Kira-PilotJun 15, 2022• editedLoading Uh oh!There was an error while loading.Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Kira-Pilot left a comment

Choose a reason for hiding this comment

Uh oh!

BrunoQuaresma commentedJun 15, 2022

Uh oh!

Uh oh!

Kira-PilotJun 15, 2022•
edited
Loading