Skip to content

Commit

Permalink
fix(frontend): refactor how buttons are created
Browse files Browse the repository at this point in the history
  • Loading branch information
fatonramadani committed Oct 5, 2023
1 parent 6bdf4fb commit c20e8d9
Showing 1 changed file with 18 additions and 18 deletions.
36 changes: 18 additions & 18 deletions frontend/src/lib/components/tutorials/Tutorial.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,17 @@
const { flowStore, ignoredTutorials } = getContext<FlowEditorContext>('FlowEditorContext')
const dispatch = createEventDispatcher()
function createTutorialButton(text: string, onClick: () => void) {
const button = document.createElement('button')
button.innerHTML = text
button.addEventListener('click', onClick)
button.setAttribute(
'class',
'border px-2 py-1 !text-xs font-normal rounded-md hover:bg-surface-hover transition-all flex items-center'
)
return button
}
export const runTutorial = () => {
if (tainted($flowStore)) {
dispatch('error', { detail: name })
Expand All @@ -25,28 +36,17 @@
allowClose: true,
onPopoverRender: (popover, { config, state }) => {
if (state.activeIndex == 0) {
const skipThisButton = document.createElement('button')
skipThisButton.innerText = 'Mark this tutorial as completed'
skipThisButton.addEventListener('click', () => {
const skipThisButton = createTutorialButton('Mark this tutorial as completed', () => {
updateProgress(index)
tutorial.destroy()
})
skipThisButton.setAttribute(
'class',
'border px-2 py-1 !text-xs font-normal rounded-md hover:bg-surface-hover transition-all flex items-center'
)
const skipAllButton = document.createElement('button')
skipAllButton.innerHTML = 'Mark&nbsp;<b>all</b>&nbsp;tutorials as completed'
skipAllButton.addEventListener('click', () => {
dispatch('skipAll')
tutorial.destroy()
})
skipAllButton.setAttribute(
'class',
'border px-2 py-1 !text-xs font-normal rounded-md hover:bg-surface-hover transition-all flex items-center'
const skipAllButton = createTutorialButton(
'Mark&nbsp;<b>all</b>&nbsp;tutorials as completed',
() => {
dispatch('skipAll')
tutorial.destroy()
}
)
const popoverDescription = document.querySelector('#driver-popover-description')
Expand Down

0 comments on commit c20e8d9

Please sign in to comment.