Move strings to json file

ooni · Nov 27, 2023 · f50af6f · f50af6f · vercel · Nov 27, 2023
1 parent ef8118e
commit f50af6f
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 27 deletions.
diff --git a/components/findings/FindingDisplay.js b/components/findings/FindingDisplay.js
@@ -27,6 +27,10 @@ const FormattedMarkdown = ({ children }) => {
 const FindingDisplay = ({ incident }) => {
   const intl = useIntl()
 
+  const reportedBy = incident?.reported_by
+  const formattedCreationDate = incident?.create_time && formatLongDate(incident?.create_time, intl.locale)
+  const listOfNetworks = incident?.ASNs?.map((as) => (<NLink key={as} href={`/as/AS${as}`}>{`AS${as}`}</NLink>)).reduce((prev, curr) => (prev ? [prev, ', ', curr] : curr), null)
+
   return (
     <>
       <Heading h={1} mt={4} mb={4} pb={3} sx={{borderBottom: '1px solid', borderColor: 'gray3'}}>
@@ -50,8 +54,12 @@ const FindingDisplay = ({ incident }) => {
           ))}
         </Flex>
       )}
-      <Text color="gray6" mb={4}>created by {incident?.reported_by} on {incident?.create_time && formatLongDate(incident?.create_time, intl.locale)}</Text>
-      {!!incident?.ASNs?.length && <Box mb={3} fontSize={18} lineHeight="1.5">Network: {incident.ASNs.map((as) => (<NLink key={as} href={`/as/AS${as}`}>{`AS${as}`}</NLink>)).reduce((prev, curr) => (prev ? [prev, ', ', curr] : curr), null)}</Box>}
+      <Text color="gray6" mb={4}>{intl.formatMessage({id: 'Findings.Display.CreatedByOn'}, {reportedBy, formattedDate: formattedCreationDate})}</Text>
+      {!!incident?.ASNs?.length && 
+        <Box mb={3} fontSize={18} lineHeight="1.5">
+          {intl.formatMessage({id: 'Findings.Display.Network'}, { listOfNetworks })}
+        </Box>
+      }
       <Box fontSize={18} lineHeight="1.5">{incident?.text && <FormattedMarkdown>{incident.text}</FormattedMarkdown>}</Box>
     </>
   )

