From aa2e9b003ed0f452041a2bb6ff7360b60f054d64 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Mon, 12 Aug 2024 11:57:50 -0600
Subject: [PATCH 01/12] Add tooltip for installed with no videos
---
.../product-cards-section/videopress-card/use-tooltip-copy.ts | 2 --
.../videopress-card/use-videopress-description.ts | 2 +-
2 files changed, 1 insertion(+), 3 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
index 5709f45c237bc..768006a068785 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
@@ -57,7 +57,6 @@ const useTooltipCopy = () => {
};
const viewsWithPlan = {
- title: __( '30-Day views', 'jetpack-my-jetpack' ),
text: _n(
'This metric represents the total number of views your video has received on our platform over the past 30 days.',
'This metric represents the total number of views your videos have received on our platform over the past 30 days.',
@@ -84,4 +83,3 @@ const useTooltipCopy = () => {
};
};
-export default useTooltipCopy;
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
index 799b62dae99f6..8f5f10756d1c8 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
@@ -19,7 +19,7 @@ const useVideoPressCardDescription = ( {
if ( isPluginActive && ! videoCount ) {
return preventWidows(
__(
- 'Stunning-quality, ad-free video in the WordPress Editor. Begin by uploading your first video.',
+ 'Stunning-quality, ad-free video in the WordPress Editor. Begin by uploading your first video',
'jetpack-my-jetpack'
)
);
From 85267f387176ceaeefc9651207f4cb889048d8a8 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Mon, 12 Aug 2024 13:15:42 -0600
Subject: [PATCH 02/12] Add tooltip for inactive with videos
---
.../components/product-cards-section/videopress-card/index.tsx | 2 +-
.../product-cards-section/videopress-card/use-tooltip-copy.ts | 1 -
.../videopress-card/videopress-value-section.tsx | 1 +
3 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index c0a6769d49986..c178f502a3ec3 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -65,7 +65,7 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
return (
-
+
);
};
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
index 768006a068785..1f06468752eeb 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
@@ -82,4 +82,3 @@ const useTooltipCopy = () => {
watchTime,
};
};
-
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
index 96c789739c1d4..cc7e55563d73b 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
@@ -14,6 +14,7 @@ import './style.scss';
interface VideoPressValueSectionProps {
isPluginActive: boolean;
data: Window[ 'myJetpackInitialState' ][ 'videopress' ];
+ status: ProductStatus;
}
const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginActive, data } ) => {
From e5cb876abdbf38ed9a838e6f616aaa565f78d946 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Mon, 12 Aug 2024 14:05:16 -0600
Subject: [PATCH 03/12] Add tooltips for active states
---
.../components/product-cards-section/videopress-card/index.tsx | 2 +-
.../product-cards-section/videopress-card/use-tooltip-copy.ts | 3 +++
.../videopress-card/videopress-value-section.tsx | 1 -
3 files changed, 4 insertions(+), 2 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index c178f502a3ec3..c0a6769d49986 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -65,7 +65,7 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
return (
-
+
);
};
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
index 1f06468752eeb..5709f45c237bc 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
@@ -57,6 +57,7 @@ const useTooltipCopy = () => {
};
const viewsWithPlan = {
+ title: __( '30-Day views', 'jetpack-my-jetpack' ),
text: _n(
'This metric represents the total number of views your video has received on our platform over the past 30 days.',
'This metric represents the total number of views your videos have received on our platform over the past 30 days.',
@@ -82,3 +83,5 @@ const useTooltipCopy = () => {
watchTime,
};
};
+
+export default useTooltipCopy;
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
index cc7e55563d73b..96c789739c1d4 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
@@ -14,7 +14,6 @@ import './style.scss';
interface VideoPressValueSectionProps {
isPluginActive: boolean;
data: Window[ 'myJetpackInitialState' ][ 'videopress' ];
- status: ProductStatus;
}
const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginActive, data } ) => {
From 2fdfa822e02b15d14dd86bfa5289e1986587c958 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Wed, 14 Aug 2024 15:52:37 -0600
Subject: [PATCH 04/12] Update tooltip location when videos are present but
plugin is inactive
---
.../videopress-card/index.tsx | 27 ++++++++++++++++---
.../videopress-value-section.tsx | 2 +-
2 files changed, 24 insertions(+), 5 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index c0a6769d49986..73179930ce969 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -22,7 +22,7 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
const { detail } = useProduct( slug );
const { status } = detail || {};
const { videopress: data } = getMyJetpackWindowInitialState();
- const { activeAndNoVideos } = useTooltipCopy();
+ const { activeAndNoVideos, inactiveWithVideos } = useTooltipCopy();
const videoCount = data?.videoCount || 0;
const isPluginActive =
@@ -33,11 +33,15 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
videoCount,
} );
+ const isActiveWithNoVideos = isPluginActive && ! videoCount;
+ const isInactiveWithVideos = ! isPluginActive && videoCount;
+ const shouldShowTooltip = isActiveWithNoVideos || isInactiveWithVideos;
+
const Description = useCallback( () => {
return (
{ descriptionText || detail.description }
- { isPluginActive && ! videoCount && (
+ { shouldShowTooltip && (
{
video_count: videoCount,
} }
>
- { activeAndNoVideos.title }
- { activeAndNoVideos.text }
+ { isActiveWithNoVideos ? (
+ <>
+ { activeAndNoVideos.title }
+ { activeAndNoVideos.text }
+
+ ) : (
+ <>
+ { inactiveWithVideos.title }
+ { inactiveWithVideos.text }
+
+ ) }
) }
@@ -60,7 +73,13 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
videoCount,
status,
activeAndNoVideos,
+<<<<<<< HEAD
isPluginActive,
+=======
+ inactiveWithVideos,
+ shouldShowTooltip,
+ isActiveWithNoVideos,
+>>>>>>> b7511065a6 (Update tooltip location when videos are present but plugin is inactive)
] );
return (
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
index 96c789739c1d4..486a132808c7a 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
@@ -20,7 +20,7 @@ const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginAc
const { detail } = useProduct( PRODUCT_SLUGS.VIDEOPRESS );
const { status, hasPaidPlanForProduct } = detail || {};
const { videoCount, featuredStats } = data || {};
- const { inactiveWithVideos, viewsWithoutPlan, viewsWithPlan, watchTime } = useTooltipCopy();
+ const { viewsWithoutPlan, viewsWithPlan, watchTime, inactiveWithVideos } = useTooltipCopy();
const shortenedNumberConfig: Intl.NumberFormatOptions = {
maximumFractionDigits: 1,
notation: 'compact',
From 8da27f15a361607b38c9b78a8ddcc35ac1cee03a Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Wed, 14 Aug 2024 16:20:48 -0600
Subject: [PATCH 05/12] Move info tooltip to heading
---
.../product-cards-section/videopress-card/index.tsx | 6 ------
1 file changed, 6 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index 73179930ce969..6601b6627f67c 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -73,13 +73,7 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
videoCount,
status,
activeAndNoVideos,
-<<<<<<< HEAD
isPluginActive,
-=======
- inactiveWithVideos,
- shouldShowTooltip,
- isActiveWithNoVideos,
->>>>>>> b7511065a6 (Update tooltip location when videos are present but plugin is inactive)
] );
return (
From a3372797cf753087525df3bd187a21e97d6d2646 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Wed, 14 Aug 2024 16:20:48 -0600
Subject: [PATCH 06/12] Move info tooltip to heading
---
.../videopress-card/index.tsx | 21 ++++---------------
1 file changed, 4 insertions(+), 17 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index 6601b6627f67c..c0a6769d49986 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -22,7 +22,7 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
const { detail } = useProduct( slug );
const { status } = detail || {};
const { videopress: data } = getMyJetpackWindowInitialState();
- const { activeAndNoVideos, inactiveWithVideos } = useTooltipCopy();
+ const { activeAndNoVideos } = useTooltipCopy();
const videoCount = data?.videoCount || 0;
const isPluginActive =
@@ -33,15 +33,11 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
videoCount,
} );
- const isActiveWithNoVideos = isPluginActive && ! videoCount;
- const isInactiveWithVideos = ! isPluginActive && videoCount;
- const shouldShowTooltip = isActiveWithNoVideos || isInactiveWithVideos;
-
const Description = useCallback( () => {
return (
{ descriptionText || detail.description }
- { shouldShowTooltip && (
+ { isPluginActive && ! videoCount && (
{
video_count: videoCount,
} }
>
- { isActiveWithNoVideos ? (
- <>
- { activeAndNoVideos.title }
- { activeAndNoVideos.text }
-
- ) : (
- <>
- { inactiveWithVideos.title }
- { inactiveWithVideos.text }
-
- ) }
+ { activeAndNoVideos.title }
+ { activeAndNoVideos.text }
) }
From 2d4a37279dc3218aa01e2aee16ef40e13a693b93 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Fri, 9 Aug 2024 14:45:53 -0600
Subject: [PATCH 07/12] Update definition of videopress active
---
.../components/product-cards-section/videopress-card/index.tsx | 3 +++
1 file changed, 3 insertions(+)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index c0a6769d49986..f0dc24af1064c 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -25,6 +25,9 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
const { activeAndNoVideos } = useTooltipCopy();
const videoCount = data?.videoCount || 0;
+ const isPluginActive =
+ status === PRODUCT_STATUSES.ACTIVE || status === PRODUCT_STATUSES.CAN_UPGRADE;
+
const isPluginActive =
status === PRODUCT_STATUSES.ACTIVE || status === PRODUCT_STATUSES.CAN_UPGRADE;
From 90f41b417e30e17dac02483a6125a9fa17cb6693 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Mon, 12 Aug 2024 11:08:19 -0600
Subject: [PATCH 08/12] Simplify logic of videopress value section
---
.../components/product-cards-section/videopress-card/index.tsx | 3 ---
1 file changed, 3 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
index f0dc24af1064c..c0a6769d49986 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/index.tsx
@@ -25,9 +25,6 @@ const VideopressCard: ProductCardComponent = ( { admin } ) => {
const { activeAndNoVideos } = useTooltipCopy();
const videoCount = data?.videoCount || 0;
- const isPluginActive =
- status === PRODUCT_STATUSES.ACTIVE || status === PRODUCT_STATUSES.CAN_UPGRADE;
-
const isPluginActive =
status === PRODUCT_STATUSES.ACTIVE || status === PRODUCT_STATUSES.CAN_UPGRADE;
From 2734f853426595708508ec0f9f20a4d90e012595 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Tue, 13 Aug 2024 12:55:08 -0600
Subject: [PATCH 09/12] Add stats trends
---
.../videopress-card/style.scss | 31 +++++++++-
.../videopress-card/use-tooltip-copy.ts | 3 +-
.../videopress-value-section.tsx | 59 +++++++++++++++++--
3 files changed, 84 insertions(+), 9 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
index 5e704d3f7ae06..c9f3ee18557a2 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
@@ -20,13 +20,19 @@ p.description {
.videopress-card__value-section {
display: flex;
+ gap: 0.75rem;
+ justify-content: space-between;
&__container {
display: flex;
flex-direction: column;
align-items: flex-start;
+ }
- width: 50%;
+ &__value-container {
+ display: flex;
+ align-items: flex-end;
+ flex-wrap: wrap;
}
&__value {
@@ -35,9 +41,32 @@ p.description {
line-height: 1.125;
}
+ &__previous-value {
+ display: flex;
+ align-items: center;
+
+ font-size: var( --font-body-extra-small );
+ font-weight: 600;
+ }
+
+ &__previous-value.increase {
+ * {
+ color: var( --jp-green-50 );
+ fill: var( --jp-green-50 );
+ }
+ }
+
+ &__previous-value.decrease {
+ * {
+ color: var( --jp-red-50 );
+ fill: var( --jp-red-50 );
+ }
+ }
+
&__heading {
display: flex;
align-items: center;
+ text-wrap: nowrap;
}
}
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
index 5709f45c237bc..b64db028266e1 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-tooltip-copy.ts
@@ -66,11 +66,10 @@ const useTooltipCopy = () => {
),
};
- // todo: Add "comparing it with the performance of the previous 30 days." once we have the comparison in place.
const watchTime = {
title: __( '30-Day viewing time', 'jetpack-my-jetpack' ),
text: __(
- 'This metric shows total video viewing time for the last 30 days.',
+ 'This metric shows total video viewing time for the last 30 days, comparing it with the performance of the previous 30 days.',
'jetpack-my-jetpack'
),
};
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
index 486a132808c7a..1168e3a7de11a 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
@@ -1,4 +1,5 @@
import { __ } from '@wordpress/i18n';
+import { arrowUp, arrowDown, Icon } from '@wordpress/icons';
import clsx from 'clsx';
import { PRODUCT_SLUGS } from '../../../data/constants';
import useProduct from '../../../data/products/use-product';
@@ -16,6 +17,39 @@ interface VideoPressValueSectionProps {
data: Window[ 'myJetpackInitialState' ][ 'videopress' ];
}
+interface ValueSectionProps {
+ value: number;
+ previousValue: number;
+ formattedValue: string;
+ formattedDifference: string;
+}
+
+const ValueSection: FC< ValueSectionProps > = ( {
+ value,
+ previousValue,
+ formattedValue,
+ formattedDifference,
+} ) => {
+ const hasValueIncreased = value > previousValue;
+ return (
+
+
{ formattedValue }
+
+ { value !== previousValue && (
+
+
+ { formattedDifference }
+
+ ) }
+
@@ -121,6 +164,7 @@ const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginAc
tracksEventProps={ {
location: 'watch_time',
current_watch_time: currentWatchTime,
+ previous_watch_time: previousWatchTime,
...tracksProps,
} }
>
@@ -129,9 +173,12 @@ const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginAc
-
- { formatTime( currentWatchTime ) }
-
+
);
From 91916b33589e310fa272d6db3b472d9fc129f1cb Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Tue, 13 Aug 2024 12:59:24 -0600
Subject: [PATCH 10/12] Add changelog
---
.../my-jetpack/changelog/add-stat-trends-videopress-card | 4 ++++
1 file changed, 4 insertions(+)
create mode 100644 projects/packages/my-jetpack/changelog/add-stat-trends-videopress-card
diff --git a/projects/packages/my-jetpack/changelog/add-stat-trends-videopress-card b/projects/packages/my-jetpack/changelog/add-stat-trends-videopress-card
new file mode 100644
index 0000000000000..d28a2b8d24e02
--- /dev/null
+++ b/projects/packages/my-jetpack/changelog/add-stat-trends-videopress-card
@@ -0,0 +1,4 @@
+Significance: patch
+Type: added
+
+Add stat trends for videopress card
\ No newline at end of file
From fa2e2603b8ecc07cdd066bf5c0ba6a90a0840783 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Wed, 14 Aug 2024 16:03:15 -0600
Subject: [PATCH 11/12] Adjust placement of arrow
---
.../product-cards-section/videopress-card/style.scss | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
index c9f3ee18557a2..28d77f8124bbb 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/style.scss
@@ -38,7 +38,7 @@ p.description {
&__value {
font-size: calc( var( --font-headline-small ) - 4px );
color: var( --jp-gray-90 );
- line-height: 1.125;
+ line-height: 1;
}
&__previous-value {
@@ -46,6 +46,7 @@ p.description {
align-items: center;
font-size: var( --font-body-extra-small );
+ line-height: 18px;
font-weight: 600;
}
From e4ab3e84c92101363bc88819696a6d7ffca6cd40 Mon Sep 17 00:00:00 2001
From: Dylan Munson <65001528+CodeyGuyDylan@users.noreply.github.com>
Date: Fri, 16 Aug 2024 11:12:01 -0600
Subject: [PATCH 12/12] Re-add period
---
.../videopress-card/use-videopress-description.ts | 2 +-
.../videopress-card/videopress-value-section.tsx | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
index 8f5f10756d1c8..799b62dae99f6 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/use-videopress-description.ts
@@ -19,7 +19,7 @@ const useVideoPressCardDescription = ( {
if ( isPluginActive && ! videoCount ) {
return preventWidows(
__(
- 'Stunning-quality, ad-free video in the WordPress Editor. Begin by uploading your first video',
+ 'Stunning-quality, ad-free video in the WordPress Editor. Begin by uploading your first video.',
'jetpack-my-jetpack'
)
);
diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
index 1168e3a7de11a..f17ccddf41b1a 100644
--- a/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
+++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/videopress-card/videopress-value-section.tsx
@@ -54,7 +54,7 @@ const VideoPressValueSection: FC< VideoPressValueSectionProps > = ( { isPluginAc
const { detail } = useProduct( PRODUCT_SLUGS.VIDEOPRESS );
const { status, hasPaidPlanForProduct } = detail || {};
const { videoCount, featuredStats } = data || {};
- const { viewsWithoutPlan, viewsWithPlan, watchTime, inactiveWithVideos } = useTooltipCopy();
+ const { inactiveWithVideos, viewsWithoutPlan, viewsWithPlan, watchTime } = useTooltipCopy();
const shortenedNumberConfig: Intl.NumberFormatOptions = {
maximumFractionDigits: 1,
notation: 'compact',