Merge pull request #26 from white-label-loyalty/chore/banner-tile-med…

…ia-rename Chore/banner tile media rename
white-label-loyalty · Nov 18, 2024 · d1b7074 · d1b7074
2 parents 2d8b716 + ce637d4
commit d1b7074
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 11 deletions.
diff --git a/docs/components/banner-tile.md b/docs/components/banner-tile.md
@@ -51,7 +51,7 @@ function MyComponent() {
 
 ## Composition
 
-- `BannerTile.Image` - Banner image display
+- `BannerTile.Media` - Banner image display
 - `BannerTile.Title` - Banner headline
 - `BannerTile.Description` - Banner description text
 - `BannerTile.CTA` - Call-to-action button
diff --git a/lib/components/organisms/BannerTile/BannerTile.stories.tsx b/lib/components/organisms/BannerTile/BannerTile.stories.tsx
@@ -32,8 +32,8 @@ Default.args = {
   },
 };
 
-export const WithoutButton = Template.bind({});
-WithoutButton.args = {
+export const WithoutCTA = Template.bind({});
+WithoutCTA.args = {
   tile: {
     id: '2',
     type: TileType.Banner,

diff --git a/lib/components/organisms/BannerTile/index.tsx b/lib/components/organisms/BannerTile/index.tsx
@@ -13,14 +13,14 @@ type BannerTileProps = {
 };
 
 const BannerTile: React.FC<BannerTileProps> & {
-  Image: typeof BannerTileImage;
+  Media: typeof BannerTileMedia;
   Title: typeof BannerTileTitle;
   Description: typeof BannerTileDescription;
   CTA: typeof BannerTileCTA;
 } = ({ tile }) => {
   return (
     <BaseBanner tile={tile}>
-      <BannerTile.Image />
+      <BannerTile.Media />
       <View style={styles.slideContent}>
         <BannerTile.Title />
         <BannerTile.Description />
@@ -30,14 +30,14 @@ const BannerTile: React.FC<BannerTileProps> & {
   );
 };
 
-const BannerTileImage: React.FC = () => {
+const BannerTileMedia: React.FC = () => {
   const { configuration } = useBannerContext();
   const { artworkUrl } = configuration as BannerTileConfig;
 
   if (!artworkUrl) return null;
   return (
-    <View style={styles.imageContainer}>
-      <ProgressiveImage source={{ uri: artworkUrl }} style={styles.image} />
+    <View style={styles.mediaContainer}>
+      <ProgressiveImage source={{ uri: artworkUrl }} style={styles.media} />
     </View>
   );
 };
@@ -97,14 +97,14 @@ const styles = StyleSheet.create({
   slideContent: createResponsiveStyle({
     flex: 1,
   }),
-  imageContainer: createResponsiveStyle({
+  mediaContainer: createResponsiveStyle({
     width: '20%',
     aspectRatio: 1,
     position: 'relative',
     overflow: 'hidden',
     marginRight: [8, 8, 24],
   }),
-  image: {
+  media: {
     position: 'absolute',
     width: '100%',
     height: '100%',
@@ -121,7 +121,7 @@ const styles = StyleSheet.create({
   }),
 });
 
-BannerTile.Image = BannerTileImage;
+BannerTile.Media = BannerTileMedia;
 BannerTile.Title = BannerTileTitle;
 BannerTile.Description = BannerTileDescription;
 BannerTile.CTA = BannerTileCTA;