diff --git a/pages/findings/[id].js b/pages/findings/[id].js
@@ -44,7 +44,7 @@ const ReportView = () => {
       <NavBar />
       <Container>
         {loading && <SpinLoader />}
-        {error && <NotFound title="Report not found" />}
+        {error && <NotFound title={intl.formatMessage({id: 'Findings.Display.NotFound'})} />}
         {data && <FindingDisplay incident={data.incident} />}
       </Container>
     </>

diff --git a/pages/findings/dashboard.js b/pages/findings/dashboard.js
@@ -30,12 +30,6 @@ th, td {
 }
 `
 
-const StyledRow = styled.tr`
-// &:nth-child(even) {
-//   background-color: gray;
-// }
-`
-
 const Dashboard = () => {
   const intl = useIntl()
   const { user, loading } = useUser()
@@ -83,9 +77,7 @@ const Dashboard = () => {
         header: 'Title',
         accessorKey: 'title',
         cell: info => (
-          <NLink href={`/findings/${info.row.original.id}`}>
-            <Button variant='link'>{info.getValue()}</Button>
-          </NLink>
+          <NLink href={`/findings/${info.row.original.id}`}>{info.getValue()}</NLink>
         )
       },
       {
@@ -166,9 +158,9 @@ const Dashboard = () => {
             <thead>
               {table.getHeaderGroups().map(headerGroup => (
                 <tr key={headerGroup.id}>
-                  {headerGroup.headers.map(header => {
+                  {headerGroup.headers.map((header, i) => {
                     return (
-                      <th key={header.id} colSpan={header.colSpan}>
+                      <th key={header.id} colSpan={header.colSpan} style={i === 0 ? {width: '370px'} : {}}>
                         {header.isPlaceholder ? null : (
                           <div
                             {...{
@@ -200,7 +192,7 @@ const Dashboard = () => {
                 .rows
                 .map(row => {
                   return (
-                    <StyledRow key={row.id}>
+                    <tr key={row.id}>
                       {row.getVisibleCells().map(cell => {
                         return (
                           <td key={cell.id}>
@@ -211,7 +203,7 @@ const Dashboard = () => {
                           </td>
                         )
                       })}
-                    </StyledRow>
+                    </tr>
                   )
                 })}
             </tbody>

diff --git a/pages/findings/index.js b/pages/findings/index.js
@@ -90,21 +90,21 @@ const Index = () => {
       </StyledStickyNavBar>
       <Container>
         {user?.role === 'admin' && (
-          <Flex justifyContent="end" mt={3}><NLink href="/findings/dashboard"><Button hollow>{intl.formatMessage({id: 'Findings.Dashboard.Short'})}</Button></NLink></Flex>
+          <Flex justifyContent="end" mt={3}><NLink href="/findings/dashboard"><Button hollow>{intl.formatMessage({id: 'Findings.Dashboard.ShortTitle'})}</Button></NLink></Flex>
         )}
         <StyledStickySubMenu>
           <Flex mt={user?.role === 'admin' ? 0 : 5} mb={2} justifyContent='space-between' alignItems='baseline'>
             <Heading h={1} mt={1} mb={0}>
-              {intl.formatMessage({id: 'Findings.Title'}, {amount: sortedAndFilteredData.length})}
+              {intl.formatMessage({id: 'Findings.Index.Title'}, {amount: sortedAndFilteredData.length})}
             </Heading>
             <Flex sx={{gap: 3}}>
               <Box>
                 <Input
                   onChange={(e) => debouncedSearchHandler(e.target.value)}
-                  placeholder={intl.formatMessage({id: 'Findings.SearchPlaceholder'})}
+                  placeholder={intl.formatMessage({id: 'Findings.Index.SearchPlaceholder'})}
                   error={
                     (searchValue && sortedAndFilteredData?.length === 0) && 
-                    <>{intl.formatMessage({id: 'Findings.SearchError'})}</>
+                    <>{intl.formatMessage({id: 'Findings.Index.SearchError'})}</>
                   }
                 />
               </Box>
@@ -131,14 +131,14 @@ const Index = () => {
                     {incident.start_time && formatLongDate(incident.start_time, intl.locale)} - {incident.end_time ? formatLongDate(incident.end_time, intl.locale) : 'ongoing'}
                   </Text>
                   <Text color="gray6">
-                    created on {incident?.create_time && formatLongDate(incident?.create_time, intl.locale)}
+                    {intl.formatMessage({id: 'Findings.Index.HighLightBox.CreatedOn'}, {date: incident?.create_time && formatLongDate(incident?.create_time, intl.locale)})}
                   </Text>
                 </>
               }
               footer={
                 <Box textAlign="center" mt={2}>
                   <NLink href={`/findings/${incident.id}`}>
-                    <Button size="small" hollow>Read More</Button>
+                    <Button size="small" hollow>{intl.formatMessage({id: 'Findings.Index.HighLightBox.ReadMore'})}</Button>
                   </NLink>
                 </Box>
               }

diff --git a/public/static/lang/en.json b/public/static/lang/en.json
@@ -628,15 +628,17 @@
   "Networks.Title": "Networks",
   "Networks.SearchPlaceholder": "Search by ASN",
   "Networks.SearchError": "No networks found",
-  "Findings.Title": "Censorship Findings ({amount})",
-  "Findings.SearchPlaceholder": "Search for findings",
-  "Findings.SearchError": "No findings found",
+  "Findings.Index.Title": "Censorship Findings ({amount})",
+  "Findings.Index.SearchPlaceholder": "Search for findings",
+  "Findings.Index.SearchError": "No findings found",
+  "Findings.Index.HighLightBox.ReadMore": "Read More",
+  "Findings.Index.HighLightBox.CreatedOn": "created on {date}",
   "Findings.Edit.Title": "Edit Censorship Finding",
   "Findings.Edit.ShowPreview": "Show Preview",
   "Findings.Edit.Delete": "Delete",
   "Findings.Create.Title": "Create Finding",
   "Findings.Dashboard.Title": "Censorship Findings Dashboard",
-  "Findings.Dashboard.Short": "Dashboard",
+  "Findings.Dashboard.ShortTitle": "Dashboard",
   "Findings.Dashboard.Edit": "Edit",
   "Findings.Dashboard.Publish": "Publish",
   "Findings.Dashboard.Unpublish": "Unpublish",
@@ -655,5 +657,8 @@
   "Findings.Form.Author.Label": "Author*",
   "Findings.Form.EmailAddress.Label": "Email Address*",
   "Findings.Form.Published.Label": "Published",
-  "Findings.LoginRequiredModal.Title": "Email address is missing. Please log in again to be able to create a censorship finding."
+  "Findings.LoginRequiredModal.Title": "Email address is missing. Please log in again to be able to create a censorship finding.",
+  "Findings.Display.NotFound": "Censorship Finding not found",
+  "Findings.Display.CreatedByOn": "created by {reportedBy} on {formattedDate}",
+  "Findings.Display.Network": "Network: {listOfNetworks}"
 }