initial commit

elastic · Nov 12, 2024 · b4ae7e0 · b4ae7e0
1 parent 7f2a324
commit b4ae7e0
Show file tree

Hide file tree

Showing 7 changed files with 122 additions and 0 deletions.
diff --git a/...tation_util/public/components/dashboard_drilldown_options/dashboard_drilldown_options.tsx b/...tation_util/public/components/dashboard_drilldown_options/dashboard_drilldown_options.tsx
@@ -52,6 +52,34 @@ export const DashboardDrilldownOptionsComponent = ({
             onChange={() => onOptionChange({ openInNewTab: !options.openInNewTab })}
             data-test-subj="dashboardDrillDownOptions--openInNewTab--checkbox"
           />
+          <EuiSpacer size="s" />
+          <EuiSwitch
+            compressed
+            name="overflowTextWrap"
+            label={dashboardDrilldownConfigStrings.component.getOverflowTextWrap()}
+            checked={options.overflowTextWrap}
+            onChange={() =>
+              onOptionChange({
+                overflowTextWrap: !options.overflowTextWrap,
+                overflowEllipsis: !options.overflowEllipsis,
+              })
+            }
+            data-test-subj="dashboardDrillDownOptions--overflowTextWrap--checkbox"
+          />
+          <EuiSpacer size="s" />
+          <EuiSwitch
+            compressed
+            name="overflowEllipsis"
+            label={dashboardDrilldownConfigStrings.component.getOverflowEllipsis()}
+            checked={options.overflowEllipsis}
+            onChange={() =>
+              onOptionChange({
+                overflowEllipsis: !options.overflowEllipsis,
+                overflowTextWrap: !options.overflowTextWrap,
+              })
+            }
+            data-test-subj="dashboardDrillDownOptions--overflowEllipsis--checkbox"
+          />
         </div>
       </EuiFormRow>
     </>

diff --git a/src/plugins/presentation_util/public/components/dashboard_drilldown_options/types.ts b/src/plugins/presentation_util/public/components/dashboard_drilldown_options/types.ts
@@ -12,10 +12,14 @@ export type DashboardDrilldownOptions = {
   useCurrentFilters: boolean;
   useCurrentDateRange: boolean;
   openInNewTab: boolean;
+  overflowTextWrap: boolean;
+  overflowEllipsis: boolean;
 };
 
 export const DEFAULT_DASHBOARD_DRILLDOWN_OPTIONS: DashboardDrilldownOptions = {
   openInNewTab: false,
   useCurrentDateRange: true,
   useCurrentFilters: true,
+  overflowEllipsis: false,
+  overflowTextWrap: true,
 };
diff --git a/src/plugins/presentation_util/public/i18n/dashboard_drilldown_config.tsx b/src/plugins/presentation_util/public/i18n/dashboard_drilldown_config.tsx
@@ -26,5 +26,13 @@ export const dashboardDrilldownConfigStrings = {
       i18n.translate('presentationUtil.dashboardDrilldownConfig.components.openInNewTab', {
         defaultMessage: 'Open dashboard in new tab',
       }),
+    getOverflowTextWrap: () =>
+      i18n.translate('presentationUtil.dashboardDrilldownConfig.components.overflowTextWrap', {
+        defaultMessage: 'Wrap text',
+      }),
+    getOverflowEllipsis: () =>
+      i18n.translate('presentationUtil.dashboardDrilldownConfig.components.overflowEllipsis', {
+        defaultMessage: 'Truncate text with ellipsis',
+      }),
   },
 };
diff --git a/..._enhanced/public/drilldowns/url_drilldown/components/url_drilldown_collect_config/i18n.ts b/..._enhanced/public/drilldowns/url_drilldown/components/url_drilldown_collect_config/i18n.ts
@@ -83,3 +83,31 @@ export const txtUrlTemplateEncodeDescription = i18n.translate(
     defaultMessage: 'If enabled, URL will be escaped using percent encoding',
   }
 );
