}
- message={formatMessage({
+ infoTooltipContent={formatMessage({
id: "form.connectionName.message",
})}
/>
diff --git a/airbyte-webapp/src/components/CreateConnection/DataResidency.tsx b/airbyte-webapp/src/components/CreateConnection/DataResidency.tsx
index 19863551e2b4..a1cc35db4e07 100644
--- a/airbyte-webapp/src/components/CreateConnection/DataResidency.tsx
+++ b/airbyte-webapp/src/components/CreateConnection/DataResidency.tsx
@@ -26,12 +26,13 @@ export const DataResidency: React.FC
= ({ name = "geography"
{({ field, form }: FieldProps) => (
-
+
}
- message={
+ infoTooltipContent={
Connection name*
-
-
+
- Pick a name to help you identify this connection
+
+
+
@@ -90,12 +105,27 @@ exports[`CreateConnectionForm should render 1`] = `
class=""
>
Replication frequency*
-
-
+
- Set how often data should sync to the destination
+
+
+
@@ -214,12 +244,27 @@ exports[`CreateConnectionForm should render 1`] = `
class=""
>
Destination Namespace*
-
-
+
- Define the location where the data will be stored in the destination
+
+
+
@@ -322,12 +367,27 @@ exports[`CreateConnectionForm should render 1`] = `
class=""
>
Destination Stream Prefix (Optional)
-
-
+
- Add a prefix to stream names (ex. “airbyte_” causes “projects” => “airbyte_projects”)
+
+
+
diff --git a/airbyte-webapp/src/components/LabeledControl/ControlLabels.module.scss b/airbyte-webapp/src/components/LabeledControl/ControlLabels.module.scss
index af7b055a7cde..1468e65b1598 100644
--- a/airbyte-webapp/src/components/LabeledControl/ControlLabels.module.scss
+++ b/airbyte-webapp/src/components/LabeledControl/ControlLabels.module.scss
@@ -1,5 +1,5 @@
-@use "../../scss/colors";
-@use "../../scss/variables";
+@use "scss/colors";
+@use "scss/variables";
.controlContainer {
width: 100%;
diff --git a/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.module.scss b/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.module.scss
index 7b68578ce9f9..d1cd836220d1 100644
--- a/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.module.scss
+++ b/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.module.scss
@@ -4,6 +4,10 @@
justify-content: space-between;
}
+.label {
+ width: 100%;
+}
+
.dropdownWrapper {
display: flex;
flex: 1 0 310px;
diff --git a/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.tsx b/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.tsx
index bff661856ad9..e350b464fc26 100644
--- a/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.tsx
+++ b/airbyte-webapp/src/components/connection/UpdateConnectionDataResidency/UpdateConnectionDataResidency.tsx
@@ -6,6 +6,7 @@ import { ControlLabels } from "components/LabeledControl";
import { Card } from "components/ui/Card";
import { Spinner } from "components/ui/Spinner";
import { ToastType } from "components/ui/Toast";
+import { TooltipLearnMoreLink } from "components/ui/Tooltip";
import { Geography } from "core/request/AirbyteClient";
import { useConnectionEditService } from "hooks/services/ConnectionEdit/ConnectionEditService";
@@ -43,11 +44,11 @@ export const UpdateConnectionDataResidency: React.FC = () => {
return (
-
+
}
- message={
+ infoTooltipContent={
{
{node}
),
- docLink: (node: React.ReactNode) => (
-
- {node}
-
- ),
+ docLink: () => ,
}}
/>
}
diff --git a/airbyte-webapp/src/locales/en.json b/airbyte-webapp/src/locales/en.json
index 49b7a1d5b886..35f0e9fda57a 100644
--- a/airbyte-webapp/src/locales/en.json
+++ b/airbyte-webapp/src/locales/en.json
@@ -34,7 +34,7 @@
"form.searchName": "search by name...",
"form.noResult": "No result",
"form.noConnectorFound": "No matching connector found",
- "form.connectionName": "Connection name*",
+ "form.connectionName": "Connection name",
"form.connectionName.placeholder": "Name",
"form.sourceName": "Source name",
"form.destinationName": "Destination name",
@@ -96,7 +96,7 @@
"form.dockerError": "Could not find docker image",
"form.edit": "Edit",
"form.done": "Done",
- "form.prefix": "Destination Stream Prefix (Optional)",
+ "form.prefix": "Destination Stream Prefix",
"form.prefix.message": "Add a prefix to stream names (ex. “airbyte_” causes “projects” => “airbyte_projects”)",
"form.prefix.placeholder": "prefix",
"form.nameSearch": "Search stream name",
@@ -122,7 +122,7 @@
"connectionForm.normalization.title": "Normalization",
"connectionForm.operations.notSupported": "Normalization and Transformation operations are not supported for this connection.",
"connectionForm.transformation.title": "Transformation",
- "connectionForm.namespaceDefinition.title": "Destination Namespace*",
+ "connectionForm.namespaceDefinition.title": "Destination Namespace",
"connectionForm.namespaceDefinition.subtitle": "Define the location where the data will be stored in the destination",
"connectionForm.namespaceFormat.title": "Namespace Custom Format",
"connectionForm.namespaceFormat.subtitle": "A format string to use as namespace in the destination. Special variables: $'{SOURCE_NAMESPACE'}",
@@ -151,7 +151,7 @@
"connectionForm.bulkEdit.cancel": "Cancel",
"connectionForm.bulkEdit.apply": "Apply",
"connectionForm.bulkEdit.pillButtonLabel.notAvailable": "Not available",
- "connectionForm.nonBreakingChangesPreference.label": "Non-breaking schema updates detected*",
+ "connectionForm.nonBreakingChangesPreference.label": "Non-breaking schema updates detected",
"connectionForm.nonBreakingChangesPreference.message": "Set how Airbyte handles syncs when it detects a non-breaking schema change in the source",
"connectionForm.nonBreakingChangesPreference.ignore": "Ignore",
"connectionForm.nonBreakingChangesPreference.disable": "Disable connection",
@@ -389,7 +389,7 @@
"connection.geographyTitle": "Data residency",
"connection.requestNewGeography": "Request a new geography",
- "connection.geographyDescription": "Choose where the data for this connection will be processed. Depending on your network configuration, you may need to add IP addresses to your allowlist. Learn more.",
+ "connection.geographyDescription": "Choose where the data for this connection will be processed. Depending on your network configuration, you may need to add IP addresses to your allowlist. ",
"connection.geography.auto": "Airbyte Default",
"connection.geography.us": "United States",
"connection.geography.eu": "European Union",
@@ -432,8 +432,8 @@
"connection.schemaChange.nonBreaking": "Non-breaking schema updates detected",
"connection.schemaChange.reviewAction": "Review changes",
- "form.frequency": "Replication frequency*",
- "form.cronExpression": "Cron expression*",
+ "form.frequency": "Replication frequency",
+ "form.cronExpression": "Cron expression",
"form.cronExpression.placeholder": "Cron expression",
"form.cronExpression.error": "Invalid cron expression",
"form.cronExpression.underOneHourNotAllowed": "Syncs cannot execute more frequently than once per hour",
diff --git a/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/__snapshots__/ConnectionReplicationTab.test.tsx.snap b/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/__snapshots__/ConnectionReplicationTab.test.tsx.snap
index b8d60981c950..cd975243beb4 100644
--- a/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/__snapshots__/ConnectionReplicationTab.test.tsx.snap
+++ b/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/__snapshots__/ConnectionReplicationTab.test.tsx.snap
@@ -36,12 +36,27 @@ exports[`ConnectionReplicationTab should render 1`] = `
class=""
>
Replication frequency*
-
-
+
- Set how often data should sync to the destination
+
+
+
@@ -160,12 +175,27 @@ exports[`ConnectionReplicationTab should render 1`] = `
class=""
>
Destination Namespace*
-
-
+
- Define the location where the data will be stored in the destination
+
+
+
@@ -268,12 +298,27 @@ exports[`ConnectionReplicationTab should render 1`] = `
class=""
>
Destination Stream Prefix (Optional)
-
-
+
- Add a prefix to stream names (ex. “airbyte_” causes “projects” => “airbyte_projects”)
+
+
+
diff --git a/airbyte-webapp/src/views/Connection/ConnectionForm/ConnectionFormFields.tsx b/airbyte-webapp/src/views/Connection/ConnectionForm/ConnectionFormFields.tsx
index 07e7ea82f720..edd8f05d5812 100644
--- a/airbyte-webapp/src/views/Connection/ConnectionForm/ConnectionFormFields.tsx
+++ b/airbyte-webapp/src/views/Connection/ConnectionForm/ConnectionFormFields.tsx
@@ -72,14 +72,14 @@ export const ConnectionFormFields: React.FC = ({ valu
{values.namespaceDefinition === NamespaceDefinitionType.customformat && (
{({ field, meta }: FieldProps) => (
-
+
}
- message={}
+ infoTooltipContent={}
/>
@@ -97,14 +97,15 @@ export const ConnectionFormFields: React.FC
= ({ valu
)}
{({ field }: FieldProps) => (
-
+
diff --git a/airbyte-webapp/src/views/Connection/ConnectionForm/ScheduleField/ScheduleField.tsx b/airbyte-webapp/src/views/Connection/ConnectionForm/ScheduleField/ScheduleField.tsx
index b9d267c8d5e2..368c39c97576 100644
--- a/airbyte-webapp/src/views/Connection/ConnectionForm/ScheduleField/ScheduleField.tsx
+++ b/airbyte-webapp/src/views/Connection/ConnectionForm/ScheduleField/ScheduleField.tsx
@@ -135,7 +135,7 @@ export const ScheduleField: React.FC = () => {
{({ field, meta, form }: FieldProps) => (
<>
-
+
{
label={formatMessage({
id: "form.frequency",
})}
- message={formatMessage({
+ infoTooltipContent={formatMessage({
id: "form.frequency.message",
})}
/>
@@ -161,7 +161,7 @@ export const ScheduleField: React.FC = () => {
{isCron(form) && (
-
+
{
label={formatMessage({
id: "form.cronExpression",
})}
- message={formatMessage(
+ infoTooltipContent={formatMessage(
{
id: "form.cronExpression.message",
},
@@ -186,7 +186,7 @@ export const ScheduleField: React.FC = () => {
-
+
> = ({ field,
const [, meta] = useField(field.name);
return (
-
+
}
- message={}
+ infoTooltipContent={}
/>
diff --git a/airbyte-webapp/src/views/Connection/ConnectionForm/components/NonBreakingChangesPreferenceField.tsx b/airbyte-webapp/src/views/Connection/ConnectionForm/components/NonBreakingChangesPreferenceField.tsx
index 1e0e34d316fa..35eb5421ec5d 100644
--- a/airbyte-webapp/src/views/Connection/ConnectionForm/components/NonBreakingChangesPreferenceField.tsx
+++ b/airbyte-webapp/src/views/Connection/ConnectionForm/components/NonBreakingChangesPreferenceField.tsx
@@ -28,14 +28,14 @@ export const NonBreakingChangesPreferenceField: React.FC
> = (
const { mode } = useConnectionFormService();
return (
-
+