Merge pull request #2783 from DenverCoder544/collapse_tooltips

add collapse tooltips
oskariorg · Feb 3, 2025 · bfbe2ea · bfbe2ea
2 parents bd5df76 + 04f179a
commit bfbe2ea
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/bundles/framework/publisher2/view/PublisherSideBarHandler.js b/bundles/framework/publisher2/view/PublisherSideBarHandler.js
@@ -16,6 +16,7 @@ import { LAYOUT_AVAILABLE_FONTS, PanelLayoutHandler } from '../handler/PanelLayo
 import { PanelToolStyles } from './PanelToolStyles';
 import { ToolLayout } from './form/ToolLayout';
 import { PanelToolLayoutHandler } from '../handler/PanelToolLayoutHandler';
+import { Info } from 'oskari-ui/components/icons/Info';
 
 export const PUBLISHER_BUNDLE_ID = 'Publisher2';
 const PANEL_GENERAL_INFO_ID = 'panelGeneralInfo';
@@ -81,7 +82,8 @@ class PublisherSidebarUIHandler extends StateHandler {
         collapseItems.push({
             key: PANEL_MAPPREVIEW_ID,
             label: Oskari.getMsg('Publisher2', 'BasicView.size.label'),
-            children: this.renderMapPreviewPanel()
+            children: this.renderMapPreviewPanel(),
+            extra: <MapPreviewTooltip/>
         });
 
         collapseItems.push({
@@ -93,7 +95,8 @@ class PublisherSidebarUIHandler extends StateHandler {
         collapseItems.push({
             key: PANEL_MAPTOOLS_ID,
             label: Oskari.getMsg('Publisher2', 'BasicView.tools.label'),
-            children: this.renderMapToolsPanel()
+            children: this.renderMapToolsPanel(),
+            extra: <Info title={Oskari.getMsg('Publisher2', 'BasicView.maptools.tooltip')}/>
         });
 
         collapseItems.push({
@@ -105,7 +108,8 @@ class PublisherSidebarUIHandler extends StateHandler {
         collapseItems.push({
             key: PANEL_TOOL_LAYOUT_ID,
             label: Oskari.getMsg('Publisher2', 'BasicView.toollayout.label'),
-            children: this.renderToolLayoutPanel()
+            children: this.renderToolLayoutPanel(),
+            extra: <Info title={Oskari.getMsg('Publisher2', 'BasicView.domain.title')}/>
         });
 
         // RPC panel should be the last in line after all other (react collapsified) panels
@@ -116,7 +120,9 @@ class PublisherSidebarUIHandler extends StateHandler {
             collapseItems.push({
                 key: PANEL_RPC_ID,
                 label: Oskari.getMsg('Publisher2', 'BasicView.rpc.label'),
-                children: this.renderRpcPanel()
+                children: this.renderRpcPanel(),
+                extra: <Info title={Oskari.getMsg('Publisher2', 'BasicView.rpc.info')}/>
+
             });
         }
 
@@ -160,7 +166,6 @@ class PublisherSidebarUIHandler extends StateHandler {
 
     renderMapPreviewPanel () {
         return <div className={'t_size'}>
-            <MapPreviewTooltip/>
             <MapPreviewForm
                 onChange={(value) => { this.mapPreviewPanelHandler.updateMapSize(value); }}
                 mapSizeOptions={MAP_SIZES}

diff --git a/bundles/framework/publisher2/view/form/MapPreviewForm.jsx b/bundles/framework/publisher2/view/form/MapPreviewForm.jsx
@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { Radio, TextInput, Message } from 'oskari-ui';
+import { Info } from 'oskari-ui/components/icons/Info';
 import styled from 'styled-components';
 import PropTypes from 'prop-types';
 import { CUSTOM_MAP_SIZE_ID, CUSTOM_MAP_SIZE_LIMITS } from '../../handler/PanelMapPreviewHandler';
@@ -46,7 +47,7 @@ export const MapPreviewTooltip = () => {
     tooltip = tooltip.replace('{maxWidth}', CUSTOM_MAP_SIZE_LIMITS.maxWidth);
     tooltip = tooltip.replace('{minHeight}', CUSTOM_MAP_SIZE_LIMITS.minHeight);
     tooltip = tooltip.replace('{maxHeight}', CUSTOM_MAP_SIZE_LIMITS.maxHeight);
-    return <div className='help icon-info' title={tooltip}/>;
+    return <Info title={tooltip}/>;
 };
 
 export const MapPreviewForm = (props) => {