mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-07-14 04:31:46 +08:00
feat: added tooltips for facing issue btn (#4948)
This commit is contained in:
parent
241edcb88a
commit
1aec7f3ca6
@ -1,6 +1,6 @@
|
|||||||
import './FacingIssueBtn.style.scss';
|
import './FacingIssueBtn.style.scss';
|
||||||
|
|
||||||
import { Button } from 'antd';
|
import { Button, Tooltip } from 'antd';
|
||||||
import logEvent from 'api/common/logEvent';
|
import logEvent from 'api/common/logEvent';
|
||||||
import cx from 'classnames';
|
import cx from 'classnames';
|
||||||
import { FeatureKeys } from 'constants/features';
|
import { FeatureKeys } from 'constants/features';
|
||||||
@ -15,6 +15,7 @@ export interface FacingIssueBtnProps {
|
|||||||
message?: string;
|
message?: string;
|
||||||
buttonText?: string;
|
buttonText?: string;
|
||||||
className?: string;
|
className?: string;
|
||||||
|
onHoverText?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
function FacingIssueBtn({
|
function FacingIssueBtn({
|
||||||
@ -23,6 +24,7 @@ function FacingIssueBtn({
|
|||||||
message = '',
|
message = '',
|
||||||
buttonText = '',
|
buttonText = '',
|
||||||
className = '',
|
className = '',
|
||||||
|
onHoverText = '',
|
||||||
}: FacingIssueBtnProps): JSX.Element | null {
|
}: FacingIssueBtnProps): JSX.Element | null {
|
||||||
const handleFacingIssuesClick = (): void => {
|
const handleFacingIssuesClick = (): void => {
|
||||||
logEvent(eventName, attributes);
|
logEvent(eventName, attributes);
|
||||||
@ -37,6 +39,7 @@ function FacingIssueBtn({
|
|||||||
|
|
||||||
return isCloudUserVal && isChatSupportEnabled ? ( // Note: we would need to move this condition to license based in future
|
return isCloudUserVal && isChatSupportEnabled ? ( // Note: we would need to move this condition to license based in future
|
||||||
<div className="facing-issue-button">
|
<div className="facing-issue-button">
|
||||||
|
<Tooltip title={onHoverText} autoAdjustOverflow>
|
||||||
<Button
|
<Button
|
||||||
className={cx('periscope-btn', 'facing-issue-button', className)}
|
className={cx('periscope-btn', 'facing-issue-button', className)}
|
||||||
onClick={handleFacingIssuesClick}
|
onClick={handleFacingIssuesClick}
|
||||||
@ -44,6 +47,7 @@ function FacingIssueBtn({
|
|||||||
>
|
>
|
||||||
{buttonText || 'Facing issues?'}
|
{buttonText || 'Facing issues?'}
|
||||||
</Button>
|
</Button>
|
||||||
|
</Tooltip>
|
||||||
</div>
|
</div>
|
||||||
) : null;
|
) : null;
|
||||||
}
|
}
|
||||||
@ -52,6 +56,7 @@ FacingIssueBtn.defaultProps = {
|
|||||||
message: '',
|
message: '',
|
||||||
buttonText: '',
|
buttonText: '',
|
||||||
className: '',
|
className: '',
|
||||||
|
onHoverText: '',
|
||||||
};
|
};
|
||||||
|
|
||||||
export default FacingIssueBtn;
|
export default FacingIssueBtn;
|
||||||
|
@ -588,7 +588,7 @@ function FormAlertRules({
|
|||||||
eventName="Alert: Facing Issues in alert"
|
eventName="Alert: Facing Issues in alert"
|
||||||
buttonText="Need help with this alert?"
|
buttonText="Need help with this alert?"
|
||||||
message={alertHelpMessage(alertDef, ruleId)}
|
message={alertHelpMessage(alertDef, ruleId)}
|
||||||
// onHover: Click here to get help with this alert
|
onHoverText="Click here to get help with this alert"
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
</PanelContainer>
|
</PanelContainer>
|
||||||
|
@ -495,7 +495,7 @@ function GraphLayout({ onAddPanelHandler }: GraphLayoutProps): JSX.Element {
|
|||||||
eventName="Dashboard: Facing Issues in dashboard"
|
eventName="Dashboard: Facing Issues in dashboard"
|
||||||
buttonText="Need help with this dashboard?"
|
buttonText="Need help with this dashboard?"
|
||||||
message={dashboardHelpMessage(data, selectedDashboard)}
|
message={dashboardHelpMessage(data, selectedDashboard)}
|
||||||
// onHover: Click here to get help for this dashboard
|
onHoverText="Click here to get help for this dashboard"
|
||||||
/>
|
/>
|
||||||
<ButtonContainer>
|
<ButtonContainer>
|
||||||
<Tooltip title="Open in Full Screen">
|
<Tooltip title="Open in Full Screen">
|
||||||
|
@ -366,8 +366,8 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
|
|||||||
eventName: 'Alert: Facing Issues in alert',
|
eventName: 'Alert: Facing Issues in alert',
|
||||||
buttonText: 'Facing issues with alerts?',
|
buttonText: 'Facing issues with alerts?',
|
||||||
message: listAlertMessage,
|
message: listAlertMessage,
|
||||||
|
onHoverText: 'Click here to get help with alerts',
|
||||||
}}
|
}}
|
||||||
// onHover: Click here to get help with alerts
|
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
@ -393,7 +393,7 @@ function DashboardsList(): JSX.Element {
|
|||||||
eventName: 'Dashboard: Facing Issues in dashboard',
|
eventName: 'Dashboard: Facing Issues in dashboard',
|
||||||
buttonText: 'Facing issues with dashboards?',
|
buttonText: 'Facing issues with dashboards?',
|
||||||
message: dashboardListMessage,
|
message: dashboardListMessage,
|
||||||
// onHover: Click here to get help with dashboards
|
onHoverText: 'Click here to get help with dashboards',
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</TableContainer>
|
</TableContainer>
|
||||||
|
@ -418,7 +418,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
|
|||||||
eventName="Dashboard: Facing Issues in dashboard"
|
eventName="Dashboard: Facing Issues in dashboard"
|
||||||
buttonText="Need help with this chart?"
|
buttonText="Need help with this chart?"
|
||||||
message={chartHelpMessage(selectedDashboard, graphType)}
|
message={chartHelpMessage(selectedDashboard, graphType)}
|
||||||
// onHover: Click here to get help in creating chart
|
onHoverText="Click here to get help in creating chart"
|
||||||
/>
|
/>
|
||||||
<ButtonContainer>
|
<ButtonContainer>
|
||||||
{isSaveDisabled && (
|
{isSaveDisabled && (
|
||||||
|
Loading…
x
Reference in New Issue
Block a user