Merge pull request #601 from xproglabs/feat/addSubjectIcon

Feat/add subject icon
xproglabs · Sep 19, 2023 · 0b46c93 · 0b46c93
2 parents 2981bf5 + 0162da8
commit 0b46c93
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 13 deletions.
diff --git a/components/Teaser/RenderSubject.tsx b/components/Teaser/RenderSubject.tsx
@@ -14,8 +14,7 @@ export type SubjectLayout = {
   color?: ColorTokens;
   enabled?: boolean;
   font_size?: [string, string];
-  hasIcon?: boolean;
-  iconComponent?: any;
+  iconComponent?: any
   line_height?: [string, string];
   mb?: SpacingType;
   variant: VariantTypes;
@@ -24,8 +23,7 @@ export type SubjectLayout = {
 export type RenderSubjectProps = {
   color?: ColorTokens | string;
   editable?: any;
-  hasIcon?: boolean;
-  iconComponent?: any;
+  iconComponent?: any
   item?: any;
   layout?: LayoutProps;
 }
@@ -36,16 +34,15 @@ const RenderSubject = ({
   item,
   layout,
 }: RenderSubjectProps) => {
-
   const font_size = get(layout, 'subject.font_size', ['14px', '14px'])
   const line_height = get(layout, 'subject.line_height', ['16px', '16px'])
   const mb = get(layout, 'subject.mb', ['0px', '0px'])
   const subject_enabled = get(layout, 'subject.enabled', false)
   const subject_variant = get(layout, 'subject.variant', '')
-  const hasIcon = get(layout, 'subject.hasIcon', false)
   const iconComponent = get(layout, 'subject.iconComponent', false)
 
   let subject_value = get(item, 'subject', '')
+  let hasIcon = get(item, 'video', false)
 
   if (!subject_enabled) {
     return null
@@ -88,7 +85,7 @@ const RenderSubject = ({
         align='row'
         alignx='center'
       >
-        {iconComponent()}
+        {iconComponent(item)}
         <S.Subject
           bg_color={bg_color}
           color={font_color}

diff --git a/styles/demo/hed/data/7.100.json b/styles/demo/hed/data/7.100.json
@@ -23,7 +23,8 @@
         "subject": "EFICIÊNCIA DO CARVÃO energético",
         "subtitle": "",
         "pubdate": "2021-09-12 2:15:16",
-        "updated": "2021-10-23 12:44:32"
+        "updated": "2021-10-23 12:44:32",
+        "video": "true"
       },
       {
         "cid": "7.184",
@@ -38,7 +39,8 @@
         "subject": "PORTO ALEGRE",
         "subtitle": "",
         "pubdate": "2021-09-12 2:15:16",
-        "updated": "2021-10-23 12:44:32"
+        "updated": "2021-10-23 12:44:32",
+        "video": "true"
       }
     ],
     "list2": [

diff --git a/styles/demo/hed/icons/videoPlayerIcon.tsx b/styles/demo/hed/icons/videoPlayerIcon.tsx
@@ -1,7 +1,7 @@
 import { Block } from 'prensa'
 import React from 'react'
 
-export const renderIcon = () => {
+export const renderIcon = (props) => {
   return (
     <Block mr='8px'>
         <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32 33" fill="none">

diff --git a/styles/demo/hed/tokens/subject.ts b/styles/demo/hed/tokens/subject.ts
@@ -9,7 +9,6 @@ export const SUBJECT_DEFAULT: LayoutProps['subject'] = {
   line_height: ['16px', '16px'],
   mb: ['4px', '4px'],
   variant: 'default',
-  hasIcon: true,
   iconComponent: renderIcon
 }
 export const SUBJECT_DEFAULT_FEATURED: LayoutProps['subject'] = {
@@ -18,13 +17,15 @@ export const SUBJECT_DEFAULT_FEATURED: LayoutProps['subject'] = {
   font_size: ['12px', '16px'],
   line_height: ['16px', '16px'],
   mb: [1, 1],
-  variant: 'default'
+  variant: 'default',
+  iconComponent: renderIcon
 }
 export const SUBJECT_FILLED: LayoutProps['subject'] = {
   color: 'white',
   enabled: true,
   font_size: ['16px', '16px'],
   line_height: ['18px', '18px'],
   mb: [1, 1],
-  variant: 'filled'
+  variant: 'filled',
+  iconComponent: renderIcon
 }