Storybook (React): can't find main.js

I've been facing a problem where a newly created storybook project is not recognising the main.js file when I run yarn storybook. I have used storybook in other projects and not had any issues.

I have a suspicion that it might be to do with the path to the main.js file where there are square brackets used in a directory name. This is a naming convention that fivem uses to organise it's resources.

The image shows my main.js file, the project structure and the error I receive when running yarn storybook.

ERR! Error: No configuration files have been found in your configDir (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\.storybook).
ERR! Storybook needs either a "main" or "config" file.
ERR!     at validateConfigurationFiles (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\utils\validate-configuration-files.js:50:11)
ERR!     at loadCustomPresets (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\utils\load-custom-presets.js:19:62)
ERR!     at loadAllPresets (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\presets.js:310:105)
ERR!     at buildDevStandalone (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-server\dist\cjs\build-dev.js:98:48)
ERR!     at processTicksAndRejections (internal/process/task_queues.js:97:5)
ERR!     at async buildDev (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-server\dist\cjs\build-dev.js:147:5)
ERR!  Error: No configuration files have been found in your configDir (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\.storybook).
ERR! Storybook needs either a "main" or "config" file.
ERR!     at validateConfigurationFiles (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\utils\validate-configuration-files.js:50:11)
ERR!     at loadCustomPresets (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\utils\load-custom-presets.js:19:62)
ERR!     at loadAllPresets (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-common\dist\cjs\presets.js:310:105)
ERR!     at buildDevStandalone (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-server\dist\cjs\build-dev.js:98:48)
ERR!     at processTicksAndRejections (internal/process/task_queues.js:97:5)
ERR!     at async buildDev (C:\Users\adam_\Documents\dev\fivem\fxserver\txData\CFXDefault_943D47.base\resources\[UI]\react-fivem\web\node_modules\@storybook\core-server\dist\cjs\build-dev.js:147:5)

main.js

module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/preset-create-react-app"
  ]
}

Is there something wrong in my project structure that might be causing this?

Thanks in advance