Skip to content

Commit

Permalink
Fixed endless growing page, made Footer optional and created simple d…
Browse files Browse the repository at this point in the history
…efault flow
  • Loading branch information
mellelieuwes committed Dec 11, 2023
1 parent c9c192d commit 65f4ccf
Show file tree
Hide file tree
Showing 11 changed files with 78 additions and 290 deletions.
Binary file modified public/port-0.0.0-py3-none-any.whl
Binary file not shown.
Binary file modified src/framework/processing/py/dist/port-0.0.0-py3-none-any.whl
Binary file not shown.
9 changes: 7 additions & 2 deletions src/framework/processing/py/port/api/props.py
Original file line number Diff line number Diff line change
Expand Up @@ -401,15 +401,20 @@ class PropsUIPageDonation:
platform: str
header: PropsUIHeader
body: PropsUIPromptRadioInput | PropsUIPromptConsentForm | PropsUIPromptFileInput | PropsUIPromptConfirm | PropsUIPromptQuestionnaire
footer: PropsUIFooter
footer: Optional[PropsUIFooter]

def translate_footer(self):
if self.footer is None:
return None
return self.footer.toDict()

def toDict(self):
dict = {}
dict["__type__"] = "PropsUIPageDonation"
dict["platform"] = self.platform
dict["header"] = self.header.toDict()
dict["body"] = self.body.toDict()
dict["footer"] = self.footer.toDict()
dict["footer"] = self.translate_footer()
return dict


Expand Down
112 changes: 46 additions & 66 deletions src/framework/processing/py/port/script.py
Original file line number Diff line number Diff line change
Expand Up @@ -8,80 +8,59 @@
def process(sessionId):
yield donate(f"{sessionId}-tracking", '[{ "message": "user entered script" }]')

platforms = ["Twitter", "Facebook", "Instagram", "Youtube"]

subflows = len(platforms)
steps = 2
step_percentage = (100/subflows)/steps

# progress in %
progress = 0

for index, platform in enumerate(platforms):
meta_data = []
meta_data.append(("debug", f"{platform}: start"))

# STEP 1: select the file
progress += step_percentage
data = None
while True:
meta_data.append(("debug", f"{platform}: prompt file"))
promptFile = prompt_file(platform, "application/zip, text/plain")
fileResult = yield render_donation_page(platform, promptFile, progress)
if fileResult.__type__ == 'PayloadString':
meta_data.append(("debug", f"{platform}: extracting file"))
extractionResult = doSomethingWithTheFile(platform, fileResult.value)
if extractionResult != 'invalid':
meta_data.append(("debug", f"{platform}: extraction successful, go to consent form"))
data = extractionResult
break
else:
meta_data.append(("debug", f"{platform}: prompt confirmation to retry file selection"))
retry_result = yield render_donation_page(platform, retry_confirmation(platform), progress)
if retry_result.__type__ == 'PayloadTrue':
meta_data.append(("debug", f"{platform}: skip due to invalid file"))
continue
else:
meta_data.append(("debug", f"{platform}: retry prompt file"))
break
else:
meta_data.append(("debug", f"{platform}: skip to next step"))
key = "zip-contents-example"
meta_data = []
meta_data.append(("debug", f"{key}: start"))

# STEP 1: select the file
data = None
while True:
meta_data.append(("debug", f"{key}: prompt file"))
promptFile = prompt_file("application/zip, text/plain")
fileResult = yield render_donation_page(promptFile)
if fileResult.__type__ == 'PayloadString':
meta_data.append(("debug", f"{key}: extracting file"))
extractionResult = doSomethingWithTheFile(fileResult.value)
if extractionResult != 'invalid':
meta_data.append(("debug", f"{key}: extraction successful, go to consent form"))
data = extractionResult
break
else:
meta_data.append(("debug", f"{key}: prompt confirmation to retry file selection"))
retry_result = yield render_donation_page(retry_confirmation())
if retry_result.__type__ == 'PayloadTrue':
meta_data.append(("debug", f"{key}: skip due to invalid file"))
continue
else:
meta_data.append(("debug", f"{key}: retry prompt file"))
break

# STEP 2: ask for consent
progress += step_percentage
if data is not None:
meta_data.append(("debug", f"{platform}: prompt consent"))
prompt = prompt_consent(platform, data, meta_data)
consent_result = yield render_donation_page(platform, prompt, progress)
if consent_result.__type__ == "PayloadJSON":
meta_data.append(("debug", f"{platform}: donate consent data"))
yield donate(f"{sessionId}-{platform}", consent_result.value)
# STEP 2: ask for consent
if data is not None:
meta_data.append(("debug", f"{key}: prompt consent"))
prompt = prompt_consent(data, meta_data)
consent_result = yield render_donation_page(prompt)
if consent_result.__type__ == "PayloadJSON":
meta_data.append(("debug", f"{key}: donate consent data"))
yield donate(f"{sessionId}-{key}", consent_result.value)

