FIX JS tests

* Aggregate js translations

* Remove namespaces

* Remove namespaces from Trans components

* Add missing translations, remove namespaces, use correct hook

Author: dem4ron

app/javascript/components/common/HandleWithFlair.tsx

@@ -37,7 +37,7 @@ export function HandleWithFlair({
   iconClassName?: string
   className?: string
 }): JSX.Element | null {
-  const { t } = useAppTranslation('components/common/HandleWithFlair.tsx')
+  const { t } = useAppTranslation()
 
   return (
     <span className={assembleClassNames('flex items-center', className)}>

app/javascript/components/common/Loading.tsx

@@ -4,7 +4,7 @@ import React from 'react'
 import { useAppTranslation } from '@/i18n/useAppTranslation'
 
 export function Loading() {
-  const { t } = useAppTranslation('components/common/Loading.tsx')
+  const { t } = useAppTranslation()
   return (
     <div className="c-loading" role="alert">
       <span className="sr-only">{t('loading')}</span>

app/javascript/components/common/MarkdownEditor.tsx

@@ -31,7 +31,7 @@ export default function MarkdownEditor({
   onChange?: (value: string) => void
   options?: EasyMDE.Options
 }): JSX.Element {
-  const { t } = useAppTranslation('components/common/MarkdownEditor.tsx')
+  const { t } = useAppTranslation()
   const getInstance = useCallback(
     (editor) => {
       if (!editorDidMount) {

app/javascript/components/common/MarkdownEditorForm.tsx

@@ -63,7 +63,7 @@ export const MarkdownEditorForm = ({
     expanded ? '--expanded' : '--compressed',
   ].filter((className) => className.length > 0)
   const { isBelowLgWidth = false } = useContext(ScreenSizeContext) || {}
-  const { t } = useAppTranslation('components/common/MarkdownEditorForm.tsx')
+  const { t } = useAppTranslation()
 
   const handleSubmit = useCallback(
     (e) => {

app/javascript/components/common/MedianWaitTime.tsx

@@ -10,7 +10,7 @@ type MedianWaitTimeProps = {
 }
 
 export function MedianWaitTime({ seconds }: MedianWaitTimeProps) {
-  const { t } = useAppTranslation('components/common/MedianWaitTime.tsx')
+  const { t } = useAppTranslation()
 
   if (seconds === undefined || seconds === null) {
     return null

app/javascript/components/common/MentorDiscussionSummary.tsx

@@ -13,9 +13,7 @@ export const MentorDiscussionSummary = ({
   postsCount,
   createdAt,
 }: MentorDiscussion): JSX.Element => {
-  const { t } = useAppTranslation(
-    'components/common/MentorDiscussionSummary.tsx'
-  )
+  const { t } = useAppTranslation()
   const commentsClass = ['comments', isUnread ? 'unread' : '']
 
   return (

app/javascript/components/common/Pagination/index.tsx

@@ -17,7 +17,7 @@ export function Pagination({
   setPage,
   around = 2,
 }: PaginationProps): JSX.Element | null {
-  const { t } = useAppTranslation('components/common/Pagination.tsx')
+  const { t } = useAppTranslation()
 
   const {
     valid,

app/javascript/components/common/ProcessingStatusSummary.tsx

@@ -4,9 +4,7 @@ import { GraphicalIcon } from '.'
 import { useAppTranslation } from '@/i18n/useAppTranslation'
 
 function Content({ status }: { status: string }) {
-  const { t } = useAppTranslation(
-    'components/common/ProcessingStatusSummary.tsx'
-  )
+  const { t } = useAppTranslation()
 
   switch (status) {
     case 'processing':
@@ -53,9 +51,7 @@ export function ProcessingStatusSummary({
 }: {
   iterationStatus: IterationStatus
 }): JSX.Element {
-  const { t } = useAppTranslation(
-    'components/common/ProcessingStatusSummary.tsx'
-  )
+  const { t } = useAppTranslation()
 
   if (
     iterationStatus == IterationStatus.DELETED ||

app/javascript/components/common/Pronouns.tsx

@@ -10,7 +10,7 @@ export const Pronouns = ({
   handle: string
   pronouns?: string[]
 }): JSX.Element | null => {
-  const { t } = useAppTranslation('components/common/Pronouns.tsx')
+  const { t } = useAppTranslation()
   if (!pronouns || pronouns.length === 0) return null
 
   const useHandle = handle.toLowerCase() !== pronouns[0].toLowerCase()
@@ -38,7 +38,7 @@ export const Pronouns = ({
 }
 
 function createExample(handle: string, pronouns: string[]) {
-  const { t } = useAppTranslation('components/common/Pronouns.tsx')
+  const { t } = useAppTranslation()
   const pronounsString = pronouns.join(' / ')
   return (
     <>

app/javascript/components/common/ShareButton.tsx

@@ -16,7 +16,7 @@ export default function ShareButton({
   shareLink: string
   platforms: readonly SharePlatform[]
 }): JSX.Element {
-  const { t } = useAppTranslation('components/common/ShareButton.tsx')
+  const { t } = useAppTranslation()
   const { open, setOpen, buttonAttributes, panelAttributes } = usePanel({
     placement: 'bottom-end',
     modifiers: [