Skip to content

Commit

Permalink
fix: add warning for copying not working in insecure contexts
Browse files Browse the repository at this point in the history
  • Loading branch information
mmuzikar committed Aug 29, 2024
1 parent 4368104 commit 255d2f8
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 4 deletions.
3 changes: 2 additions & 1 deletion packages/hawtio/src/core/event-service.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
import EventEmitter from 'eventemitter3'
import { Logger } from './logging'
import React from 'react'

const log = Logger.get('hawtio-core-event')

export type NotificationType = 'info' | 'success' | 'warning' | 'danger' | 'custom'

export type Notification = {
type: NotificationType
message: string
message: React.ReactNode
duration?: number
}

Expand Down
27 changes: 25 additions & 2 deletions packages/hawtio/src/plugins/shared/operations/OperationForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { eventService } from '@hawtiosrc/core'
import { PluginNodeSelectionContext } from '@hawtiosrc/plugins/context'
import {
ActionGroup,
Alert,
Button,
Checkbox,
ClipboardCopy,
Expand Down Expand Up @@ -93,6 +94,12 @@ export const OperationForm: React.FunctionComponent<{
)
}

const InsecureContextWarning: React.FunctionComponent = () => {
return <Alert title="Insecure context limits functionality" variant='warning'>
Because Hawtio is accessed through insecure context (http:), it's not possible to copy data into the clipboard
</Alert>
}

const OperationActions: React.FunctionComponent = () => {
const { name, operation, objectName } = useContext(OperationContext)
const [isDropdownOpen, setIsDropdownOpen] = useState(false)
Expand All @@ -108,9 +115,23 @@ const OperationActions: React.FunctionComponent = () => {
})
}

const notifyCopyFailure = (text: string) => {
eventService.notify({
type: 'warning',
message: <><p>Because Hawtio is accessed through insecure context (http:), it's not possible to copy data into the clipboard.</p>
<p>You can copy the URL manually: <code>{text}</code></p>
</>,
duration: 10_000
})
}

const copyToClipboard = (text: string) => {
navigator.clipboard.writeText(text)
notifySuccessfulCopy()
try {
navigator.clipboard.writeText(text)
notifySuccessfulCopy()
} catch (e) {
notifyCopyFailure(text)
}
}

const copyMethodName = () => {
Expand All @@ -129,6 +150,7 @@ const OperationActions: React.FunctionComponent = () => {
>
<Dropdown
key={`operation-action-dropdown-${name}`}
popperProps={{position: 'right'}}
isOpen={isDropdownOpen}
onOpenChange={setIsDropdownOpen}
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
Expand All @@ -138,6 +160,7 @@ const OperationActions: React.FunctionComponent = () => {
)}
>
<DropdownList>
{!isSecureContext && <InsecureContextWarning />}
<DropdownItem key={`operation-action-copy-method-name-${name}`} onClick={copyMethodName}>
Copy method name
</DropdownItem>
Expand Down
2 changes: 1 addition & 1 deletion packages/hawtio/src/ui/notification/HawtioNotification.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export const HawtioNotification: React.FunctionComponent = () => {
return overflow > 0 ? `View ${overflow} more alerts` : ''
}

const addAlert = (title: string, variant: NotificationType, key: React.Key) => {
const addAlert = (title: React.ReactNode, variant: NotificationType, key: React.Key) => {
const newAlerts = [...alerts, { title, variant, key }]
setAlerts(newAlerts)
setOverflowMessage(getOverflowMessage(newAlerts.length))
Expand Down

0 comments on commit 255d2f8

Please sign in to comment.