Skip to content

Commit

Permalink
Fix/issue description not showing up on backup card (#40904)
Browse files Browse the repository at this point in the history 
* Fix issue where description doesn't show up on backup card and remove deprecated code

* changelog
  • Loading branch information
@CodeyGuyDylan
CodeyGuyDylan authored Jan 14, 2025
1 parent 7ed2d9a commit 438c4b6
Show file tree
Hide file tree
Showing 5 changed files with 10 additions and 174 deletions.
130 changes: 4 additions & 126 deletions projects/packages/my-jetpack/_inc/components/product-cards-section/backup-card/index.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,81 +1,24 @@
import { Text, getRedirectUrl } from '@automattic/jetpack-components';
import { VisuallyHidden } from '@wordpress/components';
import { __, _n, sprintf } from '@wordpress/i18n';
import clsx from 'clsx';
import Gridicon from 'gridicons';
import PropTypes from 'prop-types';
import { useMemo } from 'react';
import { PRODUCT_STATUSES } from '../../../constants';
import {
REST_API_REWINDABLE_BACKUP_EVENTS_ENDPOINT,
REST_API_COUNT_BACKUP_ITEMS_ENDPOINT,
QUERY_BACKUP_HISTORY_KEY,
QUERY_BACKUP_STATS_KEY,
PRODUCT_SLUGS,
} from '../../../data/constants';
import useProduct from '../../../data/products/use-product';
import useSimpleQuery from '../../../data/use-simple-query';
import { getMyJetpackWindowInitialState } from '../../../data/utils/get-my-jetpack-window-state';
import useAnalytics from '../../../hooks/use-analytics';
import { useGetReadableFailedBackupReason } from '../../../hooks/use-notification-watcher/use-get-readable-failed-backup-reason';
import numberFormat from '../../../utils/format-number';
import ProductCard from '../../connected-product-card';
import { InfoTooltip } from '../../info-tooltip';
import styles from './style.module.scss';

const productSlug = PRODUCT_SLUGS.BACKUP;

const getIcon = slug => {
switch ( slug ) {
case 'post':
return <Gridicon icon="posts" size={ 24 } />;
case 'page':
return <Gridicon icon="pages" size={ 24 } />;
default:
return <Gridicon icon={ slug } size={ 24 } />;
}
};

const getStatRenderFn = stat =>
( {
comment: val =>
sprintf(
// translators: %d is the number of comments
_n( '%d comment', '%d comments', val, 'jetpack-my-jetpack' ),
val
),
post: val =>
sprintf(
// translators: %d is the number of posts
_n( '%d post', '%d posts', val, 'jetpack-my-jetpack' ),
val
),
page: val =>
sprintf(
// translators: %d is the number of pages
_n( '%d page', '%d pages', val, 'jetpack-my-jetpack' ),
val
),
image: val =>
sprintf(
// translators: %d is the number of images
_n( '%d image', '%d images', val, 'jetpack-my-jetpack' ),
val
),
video: val =>
sprintf(
// translators: %d is the number of videos
_n( '%d video', '%d videos', val, 'jetpack-my-jetpack' ),
val
),
audio: val =>
sprintf(
// translators: %d is the number of files
_n( '%d audio file', '%d audio files', val, 'jetpack-my-jetpack' ),
val
),
} )[ stat ] || ( val => `${ val } ${ stat }` );

const getTimeSinceLastRenewableEvent = lastRewindableEventTime => {
if ( ! lastRewindableEventTime ) {
return '';
Expand Down Expand Up @@ -142,10 +85,11 @@ const BackupCard = props => {
return <WithBackupsValueSection slug={ productSlug } { ...props } />;
}

const isError = status === PRODUCT_STATUSES.NEEDS_ATTENTION__ERROR && backupFailure;

return (
// eslint-disable-next-line react/jsx-no-bind
<ProductCard slug={ productSlug } Description={ noDescription } { ...props }>
{ status === PRODUCT_STATUSES.NEEDS_ATTENTION__ERROR && backupFailure && (
<ProductCard slug={ productSlug } Description={ isError && noDescription } { ...props }>
{ isError && (
<div className={ styles.backupErrorContainer }>
<div className={ styles.iconContainer }>
<Gridicon icon="notice" size={ 16 } className={ styles.iconError } />
Expand Down Expand Up @@ -245,74 +189,8 @@ const WithBackupsValueSection = props => {
);
};

// DEPRECATED: this output was more confusing than helpful
const NoBackupsValueSection = props => {
const { data: backupStats, isLoading } = useSimpleQuery( {
name: QUERY_BACKUP_STATS_KEY,
query: {
path: REST_API_COUNT_BACKUP_ITEMS_ENDPOINT,
},
} );

const sortedStats = useMemo( () => {
const data = [];

if ( ! backupStats ) {
return data;
}

Object.keys( backupStats ).forEach( key => {
// We can safely filter out any values that are 0
if ( backupStats[ key ] === 0 ) {
return;
}

data.push( [ key, backupStats[ key ] ] );
} );

data.sort( ( a, b ) => {
return a[ 1 ] < b[ 1 ] ? 1 : -1;
} );

return data;
}, [ backupStats ] );

return (
<ProductCard { ...props } showMenu isDataLoading={ isLoading }>
<div className={ styles[ 'no-backup-stats' ] }>
{ /* role="list" is required for VoiceOver on Safari */ }
<ul className={ styles[ 'main-stats' ] } role="list">
{ sortedStats.map( ( item, i ) => {
const itemSlug = item[ 0 ].split( '_' )[ 1 ];
const value = item[ 1 ];

return (
<li
className={ clsx( styles[ 'main-stat' ], `main-stat-${ i }` ) }
key={ i + itemSlug }
>
<>
<span className={ clsx( styles[ 'visual-stat' ] ) } aria-hidden="true">
{ getIcon( itemSlug ) }
<span>{ numberFormat( value ) }</span>
</span>
<VisuallyHidden>{ getStatRenderFn( itemSlug )( value ) }</VisuallyHidden>
</>
</li>
);
} ) }
</ul>
</div>
</ProductCard>
);
};

BackupCard.propTypes = {
admin: PropTypes.bool,
};

NoBackupsValueSection.propTypes = {
productData: PropTypes.object,
};

export default BackupCard;
2 changes: 0 additions & 2 deletions projects/packages/my-jetpack/_inc/data/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ const ODYSSEY_STATS_API_NAMESPACE = 'jetpack/v4/stats-app';

export const REST_API_SITE_PURCHASES_ENDPOINT = `${ REST_API_NAMESPACE }/site/purchases`;
export const REST_API_REWINDABLE_BACKUP_EVENTS_ENDPOINT = `${ REST_API_NAMESPACE }/site/backup/undo-event`;
export const REST_API_COUNT_BACKUP_ITEMS_ENDPOINT = `${ REST_API_NAMESPACE }/site/backup/count-items`;
export const REST_API_CHAT_AVAILABILITY_ENDPOINT = `${ REST_API_NAMESPACE }/chat/availability`;
export const REST_API_CHAT_AUTHENTICATION_ENDPOINT = `${ REST_API_NAMESPACE }/chat/authentication`;
export const REST_API_SITE_PRODUCTS_ENDPOINT = `${ REST_API_NAMESPACE }/site/products`;
Expand All @@ -27,7 +26,6 @@ export const QUERY_LICENSES_KEY = 'available licenses';
export const QUERY_CHAT_AVAILABILITY_KEY = 'chat availability';
export const QUERY_CHAT_AUTHENTICATION_KEY = 'chat authentication';
export const QUERY_BACKUP_HISTORY_KEY = 'backup history';
export const QUERY_BACKUP_STATS_KEY = 'backup stats';
export const QUERY_STATS_COUNTS_KEY = 'stats counts';
export const QUERY_DISMISS_WELCOME_BANNER_KEY = 'dismiss welcome banner';
export const QUERY_PURCHASES_KEY = 'purchases';
Expand Down
4 changes: 4 additions & 0 deletions projects/packages/my-jetpack/changelog/fix-issue-description-not-showing-up-on-backup-card
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: patch
Type: fixed

Fix bug where description doesn't show up on backup card in specific scenarios
3 changes: 2 additions & 1 deletion projects/packages/my-jetpack/global.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,8 @@ type JetpackModule =
| 'complete'
| 'site-accelerator'
| 'newsletter'
| 'related-posts';
| 'related-posts'
| 'brute-force';

type ThreatItem = {
// Protect API properties (free plan)
Expand Down
45 changes: 0 additions & 45 deletions projects/packages/my-jetpack/src/class-rest-product-data.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,16 +28,6 @@ public function __construct() {
'permission_callback' => __CLASS__ . '::permissions_callback',
)
);

register_rest_route(
'my-jetpack/v1',
'/site/backup/count-items',
array(
'methods' => \WP_REST_Server::READABLE,
'callback' => __CLASS__ . '::count_things_that_can_be_backed_up',
'permission_callback' => __CLASS__ . '::permissions_callback',
)
);
}

/**
Expand Down Expand Up @@ -109,39 +99,4 @@ public static function get_site_backup_undo_event() {

return rest_ensure_response( $undo_event );
}

/**
* This will collect a count of all the items that could be backed up
* This is used to show what backup could be doing if it is not enabled
*
* @return WP_Error|\WP_REST_Response
*/
public static function count_things_that_can_be_backed_up() {
$image_mime_type = 'image';
$video_mime_type = 'video';
$audio_mime_type = 'audio';

$data = array();

// Add all post types together to get the total post count
$data['total_post_count'] = array_sum( (array) wp_count_posts( 'post' ) );

// Add all page types together to get the total page count
$data['total_page_count'] = array_sum( (array) wp_count_posts( 'page' ) );

// Add all comments together to get the total comment count
$comments = (array) wp_count_comments();
$data['total_comment_count'] = $comments ? $comments['total_comments'] : 0;

// Add all image attachments together to get the total image count
$data['total_image_count'] = array_sum( (array) wp_count_attachments( $image_mime_type ) );

// Add all video attachments together to get the total video count
$data['total_video_count'] = array_sum( (array) wp_count_attachments( $video_mime_type ) );

// Add all audio attachments together to get the total audio count
$data['total_audio_count'] = array_sum( (array) wp_count_attachments( $audio_mime_type ) );

return rest_ensure_response( $data );
}
}

0 comments on commit 438c4b6

Please sign in to comment.