From e1b1a5368d9ec298c50230f3ec183f4387236b96 Mon Sep 17 00:00:00 2001 From: Conal Ryan Date: Mon, 14 Aug 2023 11:06:46 -0400 Subject: [PATCH 1/3] Feat: [UIE-6576] - Dbaas total disk size and used disk size --- ...pr-9638-upcoming-features-1694022154737.md | 5 +++ packages/api-v4/src/account/types.ts | 1 + packages/api-v4/src/databases/types.ts | 2 + ...pr-9638-upcoming-features-1694022186629.md | 5 +++ .../manager/src/dev-tools/FeatureFlagTool.tsx | 1 + packages/manager/src/eventMessageGenerator.ts | 6 +++ packages/manager/src/factories/databases.ts | 2 + .../DatabaseSummaryClusterConfiguration.tsx | 37 ++++++++++++++++--- packages/manager/src/mocks/serverHandlers.ts | 12 +++++- 9 files changed, 65 insertions(+), 6 deletions(-) create mode 100644 packages/api-v4/.changeset/pr-9638-upcoming-features-1694022154737.md create mode 100644 packages/manager/.changeset/pr-9638-upcoming-features-1694022186629.md diff --git a/packages/api-v4/.changeset/pr-9638-upcoming-features-1694022154737.md b/packages/api-v4/.changeset/pr-9638-upcoming-features-1694022154737.md new file mode 100644 index 00000000000..c0f5da8548b --- /dev/null +++ b/packages/api-v4/.changeset/pr-9638-upcoming-features-1694022154737.md @@ -0,0 +1,5 @@ +--- +"@linode/api-v4": Upcoming Features +--- + +DbaaS disk size and used size ([#9638](https://github.com/linode/manager/pull/9638)) diff --git a/packages/api-v4/src/account/types.ts b/packages/api-v4/src/account/types.ts index 6dbba2df579..d5e58d562dc 100644 --- a/packages/api-v4/src/account/types.ts +++ b/packages/api-v4/src/account/types.ts @@ -239,6 +239,7 @@ export type EventAction = | 'community_mention' | 'community_question_reply' | 'credit_card_updated' + | 'database_low_disk_space_remaining' | 'disk_create' | 'disk_update' | 'disk_delete' diff --git a/packages/api-v4/src/databases/types.ts b/packages/api-v4/src/databases/types.ts index 70af55d0410..3937b5ed5e7 100644 --- a/packages/api-v4/src/databases/types.ts +++ b/packages/api-v4/src/databases/types.ts @@ -128,6 +128,8 @@ export interface BaseDatabase { hosts: DatabaseHosts; port: number; updates: UpdatesSchedule; + total_disk_size_gb?: number; + used_disk_size_gb?: number; } export interface MySQLDatabase extends BaseDatabase { diff --git a/packages/manager/.changeset/pr-9638-upcoming-features-1694022186629.md b/packages/manager/.changeset/pr-9638-upcoming-features-1694022186629.md new file mode 100644 index 00000000000..46a06f8fc04 --- /dev/null +++ b/packages/manager/.changeset/pr-9638-upcoming-features-1694022186629.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Upcoming Features +--- + +DbaaS disk size and used size ([#9638](https://github.com/linode/manager/pull/9638)) diff --git a/packages/manager/src/dev-tools/FeatureFlagTool.tsx b/packages/manager/src/dev-tools/FeatureFlagTool.tsx index 388a63ddc7f..f61dc3fe93c 100644 --- a/packages/manager/src/dev-tools/FeatureFlagTool.tsx +++ b/packages/manager/src/dev-tools/FeatureFlagTool.tsx @@ -13,6 +13,7 @@ const MOCK_FEATURE_FLAGS_STORAGE_KEY = 'devTools/mock-feature-flags'; const options: { flag: keyof Flags; label: string }[] = [ { flag: 'metadata', label: 'Metadata' }, { flag: 'databaseBeta', label: 'Database Beta' }, + { flag: 'databases', label: 'Databases' }, { flag: 'vpc', label: 'VPC' }, { flag: 'aglb', label: 'AGLB' }, ]; diff --git a/packages/manager/src/eventMessageGenerator.ts b/packages/manager/src/eventMessageGenerator.ts index 0d5e444fe52..d74b0324c04 100644 --- a/packages/manager/src/eventMessageGenerator.ts +++ b/packages/manager/src/eventMessageGenerator.ts @@ -103,6 +103,12 @@ export const eventMessageCreators: { [index: string]: CreatorsForStatus } = { database_delete: { notification: (e) => `Database ${e.entity!.label} has been deleted.`, }, + database_low_disk_space_remaining: { + finished: (e) => + `Low disk space alert for database ${e.entity!.label} has cleared.`, + notification: (e) => + `Database ${e.entity!.label} has low disk space remaining.`, + }, database_update: { finished: (e) => `Database ${e.entity!.label} has been updated.`, }, diff --git a/packages/manager/src/factories/databases.ts b/packages/manager/src/factories/databases.ts index a7749d6d9ee..856d20ff021 100644 --- a/packages/manager/src/factories/databases.ts +++ b/packages/manager/src/factories/databases.ts @@ -180,6 +180,7 @@ export const databaseFactory = Factory.Sync.makeFactory({ region: 'us-east', ssl_connection: false, status: pickRandom(possibleStatuses), + total_disk_size_gb: 15, type: 'g6-standard-0', updated: '2021-12-16T17:15:12', updates: { @@ -189,6 +190,7 @@ export const databaseFactory = Factory.Sync.makeFactory({ hour_of_day: 20, week_of_month: null, }, + used_disk_size_gb: 5, version: '5.8.13', }); diff --git a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx index 15e7bc00e6c..2b88b7439ba 100644 --- a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx +++ b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx @@ -5,6 +5,7 @@ import { makeStyles } from 'tss-react/mui'; import { Box } from 'src/components/Box'; import { StatusIcon } from 'src/components/StatusIcon/StatusIcon'; +import { TooltipIcon } from 'src/components/TooltipIcon'; import { Typography } from 'src/components/Typography'; import { useDatabaseTypesQuery } from 'src/queries/databases'; import { useRegionsQuery } from 'src/queries/regions'; @@ -27,7 +28,7 @@ const useStyles = makeStyles()((theme: Theme) => ({ label: { fontFamily: theme.font.bold, lineHeight: '22px', - width: theme.spacing(7), + width: theme.spacing(13), }, status: { alignItems: 'center', @@ -65,6 +66,14 @@ export const DatabaseSummaryClusterConfiguration = (props: Props) => { ? 'Primary' : `Primary +${database.cluster_size - 1} replicas`; + const sxTooltipIcon = { + padding: '0px', + marginLeft: '4px', + }; + + const storageCopy = + 'The total disk size is smaller than the selected plan capacity due to the OS overhead.'; + return ( <> @@ -102,10 +111,28 @@ export const DatabaseSummaryClusterConfiguration = (props: Props) => { CPUs {type.vcpus} - - Storage - {convertMegabytesTo(type.disk, true)} - + {database.total_disk_size_gb ? ( + <> + + Total Disk Size + {database.total_disk_size_gb} GB + + + + Used + {database.used_disk_size_gb} GB + + + ) : ( + + Storage + {convertMegabytesTo(type.disk, true)} + + )} ); diff --git a/packages/manager/src/mocks/serverHandlers.ts b/packages/manager/src/mocks/serverHandlers.ts index b6f3077aa36..ceae41c694d 100644 --- a/packages/manager/src/mocks/serverHandlers.ts +++ b/packages/manager/src/mocks/serverHandlers.ts @@ -1000,6 +1000,11 @@ export const handlers = [ 'Rebooting this thing and showing an extremely long event message for no discernible reason other than the fairly obvious reason that we want to do some testing of whether or not these messages wrap.', percent_complete: 15, }); + const dbEvents = eventFactory.buildList(1, { + action: 'database_low_disk_space_remaining', + entity: { id: 999, label: 'database-1', type: 'database' }, + message: 'Low disk space.', + }); const oldEvents = eventFactory.buildList(20, { action: 'account_update', percent_complete: 100, @@ -1018,7 +1023,12 @@ export const handlers = [ }); return res.once( ctx.json( - makeResourcePage([...events, ...oldEvents, eventWithSpecialCharacters]) + makeResourcePage([ + ...events, + ...dbEvents, + ...oldEvents, + eventWithSpecialCharacters, + ]) ) ); }), From 095cd89d6b63ea288e1563bb1435434e9772813f Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Wed, 13 Sep 2023 11:06:33 -0400 Subject: [PATCH 2/3] improved responsive grid and feedback --- packages/api-v4/src/databases/types.ts | 8 ++++++++ .../DatabaseDetail/DatabaseSummary/DatabaseSummary.tsx | 6 +++--- .../DatabaseSummaryClusterConfiguration.tsx | 6 +++--- 3 files changed, 14 insertions(+), 6 deletions(-) diff --git a/packages/api-v4/src/databases/types.ts b/packages/api-v4/src/databases/types.ts index 3937b5ed5e7..945047c3940 100644 --- a/packages/api-v4/src/databases/types.ts +++ b/packages/api-v4/src/databases/types.ts @@ -128,7 +128,15 @@ export interface BaseDatabase { hosts: DatabaseHosts; port: number; updates: UpdatesSchedule; + /** + * total_disk_size_gb is feature flagged by the API, + * it may not be defined. + */ total_disk_size_gb?: number; + /** + * used_disk_size_gb is feature flagged by the API, + * it may not be defined. + */ used_disk_size_gb?: number; } diff --git a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummary.tsx b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummary.tsx index d34701eb70e..691f76f5968 100644 --- a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummary.tsx +++ b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummary.tsx @@ -4,8 +4,8 @@ import * as React from 'react'; import { Divider } from 'src/components/Divider'; import { Link } from 'src/components/Link'; -import { Typography } from 'src/components/Typography'; import { Paper } from 'src/components/Paper'; +import { Typography } from 'src/components/Typography'; import AccessControls from '../AccessControls'; import ClusterConfiguration from './DatabaseSummaryClusterConfiguration'; @@ -38,10 +38,10 @@ export const DatabaseSummary: React.FC = (props) => { return ( - + - + diff --git a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx index 2b88b7439ba..2d5125724e2 100644 --- a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx +++ b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryClusterConfiguration.tsx @@ -67,11 +67,11 @@ export const DatabaseSummaryClusterConfiguration = (props: Props) => { : `Primary +${database.cluster_size - 1} replicas`; const sxTooltipIcon = { - padding: '0px', marginLeft: '4px', + padding: '0px', }; - const storageCopy = + const STORAGE_COPY = 'The total disk size is smaller than the selected plan capacity due to the OS overhead.'; return ( @@ -119,7 +119,7 @@ export const DatabaseSummaryClusterConfiguration = (props: Props) => { From 0980a8e47dcf4b42789368ae5004330c2f5bd35b Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Wed, 13 Sep 2023 11:10:58 -0400 Subject: [PATCH 3/3] remove old flag and improve comment --- packages/api-v4/src/databases/types.ts | 8 ++++---- packages/manager/src/dev-tools/FeatureFlagTool.tsx | 1 - 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/api-v4/src/databases/types.ts b/packages/api-v4/src/databases/types.ts index 945047c3940..e764162e8dd 100644 --- a/packages/api-v4/src/databases/types.ts +++ b/packages/api-v4/src/databases/types.ts @@ -129,13 +129,13 @@ export interface BaseDatabase { port: number; updates: UpdatesSchedule; /** - * total_disk_size_gb is feature flagged by the API, - * it may not be defined. + * total_disk_size_gb is feature flagged by the API. + * It may not be defined. */ total_disk_size_gb?: number; /** - * used_disk_size_gb is feature flagged by the API, - * it may not be defined. + * used_disk_size_gb is feature flagged by the API. + * It may not be defined. */ used_disk_size_gb?: number; } diff --git a/packages/manager/src/dev-tools/FeatureFlagTool.tsx b/packages/manager/src/dev-tools/FeatureFlagTool.tsx index 00fdab02439..5fd4a62d9a1 100644 --- a/packages/manager/src/dev-tools/FeatureFlagTool.tsx +++ b/packages/manager/src/dev-tools/FeatureFlagTool.tsx @@ -13,7 +13,6 @@ const MOCK_FEATURE_FLAGS_STORAGE_KEY = 'devTools/mock-feature-flags'; const options: { flag: keyof Flags; label: string }[] = [ { flag: 'metadata', label: 'Metadata' }, - { flag: 'databaseBeta', label: 'Database Beta' }, { flag: 'vpc', label: 'VPC' }, { flag: 'aglb', label: 'AGLB' }, { flag: 'dcSpecificPricing', label: 'DC-Specific Pricing' },