first version

.github/workflows/upload-draft.yml

@@ -0,0 +1,22 @@
+name: Upload draft
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  upload-draft:
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          # Make sure the actual branch is checked out when running on pull requests
+          ref: ${{ github.head_ref }}
+
+      - name: Upload Quest
+        uses: trywilco/uploadQuestAction@main
+        with:
+          quest-editor-user-token: ${{ secrets.QUESTS_EDITOR_TOKEN }}
+          quest-editor-user-email: [email protected]

quest.yml

@@ -0,0 +1,30 @@
+id: tooljet_audio_transcriber
+title: Build an Audio Transcriber with ToolJet
+subtitle: Create an audio transcriber using ToolJet & OpenAI
+description: >-
+  Unleash your inner maker as you build a functional and powerful audio
+  transcriber and analyzer using ToolJet and OpenAI.
+
+  In this quest, you’ll follow a guided process to set up a no-code ToolJet application, integrate OpenAI for transcription, and enhance the app with analytical capabilities.
+
+  You'll learn the essentials of ToolJet's visual app builder, how to connect APIs like OpenAI, and ways to process audio input for meaningful insights.
+
+  By the end of this quest, you'll have your own custom-built audio transcriber and analyzer, ready to transform audio content into actionable data. Let’s get building!
+level: intermediate
+duration: 0.75
+skills:
+  - No-code development
+  - API integration
+  - OpenAI API usage
+  - Audio processing
+  - Application design
+steps:
+  - introduction_tooljet_openai
+  - getting_started_tooljet
+  - setting_up_app
+  - integrating_openai
+  - upload_audio_files
+  - quiz_test_transcription
+  - reflect_on_learning
+type: MODULE
+repository: null

steps/getting_started_tooljet.yml

