feat (dashboard): unencrypted disk warning (#3116)
### **User description** Resolves #3050 ___ ### **PR Type** Enhancement ___ ### **Description** - Add unencrypted disk warning in storage capacity settings - Implement query for persistent volumes encryption status - Display alert for enabling disk encryption - Update GraphQL types and queries ___ ### **Changes walkthrough** 📝 <table><thead><tr><th></th><th align="left">Relevant files</th></tr></thead><tbody><tr><td><strong>Enhancement</strong></td><td><table> <tr> <td> <details> <summary><strong>DatabaseStorageCapacity.tsx</strong><dd><code>Add unencrypted disk warning and encryption info</code> </dd></summary> <hr> dashboard/src/features/orgs/projects/database/settings/components/DatabaseStorageCapacity/DatabaseStorageCapacity.tsx <li>Import new UI components (Alert, Link, Text)<br> <li> Add query for persistent volumes encryption status<br> <li> Implement conditional rendering of encryption warning<br> <li> Display alert with instructions to enable encryption </details> </td> <td><a href="https://github.com/nhost/nhost/pull/3116/files#diff-097a59d13b44816051386182a444eadfe2dcacd69b88c121af6733d7eca3ee43">+34/-0</a> </td> </tr> <tr> <td> <details> <summary><strong>graphql.ts</strong><dd><code>Update GraphQL types and add encryption query</code> </dd></summary> <hr> dashboard/src/utils/__generated__/graphql.ts <li>Add GetPersistentVolumesEncryptedQuery type and related functions<br> <li> Update Organization_Member_Invites type </details> </td> <td><a href="https://github.com/nhost/nhost/pull/3116/files#diff-fbd5db84b560b1c91675004448c6c7fa0dcbfb28b9eb05d53b03e6cb7b83ebac">+46/-1</a> </td> </tr> <tr> <td> <details> <summary><strong>getPersistentVolumesEncrypted.gql</strong><dd><code>Add GraphQL query for persistent volumes encryption</code> </dd></summary> <hr> dashboard/src/features/orgs/projects/database/settings/gql/getPersistentVolumesEncrypted.gql - Add new GraphQL query for persistent volumes encryption status </details> </td> <td><a href="https://github.com/nhost/nhost/pull/3116/files#diff-a0b0a1fd74b04a74ccd04f1f1f1a917729f603f678da3d0af9fc051ce96bb674">+5/-0</a> </td> </tr> </table></td></tr><tr><td><strong>Documentation</strong></td><td><table> <tr> <td> <details> <summary><strong>sour-bats-repair.md</strong><dd><code>Add changeset for unencrypted disk warning feature</code> </dd></summary> <hr> .changeset/sour-bats-repair.md <li>Add changeset for minor version bump<br> <li> Describe new feature: unencrypted disk warning </details> </td> <td><a href="https://github.com/nhost/nhost/pull/3116/files#diff-257a5bb608ef376c916b9c93ca8b72e260560f9bfff0c07f954862feb25d5ea7">+5/-0</a> </td> </tr> </table></td></tr></tr></tbody></table> ___ > 💡 **PR-Agent usage**: Comment `/help "your question"` on any pull request to receive relevant information
This commit is contained in:
David BM
GitHub
5
.changeset/sour-bats-repair.md
Normal file
5
.changeset/sour-bats-repair.md
Normal file
@@ -0,0 +1,5 @@
|
||||
---
|
||||
'@nhost/dashboard': minor
|
||||
---
|
||||
|
||||
feat: add unencrypted disk warning in storage capacity settings
|
||||
@@ -2,9 +2,12 @@ import { useUI } from '@/components/common/UIProvider';
|
||||
import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Alert } from '@/components/ui/v2/Alert';
|
||||
import { Box } from '@/components/ui/v2/Box';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import { InputAdornment } from '@/components/ui/v2/InputAdornment';
|
||||
import { Link } from '@/components/ui/v2/Link';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { UpgradeNotification } from '@/features/orgs/projects/common/components/UpgradeNotification';
|
||||
import { useAppState } from '@/features/orgs/projects/common/hooks/useAppState';
|
||||
import { useIsPlatform } from '@/features/orgs/projects/common/hooks/useIsPlatform';
|
||||
@@ -14,6 +17,7 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
useGetPersistentVolumesEncryptedQuery,
|
||||
useGetPostgresSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -57,6 +61,15 @@ export default function DatabaseStorageCapacity() {
|
||||
org?.plan?.featureMaxDbSize) ||
|
||||
0;
|
||||
|
||||
const { data: encryptedVolumesData } = useGetPersistentVolumesEncryptedQuery({
|
||||
variables: { appId: project?.id },
|
||||
skip: !isPlatform,
|
||||
});
|
||||
|
||||
const showEncryptionWarning = encryptedVolumesData
|
||||
? !encryptedVolumesData?.systemConfig?.persistentVolumesEncrypted
|
||||
: false;
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
@@ -187,6 +200,28 @@ export default function DatabaseStorageCapacity() {
|
||||
isDirty={isDirty}
|
||||
/>
|
||||
)}
|
||||
{showEncryptionWarning ? (
|
||||
<Alert severity="warning" className="flex flex-col gap-3 text-left">
|
||||
<div className="flex flex-col gap-2 lg:flex-row lg:justify-between">
|
||||
<Text className="flex items-start gap-1 font-semibold">
|
||||
Disk encryption is now available!
|
||||
</Text>
|
||||
</div>
|
||||
<div>
|
||||
<Text>
|
||||
To enable encryption in this project all you have to do is
|
||||
pause & unpause it in{' '}
|
||||
<Link
|
||||
href={`/orgs/${org?.slug}/projects/${project?.subdomain}/settings`}
|
||||
underline="hover"
|
||||
>
|
||||
General Settings
|
||||
</Link>
|
||||
.
|
||||
</Text>
|
||||
</div>
|
||||
</Alert>
|
||||
) : null}
|
||||
</SettingsContainer>
|
||||
</Form>
|
||||
</FormProvider>
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
query GetPersistentVolumesEncrypted($appId: uuid!) {
|
||||
systemConfig(appID: $appId) {
|
||||
persistentVolumesEncrypted
|
||||
}
|
||||
}
|
||||
45
dashboard/src/utils/__generated__/graphql.ts
generated
45
dashboard/src/utils/__generated__/graphql.ts
generated
@@ -27682,6 +27682,13 @@ export type GetBackupPresignedUrlQueryVariables = Exact<{
|
||||
|
||||
export type GetBackupPresignedUrlQuery = { __typename?: 'query_root', getBackupPresignedUrl: { __typename?: 'BackupPresignedURL', url: string, expiresAt: any } };
|
||||
|
||||
export type GetPersistentVolumesEncryptedQueryVariables = Exact<{
|
||||
appId: Scalars['uuid'];
|
||||
}>;
|
||||
|
||||
|
||||
export type GetPersistentVolumesEncryptedQuery = { __typename?: 'query_root', systemConfig?: { __typename?: 'ConfigSystemConfig', persistentVolumesEncrypted?: boolean | null } | null };
|
||||
|
||||
export type GetJwtSecretsQueryVariables = Exact<{
|
||||
appId: Scalars['uuid'];
|
||||
}>;
|
||||
@@ -29656,6 +29663,44 @@ export type GetBackupPresignedUrlQueryResult = Apollo.QueryResult<GetBackupPresi
|
||||
export function refetchGetBackupPresignedUrlQuery(variables: GetBackupPresignedUrlQueryVariables) {
|
||||
return { query: GetBackupPresignedUrlDocument, variables: variables }
|
||||
}
|
||||
export const GetPersistentVolumesEncryptedDocument = gql`
|
||||
query GetPersistentVolumesEncrypted($appId: uuid!) {
|
||||
systemConfig(appID: $appId) {
|
||||
persistentVolumesEncrypted
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
/**
|
||||
* __useGetPersistentVolumesEncryptedQuery__
|
||||
*
|
||||
* To run a query within a React component, call `useGetPersistentVolumesEncryptedQuery` and pass it any options that fit your needs.
|
||||
* When your component renders, `useGetPersistentVolumesEncryptedQuery` returns an object from Apollo Client that contains loading, error, and data properties
|
||||
* you can use to render your UI.
|
||||
*
|
||||
* @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
|
||||
*
|
||||
* @example
|
||||
* const { data, loading, error } = useGetPersistentVolumesEncryptedQuery({
|
||||
* variables: {
|
||||
* appId: // value for 'appId'
|
||||
* },
|
||||
* });
|
||||
*/
|
||||
export function useGetPersistentVolumesEncryptedQuery(baseOptions: Apollo.QueryHookOptions<GetPersistentVolumesEncryptedQuery, GetPersistentVolumesEncryptedQueryVariables>) {
|
||||
const options = {...defaultOptions, ...baseOptions}
|
||||
return Apollo.useQuery<GetPersistentVolumesEncryptedQuery, GetPersistentVolumesEncryptedQueryVariables>(GetPersistentVolumesEncryptedDocument, options);
|
||||
}
|
||||
export function useGetPersistentVolumesEncryptedLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<GetPersistentVolumesEncryptedQuery, GetPersistentVolumesEncryptedQueryVariables>) {
|
||||
const options = {...defaultOptions, ...baseOptions}
|
||||
return Apollo.useLazyQuery<GetPersistentVolumesEncryptedQuery, GetPersistentVolumesEncryptedQueryVariables>(GetPersistentVolumesEncryptedDocument, options);
|
||||
}
|
||||
export type GetPersistentVolumesEncryptedQueryHookResult = ReturnType<typeof useGetPersistentVolumesEncryptedQuery>;
|
||||
export type GetPersistentVolumesEncryptedLazyQueryHookResult = ReturnType<typeof useGetPersistentVolumesEncryptedLazyQuery>;
|
||||
export type GetPersistentVolumesEncryptedQueryResult = Apollo.QueryResult<GetPersistentVolumesEncryptedQuery, GetPersistentVolumesEncryptedQueryVariables>;
|
||||
export function refetchGetPersistentVolumesEncryptedQuery(variables: GetPersistentVolumesEncryptedQueryVariables) {
|
||||
return { query: GetPersistentVolumesEncryptedDocument, variables: variables }
|
||||
}
|
||||
export const GetJwtSecretsDocument = gql`
|
||||
query GetJWTSecrets($appId: uuid!) {
|
||||
config(appID: $appId, resolve: false) {
|
||||
|
||||
Reference in New Issue
Block a user