@quintype/native-components 2.20.10 → 2.20.11

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [2.20.11](https://github.com/quintype/native-components/compare/v2.20.10...v2.20.11) (2023-08-10)
+
 ### [2.20.10](https://github.com/quintype/native-components/compare/v2.20.9...v2.20.10) (2023-08-08)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quintype/native-components",
-  "version": "2.20.10",
+  "version": "2.20.11",
   "description": "",
   "main": "src/index.js",
   "scripts": {

package/src/components/PrimaryStoryCard/index.js

@@ -30,9 +30,10 @@ export const PrimaryStoryCard = (props) => {
     locale,
     reverseTimeAdverbPosition,
     enableReadTimeOnStoryCards,
+    DATE_TIME_FORMAT,
   } = theme || {};
 
-  const DATE_FORMAT = 'd MMM, yyyy';
+  const DATE_FORMAT = DATE_TIME_FORMAT.dateFormat;
 
   const styles = storyStyles(COLORS, FONT_SIZE);
   const containerStyle = StyleSheet.flatten([

package/src/components/PrimaryStoryCardNew/index.js

@@ -27,6 +27,7 @@ const PrimaryStoryCardNewBase = (props) => {
     DARK_MODE,
     reverseTimeAdverbPosition,
     enableReadTimeOnStoryCards,
+    DATE_TIME_FORMAT,
   } = theme || {};
 
   const translate = get(theme, ['translate'], (word) => word);
@@ -45,7 +46,7 @@ const PrimaryStoryCardNewBase = (props) => {
     props.timestampStyle,
   ]);
 
-  const DATE_FORMAT = 'd MMM, yyyy';
+  const DATE_FORMAT = DATE_TIME_FORMAT.dateFormat;
   const readTime = enableReadTimeOnStoryCards && story['read-time']
     ? `${story['read-time']} ${translate('min read')} · `
     : '';

package/src/components/SecondaryStoryCard/index.js

@@ -34,11 +34,12 @@ export const SecondaryStoryCard = (props) => {
     COLORS,
     reverseTimeAdverbPosition,
     enableReadTimeOnStoryCards,
+    DATE_TIME_FORMAT,
   } = theme;
   const styles = secStoryCardStyles(theme);
   const { story = {} } = props;
 
-  const DATE_FORMAT = 'd MMM, yyyy';
+  const DATE_FORMAT = DATE_TIME_FORMAT.dateFormat;
 
   const containerStyle = StyleSheet.flatten([
     styles.container,

package/src/components/SecondaryStoryCardNew/index.js

@@ -32,6 +32,7 @@ const SecondaryStoryCardNewBase = (props) => {
     COLORS,
     reverseTimeAdverbPosition,
     enableReadTimeOnStoryCards,
+    DATE_TIME_FORMAT,
   } = theme;
 
   const translate = get(theme, ['translate'], (word) => word);
@@ -50,7 +51,7 @@ const SecondaryStoryCardNewBase = (props) => {
     props.timestampStyle,
   ]);
 
-  const DATE_FORMAT = 'd MMM, yyyy';
+  const DATE_FORMAT = DATE_TIME_FORMAT.dateFormat;
   const readTime = enableReadTimeOnStoryCards && story['read-time']
     ? `${story['read-time']} ${translate('min read')} · `
     : '';

package/src/components/StoryHeader/index.js

@@ -19,8 +19,6 @@ import { COMP_CONTENT_CONSTANTS } from '../../constants/component-constants/cont
 
 import { DailyMotionPlayer } from '../DailyMotionPlayer';
 
-const DATE_FORMAT = 'd  MMMM yyyy h:mm a';
-
 const getHeroImage = (cdn, story) => {
   const imageSlug = story['hero-image-s3-key'];
   if (!imageSlug) return null;
@@ -66,11 +64,17 @@ export const StoryHeader = (props) => {
   const { story } = props;
   const sectionData = get(story, ['sections', 0], {});
   const { theme } = useContext(AppTheme);
-  const { COLORS, locale, FONT_FAMILY } = theme;
+
+  const {
+    COLORS, locale, FONT_FAMILY, DATE_TIME_FORMAT,
+  } = theme;
+
+  const DATE_FORMAT = `${DATE_TIME_FORMAT.dateFormat} ${DATE_TIME_FORMAT.timeFormat}`;
   const styles = storyHeaderStyles(COLORS, FONT_FAMILY);
   const caption = story['hero-image-caption'];
   const attribution = story['hero-image-attribution'];
 
+
   const showAttribution = () => {
     if (!caption && !attribution) {
       return null;

package/src/themes/theme.js

@@ -45,3 +45,8 @@ export const FONT_FAMILY = {
 export const CAN_COPY_TEXT = false;
 export const NETWORK_TYPE = '3g';
 export const IMAGE_QUALITY = '30';
+
+export const DATE_TIME_FORMAT = {
+  dateFormat: 'dd MMM yyyy',
+  timeFormat: 'h:mm aa',
+};

package/src/utils/context.js

@@ -6,6 +6,7 @@ import {
   CAN_COPY_TEXT,
   NETWORK_TYPE,
   IMAGE_QUALITY,
+  DATE_TIME_FORMAT,
 } from '../themes/theme';
 
 export const THEME_CONFIG = {
@@ -16,5 +17,6 @@ export const THEME_CONFIG = {
   NETWORK_TYPE,
   locale: 'enIN',
   IMAGE_QUALITY,
+  DATE_TIME_FORMAT,
 };
 export const AppTheme = createContext(THEME_CONFIG);