yield exit(0, "Success")
yield render_end_page()


def render_end_page():
page = props.PropsUIPageEnd()
return CommandUIRender(page)


def render_donation_page(platform, body, progress):
def render_donation_page(body):
header = props.PropsUIHeader(props.Translatable({
"en": platform,
"nl": platform
"en": "Port flow example",
"nl": "Port voorbeeld flow"
}))

footer = props.PropsUIFooter(progress)
page = props.PropsUIPageDonation(platform, header, body, footer)
page = props.PropsUIPageDonation("Zip", header, body, None)
return CommandUIRender(page)


def retry_confirmation(platform):
def retry_confirmation():
text = props.Translatable({
"en": f"Unfortunately, we cannot process your {platform} file. Continue, if you are sure that you selected the right file. Try again to select a different file.",
"nl": f"Helaas, kunnen we uw {platform} bestand niet verwerken. Weet u zeker dat u het juiste bestand heeft gekozen? Ga dan verder. Probeer opnieuw als u een ander bestand wilt kiezen."
"en": "Unfortunately, we cannot process your file. Continue, if you are sure that you selected the right file. Try again to select a different file.",
"nl": "Helaas, kunnen we uw bestand niet verwerken. Weet u zeker dat u het juiste bestand heeft gekozen? Ga dan verder. Probeer opnieuw als u een ander bestand wilt kiezen."
})
ok = props.Translatable({
"en": "Try again",
Expand All @@ -94,16 +73,16 @@ def retry_confirmation(platform):
return props.PropsUIPromptConfirm(text, ok, cancel)


def prompt_file(platform, extensions):
def prompt_file(extensions):
description = props.Translatable({
"en": f"Please follow the download instructions and choose the file that you stored on your device. Click “Skip” at the right bottom, if you do not have a {platform} file. ",
"nl": f"Volg de download instructies en kies het bestand dat u opgeslagen heeft op uw apparaat. Als u geen {platform} bestand heeft klik dan op “Overslaan” rechts onder."
"en": "Please select any zip file stored on your device.",
"nl": "Selecteer een willekeurige zip file die u heeft opgeslagen op uw apparaat."
})

return props.PropsUIPromptFileInput(description, extensions)


def doSomethingWithTheFile(platform, filename):
def doSomethingWithTheFile(filename):
return extract_zip_contents(filename)


Expand All @@ -121,7 +100,7 @@ def extract_zip_contents(filename):
return "invalid"


def prompt_consent(id, data, meta_data):
def prompt_consent(data, meta_data):

table_title = props.Translatable({
"en": "Zip file contents",
Expand All @@ -143,5 +122,6 @@ def prompt_consent(id, data, meta_data):
def donate(key, json_string):
return CommandSystemDonate(key, json_string)


def exit(code, info):
return CommandSystemExit(code, info)
23 changes: 2 additions & 21 deletions src/framework/processing/worker_engine.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,12 @@
import { CommandHandler, ProcessingEngine } from '../types/modules'
import { CommandSystemDonate, CommandUIRender, isCommand, Response } from '../types/commands'
import { CommandSystemDonate, isCommand, Response } from '../types/commands'

export default class WorkerProcessingEngine implements ProcessingEngine {
sessionId: String
worker: Worker
commandHandler: CommandHandler

resolveInitialized!: () => void
resolveContinue!: () => void

constructor (sessionId: string, worker: Worker, commandHandler: CommandHandler) {
this.sessionId = sessionId
Expand Down Expand Up @@ -60,9 +59,8 @@ export default class WorkerProcessingEngine implements ProcessingEngine {
console.log('[WorkerProcessingEngine] started')

const waitForInitialization: Promise<void> = this.waitForInitialization()
const waitForSplashScreen: Promise<void> = this.waitForSplashScreen()

Promise.all([waitForInitialization, waitForSplashScreen]).then(
waitForInitialization.then(
() => { this.firstRunCycle() },
() => {}
)
Expand All @@ -75,23 +73,6 @@ export default class WorkerProcessingEngine implements ProcessingEngine {
})
}

async waitForSplashScreen (): Promise<void> {
return await new Promise<void>((resolve) => {
this.resolveContinue = resolve
this.renderSplashScreen()
})
}

renderSplashScreen (): void {
const command: CommandUIRender = { __type__: 'CommandUIRender', page: { __type__: 'PropsUIPageSplashScreen' } }
if (isCommand(command)) {
this.commandHandler.onCommand(command).then(
(_response) => this.resolveContinue(),
() => {}
)
}
}

firstRunCycle (): void {
this.worker.postMessage({ eventType: 'firstRunCycle', sessionId: this.sessionId })
}
Expand Down
13 changes: 2 additions & 11 deletions src/framework/types/pages.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,36 +9,27 @@ import {
} from './prompts'

export type PropsUIPage =
PropsUIPageSplashScreen |
PropsUIPageDonation |
PropsUIPageEnd |
PropsUIPageError

export function isPropsUIPage (arg: any): arg is PropsUIPage {
return (
isPropsUIPageSplashScreen(arg) ||
isPropsUIPageDonation(arg) ||
isPropsUIPageEnd(arg) ||
isPropsUIPageError(arg)
)
}

export interface PropsUIPageSplashScreen {
__type__: 'PropsUIPageSplashScreen'
}
export function isPropsUIPageSplashScreen (arg: any): arg is PropsUIPageSplashScreen {
return isInstanceOf<PropsUIPageSplashScreen>(arg, 'PropsUIPageSplashScreen', [])
}

export interface PropsUIPageDonation {
__type__: 'PropsUIPageDonation'
platform: string
header: PropsUIHeader
body: PropsUIPromptFileInput | PropsUIPromptConfirm | PropsUIPromptConsentForm | PropsUIPromptRadioInput | PropsUIPromptQuestionnaire
footer: PropsUIFooter
footer?: PropsUIFooter
}
export function isPropsUIPageDonation (arg: any): arg is PropsUIPageDonation {
return isInstanceOf<PropsUIPageDonation>(arg, 'PropsUIPageDonation', ['platform', 'header', 'body', 'footer'])
return isInstanceOf<PropsUIPageDonation>(arg, 'PropsUIPageDonation', ['platform', 'header', 'body'])
}

export interface PropsUIPageEnd {
Expand Down
7 changes: 2 additions & 5 deletions src/framework/visualisation/react/factory.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@

import { EndPage } from './ui/pages/end_page'
import { isPropsUIPageEnd, isPropsUIPageDonation, PropsUIPage, isPropsUIPageSplashScreen, isPropsUIPageError } from '../../types/pages'
import { isPropsUIPageEnd, isPropsUIPageDonation, PropsUIPage, isPropsUIPageError } from '../../types/pages'
import { DonationPage } from './ui/pages/donation_page'
import { Payload } from '../../types/commands'
import { SplashScreen } from './ui/pages/splash_screen'

import { ErrorPage } from './ui/pages/error_page'

export interface ReactFactoryContext {
Expand All @@ -13,9 +13,6 @@ export interface ReactFactoryContext {

export default class ReactFactory {
createPage (page: PropsUIPage, context: ReactFactoryContext): JSX.Element {
if (isPropsUIPageSplashScreen(page)) {
return <SplashScreen {...page} {...context} />
}
if (isPropsUIPageEnd(page)) {
return <EndPage {...page} {...context} />
}
Expand Down
32 changes: 14 additions & 18 deletions src/framework/visualisation/react/ui/pages/donation_page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,30 +52,26 @@ export const DonationPage = (props: Props): JSX.Element => {
resolve?.({ __type__: 'PayloadFalse', value: false })
}

const footer: JSX.Element = (
<Footer
middle={<Progress percentage={props.footer.progressPercentage} />}
function renderFooter (props: Props): JSX.Element | undefined {
if (props.footer != null) {
return <Footer
middle={<Progress percentage={props.footer?.progressPercentage ?? 0} />}
right={
<div className='flex flex-row'>
<div className='flex-grow' />
<ForwardButton label={forwardButton} onClick={handleSkip} />
</div>
}
/>
)
} />
} else {
return undefined
}
}

// COMMENT BY NIEK: I TURNED OFF THE SIDEBAR (UGLY)
// const sidebar: JSX.Element = (
// <Sidebar
// logo={LogoSvg}
// content={
// <Instructions platform={platform} locale={locale} />
// }
// />
// )
// COMMENT BY KASPER: MADE SIDEBAR OPTIONAL IN <Page /> COMPONENT,
// SO THAT IT DOESN'T AFFECT THE LAYOUT OF THE PAGE
// const sidebar: JSX.Element = <></>
const footer: JSX.Element | undefined = (
<>
{renderFooter(props)}
</>
)

const body: JSX.Element = (
<>
Expand Down
Loading

0 comments on commit 65f4ccf

Please sign in to comment.