Feat: add a top-right share-button on the repo page

[li-xin-yi]

Change:

1. Remove the share-buttons on the dashboard, add it on the repo page.

2. Polish the share-project dialog, everyone accessing the repo can click the share-button (and the share option in right-click menu) to see the dialog, but the privilege levels vary:

• A read-only URL field to copy
• An owner can switch the visibility (public or private) by a button (ref:feat: create repo without a name; generate userId and repoId from server #142 (comment))
• Explanation about the visibility when clicking the help icon
• Fetch a list of current collaborators, the owner can delete any of them by clicking the button
• Invite others by collaborators (if you are not the owner, it doesn't work)
• Change of the visibility (isPublic and the list of collaborators) loads immediately after actions.

By the way, if there are no collaborators now, it looks like:

Please test carefully before merging.

Related to-do list:

1. Code involving error displaying looks quite messy, consider restructuring it via useReducer if I have time.
2. Recover the share-button on the dashboard if possible. I remove it mainly because the timer for TTL results in re-rendering dialog every second and hard to write those remote queries without store. But it is very inconvenient to share a project by entering it first.
3. Consider completely hiding/disabling the invitation context for non-owner user in the future. I just remain it and throw the access error when submitting for now.

[lihebi]

Thanks, Xinyi! This feature runs very well. Overall the code looks great to me. I left a couple of comments.

[lihebi]

We could remove this right-click menu item now.

[lihebi]

1. It seems that setShareOpen doesn't need to be passed in. You could call useStore to get it.
2. inRepo isn't general enough. I would use a buttonItem=null argument and pass in a ReactNode (just like the breadcrumbItem above). This way, the repo sharing UI & logic are not leaked into Header's implementation.

E.g.,

// repo.tsx
function ShareButton() {
  const setShareOpen = useStore(...);
  return <Box><Button onClick={()=>setShareOpen(true)}>...</Button></Box>
}
function RepoWrapper() {
  return <Box> ... <Header buttonItem={<ShareButton/>}/></Box>
}

// Header.tsx
function Header({..., buttonItem=null}) {
  return <Box> ... {buttonItem} ... </Box>
}

[li-xin-yi]

Update:

1. remove share-option in the right-click menu
2. remove inRepo, pass the button component to shareButton prop
3. disable the invite-button and email input filed for non-owner users in share-dialog.
4. compress the parameter list
5. use useReducer to manage various feedback messages in share-dialog to make the code more readable.

[lihebi]

This is a great feature and code, thanks!