WDIO/Allure Report - Attaching a screenshot to a step Node. How to?

Question

In the code shown below a screenshot is attached to the parent node. Is it possible to attach the screenshot to the child node?

   async appendToReport2(stepDescription: string, passFailStatus: boolean): Promise<void> {
    // Capture a screenshot and save it as a Buffer
   let screenshotBuffer = Buffer.from(await browser.takeScreenshot(), 'base64'); // Convert to Buffer
    allureReporter.startStep(stepDescription)
    {
        await allureReporter.step('Before click', async () => {
            console.log("----Inside Before click")
        })
        await allureReporter.step('Inside After click', async () => {
            console.log("----Inside Step")
        })
    }
    allureReporter.endStep()
}

• Seeking: To attach the screenshot to the step 'Before click'
• Question: let screenshotBuffer = Buffer.from(await browser.takeScreenshot(), 'base64') adds the screenshot to the parent node. Note: There's no addAttachment() method called in the code snippet. Is this a default AllureReport behavior?

Update: Here is the code snippet that does what I was seeking.

  async appendToReport2(stepDescription: string, passFailStatus: boolean): Promise<void> {
        const sanitizeStepDescription = stepDescription.replace(/ /g, ''); // Remove spaces
        const timestamp = new Date().toISOString().replace(/[:.]/g, ''); // Generate a timestamp without special characters
        const screenshotFileName = `${sanitizeStepDescription}_${timestamp}.png`;

        await allureReporter.step(stepDescription, async (s1) => {
            await s1.step('Before click', async () => {
                const screenshotPath = `./reports/ui/allure-results/${screenshotFileName}`;
                s1.attach(await browser.saveScreenshot(screenshotPath), 'image/png');
            });
        });[![enter image description here][1]][1]
    }