+
+export const txtUrlTemplateOverflowTextWrap = i18n.translate(
+  'uiActionsEnhanced.drilldowns.urlDrilldownCollectConfig.overflowTextWrap',
+  {
+    defaultMessage: 'Wrap text',
+  }
+);
+
+export const txtUrlTemplateOverflowTextWrapDescription = i18n.translate(
+  'uiActionsEnhanced.drilldowns.urlDrilldownCollectConfig.overflowTextWrapDescription',
+  {
+    defaultMessage: 'If enabled, text will wrap instead of being truncated',
+  }
+);
+
+export const txtUrlTemplateOverflowEllipsis = i18n.translate(
+  'uiActionsEnhanced.drilldowns.urlDrilldownCollectConfig.overflowEllipsis',
+  {
+    defaultMessage: 'Truncate text with ellipsis',
+  }
+);
+
+export const txtUrlTemplateOverflowEllipsisDescription = i18n.translate(
+  'uiActionsEnhanced.drilldowns.urlDrilldownCollectConfig.overflowEllipsisDescription',
+  {
+    defaultMessage: 'If enabled, text will be truncated with ellipsis',
+  }
+);
diff --git a/...rilldowns/url_drilldown/components/url_drilldown_collect_config/url_drilldown_options.tsx b/...rilldowns/url_drilldown/components/url_drilldown_collect_config/url_drilldown_options.tsx
@@ -14,6 +14,10 @@ import {
   txtUrlTemplateEncodeDescription,
   txtUrlTemplateEncodeUrl,
   txtUrlTemplateOpenInNewTab,
+  txtUrlTemplateOverflowEllipsis,
+  txtUrlTemplateOverflowEllipsisDescription,
+  txtUrlTemplateOverflowTextWrap,
+  txtUrlTemplateOverflowTextWrapDescription,
 } from './i18n';
 import { UrlDrilldownOptions } from '../../types';
 
@@ -55,6 +59,52 @@ export const UrlDrilldownOptionsComponent = ({
             onChange={() => onOptionChange({ encodeUrl: !options.encodeUrl })}
             data-test-subj="urlDrilldownEncodeUrl"
           />
+          <EuiSpacer size="s" />
+          <EuiSwitch
+            compressed
+            id="overflowTextWrap"
+            name="overflowTextWrap"
+            label={
+              <>
+                {txtUrlTemplateOverflowTextWrap}
+                <EuiSpacer size={'s'} />
+                <EuiTextColor color="subdued">
+                  {txtUrlTemplateOverflowTextWrapDescription}
+                </EuiTextColor>
+              </>
+            }
+            checked={options.overflowTextWrap}
+            onChange={() =>
+              onOptionChange({
+                overflowTextWrap: !options.overflowTextWrap,
+                overflowEllipsis: !options.overflowEllipsis,
+              })
+            }
+            data-test-subj="urlDrilldownOverflowTextWrap"
+          />
+          <EuiSpacer size="s" />
+          <EuiSwitch
+            compressed
+            id="overflowEllipsis"
+            name="overflowEllipsis"
+            label={
+              <>
+                {txtUrlTemplateOverflowEllipsis}
+                <EuiSpacer size={'s'} />
+                <EuiTextColor color="subdued">
+                  {txtUrlTemplateOverflowEllipsisDescription}
+                </EuiTextColor>
+              </>
+            }
+            checked={options.overflowEllipsis}
+            onChange={() =>
+              onOptionChange({
+                overflowEllipsis: !options.overflowEllipsis,
+                overflowTextWrap: !options.overflowTextWrap,
+              })
+            }
+            data-test-subj="urlDrilldownOverflowEllipsis"
+          />
         </div>
       </EuiFormRow>
     </>

diff --git a/src/plugins/ui_actions_enhanced/public/drilldowns/url_drilldown/constants.ts b/src/plugins/ui_actions_enhanced/public/drilldowns/url_drilldown/constants.ts
@@ -12,4 +12,6 @@ import { UrlDrilldownOptions } from './types';
 export const DEFAULT_URL_DRILLDOWN_OPTIONS: UrlDrilldownOptions = {
   encodeUrl: true,
   openInNewTab: true,
+  overflowTextWrap: true,
+  overflowEllipsis: false,
 };
diff --git a/src/plugins/ui_actions_enhanced/public/drilldowns/url_drilldown/types.ts b/src/plugins/ui_actions_enhanced/public/drilldowns/url_drilldown/types.ts
@@ -18,6 +18,8 @@ export type UrlDrilldownConfig = {
 export type UrlDrilldownOptions = {
   openInNewTab: boolean;
   encodeUrl: boolean;
+  overflowTextWrap: boolean;
+  overflowEllipsis: boolean;
 };
 
 /**