Implement WCAG-compliant localized common tooltips for disabled upload and file menu actions

[yugalkaushik]

Fixes #3773, #3511, #3079
We can close the respective PRs #3514 #3497
Changes:

I have verified that this pull request:

• has no linting errors (npm run lint)
• has no test errors (npm run test)
• has no typecheck errors (npm run typecheck)
• is from a uniquely-named feature branch and is up to date with the develop branch.
• is descriptively named and links to an issue number, i.e. Fixes #123
• meets the standards outlined in the accessibility guidelines

[clairep94]

could we add some jsdocs for these types & tests for the new component?

Also tests would be great as the common folder has tests for most components now
I think it could be super basic like:

it('does not show the tooltip with the user is not hovering over the element', () => {
  // render tooltip with some child content

  // check screen that child content is present
  // check screen that tooltip text content is not present
})

it('shows the tooltip if the user hovers over the element', () => {
  // render tooltip with some child content

  // trigger a userEvent to hover over the child element
  
   // check screen that child content is present
  // check screen that tooltip text content is not present
})

it('displays the tooltip in the direction passed', () => {})
it('defaults to north if the direction is not passed', () => {})

[clairep94]

probably want to useMemo so this doesn't cause unnecessary re-renders

[clairep94]

syntax would be the below

const childProps = useMemo(() => ({...your object}),[...all the mentioned dependencies])

[clairep94]

personally for readability, I would split this into different useMemos by property, especially bc you have the .filter().join() mixed with a bunch of event handlers

But this is a style opinion so not blocking

[clairep94]

I'd maybe link this to TooltipProps so that in case the Tooltip API changes, this component gets synced:

tooltipContent?: TooltipProps['content']

[clairep94]

I'm not 100% familiar with how translations work
Does the translator default to check en-US if say fr-FR['SaveTooltipUnauthenticated'] doesn't work @raclim?

If not you might have to pop the temporary english into each of the language files as placeholders -- I thiiink this is the current pattern I've seen but not 10000% sure

[yugalkaushik]

@clairep94 Hi, this code needs some refinement, which I will address shortly. At the moment, I’m unable to spend enough time working on it.