fix: göm ogiltiga datum i nyheter (#152)

.github/workflows/pr_check.yml

@@ -12,11 +12,17 @@ jobs:
     steps:
       - name: Checkout code
         uses: actions/checkout@v2
+
       - name: Setup Node
         uses: actions/setup-node@v1
         with:
           node-version: '14'
 
+      - name: Setup timezone
+        uses: zcong1993/setup-timezone@master
+        with:
+          timezone: Europe/Stockholm
+
       - name: Install dependencies
         run: npx lerna bootstrap
 

.github/workflows/release.yml

@@ -13,11 +13,17 @@ jobs:
     steps:
       - name: Checkout code
         uses: actions/checkout@v2
+
       - name: Setup Node
         uses: actions/setup-node@v1
         with:
           node-version: '14'
 
+      - name: Set timezone
+        uses: actions/set-timezone-action@v1.1
+        with:
+          timezoneLinux: "Europe/Stockholm"
+
       - name: Install dependencies
         run: npx lerna bootstrap
 

packages/app/components/__tests__/NewsItem.test.js

@@ -0,0 +1,99 @@
+import React from 'react'
+import { render } from '../../utils/testHelpers'
+import { NewsItem } from '../newsItem.component'
+import { fireEvent } from '@testing-library/react-native'
+import { useNewsDetails, useApi } from '@skolplattformen/api-hooks'
+
+jest.mock('@skolplattformen/api-hooks')
+
+const defaultNewsItem = {
+  author: 'Köket',
+  fullImageUrl: 'test.png',
+  header: 'K-bullar!',
+  published: '2021-02-15T09:13:28.484Z',
+  modified: '2021-02-15T09:13:28.484Z',
+}
+
+let navigation
+
+const setup = (customProps = { newsItem: {} }) => {
+  useApi.mockReturnValue({ api: { getSessionCookie: jest.fn() } })
+  useNewsDetails.mockReturnValue({
+    data: {
+      body: 'Nu blir det köttbullar',
+    },
+  })
+
+  navigation = {
+    goBack: jest.fn(),
+  }
+
+  const newsItem = {
+    ...defaultNewsItem,
+    ...customProps.newsItem,
+  }
+
+  const props = {
+    navigation,
+    route: {
+      params: {
+        child: { id: 1 },
+        newsItem,
+      },
+    },
+    ...customProps,
+  }
+
+  return render(<NewsItem {...props} />)
+}
+
+test('gets article details using useNewsDetails', () => {
+  setup()
+
+  expect(useNewsDetails).toHaveBeenCalledWith({ id: 1 }, defaultNewsItem)
+})
+
+test('renders an article', () => {
+  const screen = setup()
+
+  expect(screen.getByText(/k-bullar!/i)).toBeTruthy()
+  expect(screen.getByText(/nu blir det köttbullar/i)).toBeTruthy()
+  expect(screen.getByText('Publicerad: 15 feb. 2021 10:13')).toBeTruthy()
+  expect(screen.getByText('Uppdaterad: 15 feb. 2021 10:13')).toBeTruthy()
+})
+
+test('renders an article without published date if date is invalid', () => {
+  const newsItemWithoutPublishedDate = {
+    ...defaultNewsItem,
+    published: null,
+  }
+
+  const screen = setup({ newsItem: newsItemWithoutPublishedDate })
+
+  expect(screen.getByText(/k-bullar!/i)).toBeTruthy()
+  expect(screen.getByText(/nu blir det köttbullar/i)).toBeTruthy()
+  expect(screen.getByText('Uppdaterad: 15 feb. 2021 10:13')).toBeTruthy()
+  expect(screen.queryByText('Publicerad: Invalid DateTime')).toBeFalsy()
+})
+
+test('renders an article without modified date if date is invalid', () => {
+  const newsItemWithoutPublishedDate = {
+    ...defaultNewsItem,
+    modified: null,
+  }
+
+  const screen = setup({ newsItem: newsItemWithoutPublishedDate })
+
+  expect(screen.getByText(/k-bullar!/i)).toBeTruthy()
+  expect(screen.getByText(/nu blir det köttbullar/i)).toBeTruthy()
+  expect(screen.getByText('Publicerad: 15 feb. 2021 10:13')).toBeTruthy()
+  expect(screen.queryByText('Uppdaterad: Invalid DateTime')).toBeFalsy()
+})
+
+test('handles navigating back to child view', () => {
+  const screen = setup()
+
+  fireEvent.press(screen.getByA11yLabel('Tillbaka till barn'))
+
+  expect(navigation.goBack).toHaveBeenCalled()
+})

packages/app/components/newsItem.component.js

@@ -8,14 +8,15 @@ import {
   TopNavigation,
   TopNavigationAction,
 } from '@ui-kitten/components'
-import { DateTime } from 'luxon'
 import React from 'react'
 import { SafeAreaView, ScrollView, StyleSheet, View } from 'react-native'
 import { Image } from './image.component'
 import { Markdown } from './markdown.component'
+import moment from 'moment'
+import 'moment/locale/sv'
 
 const displayDate = (date) =>
-  DateTime.fromISO(date).setLocale('sv').toLocaleString(DateTime.DATETIME_MED)
+  moment(date).locale('sv').format('DD MMM. YYYY HH:mm')
 
 const BackIcon = (props) => <Icon {...props} name="arrow-back" />
 
@@ -28,23 +29,30 @@ export const NewsItem = ({ navigation, route }) => {
   }
 
   const BackAction = () => (
-    <TopNavigationAction icon={BackIcon} onPress={navigateBack} />
+    <TopNavigationAction
+      accessibilityLabel="Tillbaka till barn"
+      icon={BackIcon}
+      onPress={navigateBack}
+    />
   )
 
+  const publishedAt = displayDate(newsItem.published)
+  const modifiedAt = displayDate(newsItem.modified)
+
   const renderItemHeader = (headerProps) => (
     <View {...headerProps}>
       <Text category="h3">{newsItem.header}</Text>
       <Image src={newsItem.fullImageUrl} style={styles.image} />
-      <Text category="s1" appearance="hint">
-        {newsItem.published
-          ? `Publicerad: ${displayDate(newsItem.published)}`
-          : ''}
-      </Text>
-      <Text category="s1" appearance="hint">
-        {newsItem.modified
-          ? `Uppdaterad: ${displayDate(newsItem.modified)}`
-          : ''}
-      </Text>
+      {publishedAt !== 'Invalid DateTime' && (
+        <Text category="s1" appearance="hint">
+          Publicerad: {publishedAt}
+        </Text>
+      )}
+      {modifiedAt !== 'Invalid DateTime' && (
+        <Text category="s1" appearance="hint">
+          Uppdaterad: {modifiedAt}
+        </Text>
+      )}
     </View>
   )