@@ -0,0 +1,27 @@
+id: getting_started_tooljet
+learningObjectives:
+  - Familiarize yourself with the ToolJet platform and its interface.
+hints:
+  - Check out ToolJet's documentation [here](https://docs.tooljet.com).
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: ToolJet is a no-code development platform where you can drag and drop
+              components to build applications.
+          - text: Let’s start by visiting the [ToolJet dashboard](https://tooljet.com/).
+          - text: ToolJet’s key features include a visual builder, integrations with popular
+              APIs, and deployment tools. You can explore these features
+              in-depth [here](https://docs.tooljet.com/docs/components).
+          - text: Take a moment to explore the interface. Notice how easy it is to navigate
+              and find what you need.
+    - actionId: ready_message
+      params:
+        person: lucca
+trigger:
+  type: user_ready_response
+  flowNode:
+    do:
+      - actionId: finish_step

steps/integrating_openai.yml

@@ -0,0 +1,29 @@
+id: integrating_openai
+learningObjectives:
+  - Understand how to connect and use OpenAI APIs for transcription.
+hints:
+  - Learn more about OpenAI APIs [here](https://platform.openai.com/docs/).
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: Now, let’s integrate OpenAI. First, make sure you have an [OpenAI
+              account](https://platform.openai.com/signup/) and API key.
+          - text: In ToolJet, navigate to the API integrations section and add a new API.
+              You can learn how to configure APIs in ToolJet
+              [here](https://docs.tooljet.com/docs/apis).
+          - text: Enter the OpenAI endpoint URL from their [API
+              documentation](https://platform.openai.com/docs/api-reference/audio)
+              and paste your API key into the headers section.
+          - text: This will allow ToolJet to make calls to OpenAI’s transcription service.
+              Let’s configure it step-by-step.
+    - actionId: ready_message
+      params:
+        person: lucca
+trigger:
+  type: user_ready_response
+  flowNode:
+    do:
+      - actionId: finish_step

steps/introduction_tooljet_openai.yml

@@ -0,0 +1,34 @@
+id: introduction_tooljet_openai
+learningObjectives:
+  - Learn about ToolJet and OpenAI and their capabilities.
+hints: []
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text:
+              Welcome to the quest! Today, we’ll explore how to build a no-code audio
+              transcriber and analyzer using [ToolJet](https://tooljet.com/) and
+              [OpenAI](https://platform.openai.com/docs/).
+          - text:
+              ToolJet is a fantastic no-code platform that lets you visually create apps
+              without writing much code. Check out ToolJet’s overview
+              [here](https://docs.tooljet.com/docs/overview).
+          - text:
+              OpenAI, on the other hand, provides powerful APIs for natural language
+              processing and transcription. Learn about OpenAI’s transcription
+              capabilities
+              [here](https://platform.openai.com/docs/api-reference/audio).
+          - text:
+              By combining these tools, you’ll create an app that turns audio into
+              actionable insights. Ready to dive in?
+    - actionId: ready_message
+      params:
+        person: lucca
+trigger:
+  type: user_ready_response
+  flowNode:
+    do:
+      - actionId: finish_step

steps/quiz_test_transcription.yml

@@ -0,0 +1,56 @@
+id: quiz_test_transcription
+learningObjectives:
+  - Ensure that the transcriber works as expected.
+hints:
+  - Think about how the file upload interacts with OpenAI.
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: What step triggers the transcription process in the app?
+    - actionId: quiz_message
+      name: quiz
+      params:
+        person: lucca
+        options:
+          - File upload triggers the transcription workflow.
+          - API key input starts transcription.
+          - User clicks a transcription button.
+trigger:
+  type: chat_form_submitted
+  flowNode:
+    switch:
+      key: ${formSubmission}
+      cases:
+        A:
+          do:
+            - actionId: bot_message
+              params:
+                person: lucca
+                messages:
+                  - text: Correct! The file upload component starts the transcription process. Great
+                      job!
+            - actionId: finish_step
+        B:
+          do:
+            - actionId: bot_message
+              params:
+                person: lucca
+                messages:
+                  - text: Not quite. The API key enables the connection but doesn’t start
+                      transcription.
+            - actionId: replay_action
+              params:
+                actionName: quiz
+        C:
+          do:
+            - actionId: bot_message
+              params:
+                person: lucca
+                messages:
+                  - text: Close, but we configured it to trigger after file upload.
+            - actionId: replay_action
+              params:
+                actionName: quiz

steps/reflect_on_learning.yml

@@ -0,0 +1,98 @@
+id: reflect_on_learning
+learningObjectives:
+  - Encourage users to reflect on their learning experience.
+hints:
+  - Consider the parts where you needed to troubleshoot or configure settings.
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: What was the most challenging part of building this app, and how did you
+              overcome it?
+trigger:
+  type: user_message
+  params:
+    person: lucca
+  flowNode:
+    do:
+      - actionId: parse_user_response
+        name: user_answer
+        params:
+          prompt: "
+
+            \  Please evaluate the user's answer in relation to the
+            expected answer: Responses may include challenges with API
+            integration, file uploads, or UI design..
+
+            \  # Assessment Criteria
+
+            \  - Determine if the user's response demonstrates a
+            clear understanding of the key concepts and ideas presented in the
+            expected answer.
+
+            \  - Consider synonyms, paraphrasing, and different
+            phrasing that convey the same meaning.
+
+            \  - Be flexible and focus on the essence of the answer
+            rather than exact wording.
+
+
+            \  # Response Guidelines:
+
+            \  - If the user's answer is correct or shows sufficient
+            understanding, return 'correct: true'.
+
+            \    - Provide a positive and affirming message,
+            congratulating them and reinforcing their understanding.
+
+            \  - If the user's answer is incorrect or incomplete,
+            return 'correct: false'.
+
+            \    - Gently explain why the answer is not fully
+            correct or what may be missing.
+
+            \    - Encourage them to try again, being empathetic and
+            supportive.
+
+
+            \  # Tone and Style:
+
+            \  - Use friendly and encouraging language.
+
+            \  - Be empathetic to the user's learning process.
+
+            \  - Focus on helping the user learn and understand the
+            material.
+
+            \            "
+          schema:
+            correct: boolean
+            reply: string
+    if:
+      conditions:
+        - conditionId: is_truthy
+          params:
+            value: ${outputs.user_answer.value.correct}
+      then:
+        do:
+          - actionId: bot_message
+            params:
+              person: lucca
+              messages:
+                - text: ${outputs.user_answer.value.reply}
+          - actionId: bot_message
+            params:
+              person: lucca
+              messages:
+                - text: Awesome work on completing this quest! Reflect on what you’ve learned and
+                    think about where you can take these skills next.
+          - actionId: finish_step
+      else:
+        do:
+          - actionId: bot_message
+            params:
+              person: lucca
+              messages:
+                - text: ${outputs.user_answer.value.reply}

steps/setting_up_app.yml

@@ -0,0 +1,27 @@
+id: setting_up_app
+learningObjectives:
+  - Learn how to set up your ToolJet application for the project.
+hints:
+  - Refer to the getting started guide in ToolJet’s docs for tips
+    [here](https://docs.tooljet.com/docs/getting-started).
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: Time to create your app! Click on the 'Create App' button on the [ToolJet
+              dashboard](https://tooljet.com/).
+          - text: Name your app something meaningful, like 'Audio Transcriber'.
+          - text: Once your app is created, you’ll see the visual builder where you can add
+              components and configure settings.
+          - text: For now, just get familiar with this space. We’ll start adding
+              functionality soon.
+    - actionId: ready_message
+      params:
+        person: lucca
+trigger:
+  type: user_ready_response
+  flowNode:
+    do:
+      - actionId: finish_step

steps/upload_audio_files.yml

@@ -0,0 +1,27 @@
+id: upload_audio_files
+learningObjectives:
+  - Learn how to enable file uploads and process audio inputs.
+hints:
+  - ToolJet’s file upload documentation can help you
+    [here](https://docs.tooljet.com/docs/components/file-upload).
+startFlow:
+  do:
+    - actionId: bot_message
+      params:
+        person: lucca
+        messages:
+          - text: To handle audio files, we’ll use ToolJet’s file upload component.
+          - text: Drag the upload widget into your app layout and configure it to accept
+              audio file types like .mp3 or .wav. Instructions can be found
+              [here](https://docs.tooljet.com/docs/components/file-upload).
+          - text: When a file is uploaded, ToolJet will trigger the configured workflow,
+              sending the file to OpenAI for transcription.
+          - text: Test the upload feature to ensure it works smoothly.
+    - actionId: ready_message
+      params:
+        person: lucca
+trigger:
+  type: user_ready_response
+  flowNode:
+    do:
+      - actionId: finish_step