console: add custom names for streaming subscriptions

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/5243
GitOrigin-RevId: 08932303b6e411e306b29f0052c9f141a794b3f9

CHANGELOG.md

@@ -6,7 +6,7 @@
 
 
 - server: add warning log for missing admin secret
-
+- console: add custom names for streaming subscriptions
 ## v2.10.0-beta.1
 
 ### Introducing Apollo Federation v1 support (experimental)

console/src/components/Services/Data/Common/Components/RootFieldEditor.tsx

@@ -19,6 +19,7 @@ interface RootFieldEditorProps {
   selectOnChange: ChangeHandler;
   selectByPkOnChange: ChangeHandler;
   selectAggOnChange: ChangeHandler;
+  selectStreamOnChange: ChangeHandler;
   insertOnChange: ChangeHandler;
   insertOneOnChange: ChangeHandler;
   updateOnChange: ChangeHandler;
@@ -36,6 +37,7 @@ export const rootFieldLabels: Record<keyof CustomRootFields, string> = {
   select: 'Select',
   select_by_pk: 'Select by PK',
   select_aggregate: 'Select Aggregate',
+  select_stream: 'Select Stream',
   insert: 'Insert',
   insert_one: 'Insert One',
   update: 'Update',
@@ -51,6 +53,7 @@ const RootFieldEditor: React.FC<RootFieldEditorProps> = ({
   selectOnChange,
   selectByPkOnChange,
   selectAggOnChange,
+  selectStreamOnChange,
   insertOnChange,
   insertOneOnChange,
   updateOnChange,
@@ -67,6 +70,7 @@ const RootFieldEditor: React.FC<RootFieldEditorProps> = ({
     select: `fetch data from the table: ${qualifiedTableName}`,
     select_by_pk: `fetch data from the table: ${qualifiedTableName} using primary key columns`,
     select_aggregate: `fetch aggregated fields from the table: ${qualifiedTableName}`,
+    select_stream: `fetch stream fields from the table: ${qualifiedTableName}`,
     insert: `insert data into the table: ${qualifiedTableName}`,
     insert_one: `insert a single row into the table: ${qualifiedTableName}`,
     update: `update data of the table: ${qualifiedTableName}`,
@@ -166,6 +170,7 @@ const RootFieldEditor: React.FC<RootFieldEditorProps> = ({
               {getRootFieldRow('select', selectOnChange)}
               {getRootFieldRow('select_by_pk', selectByPkOnChange)}
               {getRootFieldRow('select_aggregate', selectAggOnChange)}
+              {getRootFieldRow('select_stream', selectStreamOnChange)}
             </div>
           )}
           {rfType === 'mutation' && (

console/src/components/Services/Data/Schema/tableTrackCustomization/TableTrackingCustomizationContainer.tsx

@@ -81,6 +81,7 @@ export const TableTrackingCustomizationModalContainer: React.FC<TableTrackingCus
             select: values.select,
             select_by_pk: values.select_by_pk,
             select_aggregate: values.select_aggregate,
+            select_stream: values.select_stream,
             insert: values.insert,
             insert_one: values.insert_one,
             update: values.update,

console/src/components/Services/Data/Schema/tableTrackCustomization/TableTrackingCustomizationForm.tsx

@@ -46,6 +46,7 @@ export type FormValues = {
   select: string;
   select_by_pk: string;
   select_aggregate: string;
+  select_stream: string;
   insert: string;
   insert_one: string;
   update: string;
@@ -77,6 +78,7 @@ export const TableTrackingCustomizationForm: React.FC<TableTrackingCustomization
   const selectFormMethods = formMethods.register('select');
   const selectByPkFormMethods = formMethods.register('select_by_pk');
   const selectAggregateFormMethods = formMethods.register('select_aggregate');
+  const selectStreamFormMethods = formMethods.register('select_stream');
   const insertFormMethods = formMethods.register('insert');
   const insertOneFormMethods = formMethods.register('insert_one');
   const updateFormMethods = formMethods.register('update');
@@ -100,6 +102,11 @@ export const TableTrackingCustomizationForm: React.FC<TableTrackingCustomization
       placeholder: placeholders.select_aggregate,
       formMethods: selectAggregateFormMethods,
     },
+    {
+      name: 'Select Stream',
+      placeholder: placeholders.select_stream,
+      formMethods: selectStreamFormMethods,
+    },
   ];
 
   const mutationFields = [

console/src/components/Services/Data/Schema/tableTrackCustomization/TableTrackingCustomizationModal.tsx

@@ -25,6 +25,7 @@ export const TableTrackingCustomizationModal: React.FC<TableTrackingCustomizatio
       select: '',
       select_by_pk: '',
       select_aggregate: '',
+      select_stream: '',
       insert: '',
       insert_one: '',
       update: '',

console/src/components/Services/Data/Schema/tableTrackCustomization/__tests__/utils.spec.ts

@@ -16,6 +16,7 @@ describe('getTrackingTableFormPlaceholders', () => {
       select: 'customizeTableName (default)',
       select_by_pk: 'customizeTableName_by_pk (default)',
       select_aggregate: 'customizeTableName_aggregate (default)',
+      select_stream: 'customizeTableName_stream (default)',
       insert: 'insert_customizeTableName (default)',
       insert_one: 'insert_customizeTableName_one (default)',
       update: 'update_customizeTableName (default)',

console/src/components/Services/Data/Schema/tableTrackCustomization/utils.ts

@@ -5,6 +5,7 @@ type TrackingTableFormPlaceholders = {
   select: string;
   select_by_pk: string;
   select_aggregate: string;
+  select_stream: string;
   insert: string;
   insert_one: string;
   update: string;
@@ -21,6 +22,7 @@ export const getTrackingTableFormPlaceholders = (
     select: `${tableName} (default)`,
     select_by_pk: `${tableName}_by_pk (default)`,
     select_aggregate: `${tableName}_aggregate (default)`,
+    select_stream: `${tableName}_stream (default)`,
     insert: `insert_${tableName} (default)`,
     insert_one: `insert_${tableName}_one (default)`,
     update: `update_${tableName} (default)`,

console/src/components/Services/Data/TableModify/RootFieldsEditor.tsx

@@ -120,6 +120,7 @@ const RootFieldsEditor = ({
       selectOnChange={onRootFieldChange('select')}
       selectByPkOnChange={onRootFieldChange('select_by_pk')}
       selectAggOnChange={onRootFieldChange('select_aggregate')}
+      selectStreamOnChange={onRootFieldChange('select_stream')}
       insertOnChange={onRootFieldChange('insert')}
       insertOneOnChange={onRootFieldChange('insert_one')}
       updateOnChange={onRootFieldChange('update')}

console/src/dataSources/types.ts

@@ -182,6 +182,7 @@ export type CustomRootFields = {
   select?: Nullable<string> | CustomRootField;
   select_by_pk?: Nullable<string> | CustomRootField;
   select_aggregate?: Nullable<string> | CustomRootField;
+  select_stream?: Nullable<string> | CustomRootField;
   insert?: Nullable<string> | CustomRootField;
   insert_one?: Nullable<string> | CustomRootField;
   update?: Nullable<string> | CustomRootField;

console/src/metadata/types.ts

@@ -89,6 +89,8 @@ export interface CustomRootFields {
   select_by_pk?: string | CustomRootField | null;
   /** Customise the `<table-name>_aggregate` root field */
   select_aggregate?: string | CustomRootField | null;
+  /** Customise the `<table-name>_stream` root field */
+  select_stream?: string | CustomRootField | null;
   /** Customise the `insert_<table-name>` root field */
   insert?: string | CustomRootField | null;
   /** Customise the `insert_<table-name>_one` root field */