@silexlabs/silex 3.0.0-alpha.39 → 3.0.0-alpha.41

package/src/ts/plugins/HooksPlugin.ts

@@ -0,0 +1,79 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import fetch from 'node-fetch'
+import { ServerConfig } from '../server/config'
+
+type HooksOptions = {
+  gitUrl?: string
+  buildUrl?: string
+}
+
+const rootPath = process.env.DATA_FOLDER
+
+// **********
+throw new Error('TODO: implement hooks plugin')
+const EVENT_ASSET_WRITE_END = 'silex:asset:write:end'
+const EVENT_PUBLISH_END = 'silex:publish:end'
+const EVENT_WRITE_END = 'silex:write:end'
+function projectPath(projectId: string) { return `${rootPath}/${projectId}` }
+// **********
+
+export default async function(config: ServerConfig, opts: HooksOptions = {}) {
+  // Options with defaults
+  const options = {
+    gitUrl: process.env.SILEX_HOOK_GIT,
+    buildUrl: process.env.SILEX_HOOK_BUILD,
+    ...opts
+  }
+  config.on(EVENT_WRITE_END, async ({ res, req, projectId, data }) => {
+    if(options.gitUrl) {
+      await hook(options.gitUrl, {
+        path: projectPath(projectId),
+        message: 'Change from Silex',
+      })
+    }
+  })
+  config.on(EVENT_ASSET_WRITE_END, async ({ res, req, projectId, uploadDir, form, data }) => {
+    if(options.gitUrl) {
+      await hook(options.gitUrl, {
+        path: projectPath(projectId),
+        message: 'Change from Silex',
+      })
+    }
+  })
+  config.on(EVENT_PUBLISH_END, async ({ projectId, files, req, res }) => {
+    if(options.buildUrl) {
+      await hook(options.buildUrl)
+    }
+  })
+}
+
+async function hook(url, params = {}) {
+  if(url) {
+    const urlObj = new URL(url)
+    console.log('Calling hook', {url})
+    try {
+      Object.keys(params)
+        .forEach(key => urlObj.searchParams.append(key, params[key]))
+      return fetch(urlObj.toString())
+    } catch(error) {
+      console.log('Hook call failed', {url, error})
+      return null
+    }
+  }
+}

package/src/ts/plugins/PublicationPlugin.ts

@@ -0,0 +1,170 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import express from 'express'
+import { noCache } from './Cache'
+import { minify } from 'html-minifier'
+import { API_PUBLICATION_PUBLISH, API_PUBLICATION_STATUS } from '../constants'
+import { getJob } from '../server/jobs'
+import { ApiPublicationPublishRequestBody, ApiPublicationPublishRequestQuery, ApiPublicationPublishResponse, ApiPublicationStatusRequestQuery, ApiPublicationStatusResponse, ApiResponseError, JobData, JobId, PublicationSettings, PublicationData as PublicationData, BackendType} from '../types'
+import { HostingProvider, getBackend } from '../server/backends'
+import { ServerConfig } from '../server/config'
+import { requiredParam } from '../server/utils/validation'
+import { EVENT_STARTUP_START } from '../events'
+
+/**
+ * @fileoverview Publication plugin for Silex
+ * Adds a publication API to Silex server
+ */
+
+const defaultPublication: PublicationSettings = {
+  url: '',
+  autoHomePage: true,
+  assets: { path: 'assets', url: '/assets' },
+  html: { path: '' },
+  css: { path: 'css', url: '/css' },
+}
+
+/**
+ * Error thrown by the publication API
+ * @param message error message
+ * @param code http status code
+ */
+export class PublicationError extends Error {
+  constructor(message: string, public code: number) {
+    super(message)
+  }
+}
+
+/**
+ * Get the desired backend
+ * Can be the default backend or a specific one
+ */
+export async function getHostingProvider(session: any, config: ServerConfig, backendId?: string): Promise<HostingProvider> {
+  const hostingProvider = await getBackend(config, session, BackendType.HOSTING, backendId) //  ?? config.getHostingProviders()[0]
+
+  if (!hostingProvider) {
+    throw new PublicationError('No hosting provider found', 404)
+  }
+
+  if (!await hostingProvider.isLoggedIn(session)) {
+    throw new PublicationError('Not logged in', 401)
+  }
+
+  return hostingProvider as HostingProvider
+}
+
+export default async function(config: ServerConfig, opts = {}) {
+  const options = {
+    // Defaults
+    statusUrl: process.env.SILEX_PUBLICATION_STATUS_URL,
+    backend: 'src/plugins/DefaultBackend.js',
+    // Options
+    ...opts,
+  }
+
+  config.on(EVENT_STARTUP_START, ({app}) => {
+    const router = express.Router()
+
+    // Get publication status
+    router.get(`/${API_PUBLICATION_STATUS}`, async function (req, res) {
+      const query: ApiPublicationStatusRequestQuery = req.query as any
+      const jobId: JobId = query.jobId as string
+      const job = jobId && getJob(jobId)
+      if (!job) {
+        console.error(`Error: job not found with id ${jobId}`)
+        res.status(404).json({
+          message: 'Error: job not found.',
+        } as ApiResponseError)
+        return
+      }
+      res.json({
+        ...job,
+        _timeout: undefined,
+      } as ApiPublicationStatusResponse)
+    })
+
+    // Publish website
+    router.post(`/${API_PUBLICATION_PUBLISH}`, async function (req, res) {
+      try {
+        const query: ApiPublicationPublishRequestQuery = req.query as any
+        const body: ApiPublicationPublishRequestBody = req.body
+        const id = requiredParam<string>(query.id as string, 'id in query')
+        const session = requiredParam(req['session'], 'session on express request')
+
+        // Check params
+        const { files, publication } = body as PublicationData
+        const publicationSettings: PublicationSettings = {
+          ...defaultPublication,
+          ...publication,
+        }
+        const backend = requiredParam(publicationSettings.backend, 'backend object in publicationSettings')
+        const backendId = requiredParam(backend.backendId, 'backendId in publicationSettings')
+        if (!files) throw new PublicationError('Error in the request, files not found', 400)
+
+        // Get hosting provider and make sure the user is logged in
+        const hostingProvider = await getHostingProvider(session, config, backendId)
+        if (!hostingProvider) throw new PublicationError('Error in the request, hosting provider not found', 400)
+        if (!hostingProvider.isLoggedIn(session)) throw new PublicationError(`You must be logged in with ${hostingProvider.displayName} to publish`, 401)
+
+        // Optim HTML
+        files.map(file => ({
+          ...file,
+          html: minify(file.html, {
+            continueOnParseError: true,
+            collapseInlineTagWhitespace: true,
+            collapseWhitespace: true,
+            minifyCSS: true,
+            minifyJS: true,
+            removeScriptTypeAttributes: true,
+            removeStyleLinkTypeAttributes: true,
+          }).trim(),
+        }))
+        // Publication
+        const filesList = files.flatMap(file => ([{
+          path: file.htmlPath,
+          content: file.html,
+        }, {
+          path: file.cssPath,
+          content: file.css,
+        }]))
+        try {
+          res.json({
+            url: await hostingProvider.getWebsiteUrl(session, id),
+            job: await hostingProvider.publish(session, id, backend, filesList),
+          } as ApiPublicationPublishResponse)
+        } catch (err) {
+          console.error('Error publishing the website', err)
+          res.status(500).json({
+            message: `Error publishing the website. ${err.message}`
+          } as ApiResponseError)
+          return
+        }
+      } catch (err) {
+        console.error('Error publishing the website', err)
+        res
+          .status(err.code ?? 500)
+          .json({
+            message: `Error publishing the website. ${err.message}`
+          } as ApiResponseError)
+        return
+      }
+    })
+
+    app.use(noCache,  router)
+  })
+}

package/src/{plugins/SslPlugin.js → ts/plugins/SslPlugin.ts}

@@ -1,7 +1,25 @@
-const express = require('express')
-const { readFileSync } = require('fs')
-const { createServer } = require('https')
-const fromorceSSL = require('express-force-ssl')
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import express from 'express'
+import { readFileSync } from 'fs'
+import { createServer } from 'https'
+import forceSSL from 'express-force-ssl'
+import { EVENT_STARTUP_START } from '../events'
 
 // interface SslOptions {
 //   forceHttps?: boolean
@@ -11,7 +29,7 @@ const fromorceSSL = require('express-force-ssl')
 //   sslPort?: string
 // }
 
-module.exports = async function(config, opts = {}) {
+export default async function(config, opts = {}) {
   // Options with defaults
   const options = {
     forceHttps: process.env.SILEX_FORCE_HTTPS === 'true',
@@ -23,7 +41,7 @@ module.exports = async function(config, opts = {}) {
   }
 
   // Add routes on silex startup
-  config.on('silex:startup:start', ({app}) => {
+  config.on(EVENT_STARTUP_START, ({app}) => {
     const router = express.Router()
 
     // SSL

package/src/ts/plugins/StaticPlugin.ts

@@ -0,0 +1,68 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import express from 'express'
+import nodeModules from 'node_modules-path'
+import serveStatic from 'serve-static'
+import { withCache } from './Cache'
+import { join } from 'path'
+import { EVENT_STARTUP_START } from '../events'
+
+type StaticOptions = {
+  routes: {
+    path: string
+    route: string
+  }[]
+}
+
+export default async function(config, opts = {}) {
+  // Options with defaults
+  const options: StaticOptions = {
+    routes: [
+      {
+        route: '/',
+        path: 'public',
+      }, {
+        route: '/css/',
+        path: nodeModules('@fortawesome/fontawesome-free') + '/@fortawesome/fontawesome-free/css/',
+      }, {
+        route: '/webfonts/',
+        path: nodeModules('@fortawesome/fontawesome-free') + '/@fortawesome/fontawesome-free/webfonts/',
+      }, {
+        route: '/',
+        path: 'dist/client',
+      },
+    ]
+    // add project route for source maps
+      .concat(config.debug ? [{
+        route: '/',
+        path: './',
+      }] : []),
+    ...opts,
+  }
+
+  config.on(EVENT_STARTUP_START, ({app}) => {
+    const router = express.Router()
+    options.routes
+      .forEach(folder => {
+        if (!folder.route) throw new Error('The config for static module has no `route` attribute')
+        if (!folder.path) throw new Error('The config for static module has no `path` attribute')
+        router.use(folder.route, serveStatic(folder.path))
+      })
+    app.use(withCache,  router)
+  })
+}

package/src/ts/plugins/WebsitePlugin.ts

@@ -0,0 +1,318 @@
+/*
+ * Silex website builder, free/libre no-code tool for makers.
+ * Copyright (c) 2023 lexoyo and Silex Labs foundation
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { Router } from 'express'
+import formidable, { File as FormidableFile } from 'formidable'
+import { noCache } from './Cache'
+import { API_WEBSITE_ASSETS_READ, API_WEBSITE_ASSETS_WRITE, API_WEBSITE_READ, API_WEBSITE_WRITE, API_WEBSITE_DELETE, WEBSITE_DATA_FILE_NAME } from '../constants'
+import { createReadStream } from 'fs'
+import { ApiResponseError, ApiWebsiteAssetsReadRequestParams, ApiWebsiteAssetsReadRequestQuery, ApiWebsiteAssetsReadResponse, ApiWebsiteAssetsWriteRequestQuery, ApiWebsiteAssetsWriteResponse, ApiWebsiteDeleteRequestQuery, ApiWebsiteReadRequestQuery, ApiWebsiteReadResponse, ApiWebsiteWriteRequestBody, ApiWebsiteWriteRequestQuery, ApiWebsiteWriteResponse, BackendId, BackendType, WebsiteMeta, WebsiteData, WebsiteId } from '../types'
+import { File, StorageProvider, getBackend } from '../server/backends'
+import { Readable } from 'stream'
+import { requiredParam } from '../server/utils/validation'
+import { basename } from 'path'
+import { EVENT_STARTUP_START } from '../events'
+
+/**
+ * @fileoverview Website plugin for Silex
+ * This plugin provides the website API to Silex server
+ */
+
+/**
+ * Error thrown by the website API
+ * @param message error message
+ * @param code http status code
+ */
+export class WebsiteError extends Error {
+  constructor(message: string, public code: number) {
+    super(message)
+  }
+}
+
+export default async function(config, opts = {}) {
+  // Options with defaults
+  const options = {
+    // Default constants
+    assetsPath: '/assets',
+    // Options
+    ...opts
+  }
+
+  config.on(EVENT_STARTUP_START, ({app}) => {
+    // Create a new router
+    const router = Router()
+    app.use(noCache,  router)
+
+    // Load website data
+    router.get(`/${API_WEBSITE_READ}`, async (req, res) => {
+      const query: ApiWebsiteReadRequestQuery = req.query
+      const { id, backendId } = query
+      try {
+        if(id) {
+          // Get website data
+          const websiteData: WebsiteData | Readable = await readWebsite(
+            req['session'],
+            requiredParam(id, 'Website id'),
+            backendId as string | undefined,
+          )
+          if (websiteData instanceof Readable) {
+            websiteData.pipe(res.type('application/json'))
+          } else {
+            res.json(websiteData as ApiWebsiteReadResponse)
+          }
+        } else {
+          // List websites
+          const websites = await listWebsites(req['session'], query.backendId as string | undefined)
+          res.json(websites as ApiWebsiteReadResponse)
+        }
+      } catch(e) {
+        console.error('Error getting website data', e)
+        if(e instanceof WebsiteError) {
+          res.status(e.code).json({ message: e.message } as ApiResponseError)
+        } else {
+          res.status(500).json({ message: e.message } as ApiResponseError)
+        }
+      }
+    })
+
+    // Save website data
+    router.post(`/${API_WEBSITE_WRITE}`, async (req, res) => {
+      try {
+        const query: ApiWebsiteWriteRequestQuery = req.query as any
+        const body: ApiWebsiteWriteRequestBody = req.body
+        const id = requiredParam<WebsiteId>(query.id, 'Website id')
+        const websiteData = requiredParam<WebsiteData>(body, 'Website data') as WebsiteData
+        await writeWebsite(
+          req['session'],
+          id,
+          websiteData,
+          query.backendId,
+        )
+        res.status(200).json({ message: 'Website saved' } as ApiResponseError)
+      } catch(e) {
+        console.error('Error saving website data', e)
+        if(e instanceof WebsiteError) {
+          res.status(e.code).json({ message: e.message } as ApiResponseError)
+        } else {
+          res.status(500).json({ message: e.message } as ApiResponseError)
+        }
+      }
+    })
+
+    // Delete website
+    router.delete(`/${API_WEBSITE_DELETE}`, async (req, res) => {
+      try {
+        const query: ApiWebsiteDeleteRequestQuery = req.query as any
+        const id = requiredParam<WebsiteId>(query.id, 'Website id')
+        await deleteWebsite(req['session'], id, query.backendId)
+        res.status(200).json({ message: 'Website deleted' } as ApiResponseError)
+      } catch(e) {
+        console.error('Error deleting website data', e)
+        if(e instanceof WebsiteError) {
+          res.status(e.code).json({ message: e.message } as ApiResponseError)
+        } else {
+          res.status(500).json({ message: e.message } as ApiResponseError)
+        }
+      }
+    })
+
+    // Load assets
+    router.get(`/${API_WEBSITE_ASSETS_READ}`, async (req, res) => {{
+      try {
+        const query: ApiWebsiteAssetsReadRequestQuery = req.query as any
+        const params: ApiWebsiteAssetsReadRequestParams = req.params as any
+        const id = requiredParam<WebsiteId>(query.id, 'Website id')
+        const path = requiredParam<string>(params.path, 'path')
+        const asset: File = await readAsset(req['session'], id, path, query.backendId)
+        // Set content type
+        res.contentType(basename(asset.path))
+        // Send the file
+        if(asset.content instanceof Readable) {
+          // Stream
+          asset.content.pipe(res)
+        } else {
+          // Buffer or string
+          res.send(asset.content as ApiWebsiteAssetsReadResponse)
+        }
+      } catch(e) {
+        console.error('Error getting asset', e)
+        if(e instanceof WebsiteError) {
+          res.status(e.code).json({ message: e.message } as ApiResponseError)
+        } else {
+          res.status(500).json({ message: e.message } as ApiResponseError)
+        }
+      }
+    }})
+
+    // Upload assets
+    router.post(`/${API_WEBSITE_ASSETS_WRITE}`, async (req, res) => {
+      try {
+        const query: ApiWebsiteAssetsWriteRequestQuery = req.query as any
+        const id = requiredParam<WebsiteId>(query.id as WebsiteId, 'Website id')
+
+        // Get the file data from the request
+        const form = formidable({
+          filename: (name, ext, part, _form) => `${name}${ext}`,
+          multiples: true,
+          keepExtensions: true,
+        })
+        const files: File[] = await new Promise<File[]>((resolve, reject) => {
+          form.parse(req, async (err, fields, _files) => {
+            if (err) {
+              console.error('Error parsing upload data', err)
+              reject(new WebsiteError('Error parsing upload data: ' + err.message, 400))
+            } else {
+              const files = [].concat(_files['files[]'])
+                .map((file: FormidableFile) => ({
+                  path: `${options.assetsPath}/${file.originalFilename}`,
+                  content: createReadStream(file.filepath),
+                }))
+              resolve(files)
+            }
+          })
+        })
+
+        // Write the files
+        console.log('Uploading assets', files)
+        const data = await writeAssets(req['session'], id, files, query.backendId)
+        console.log('Uploaded assets', data)
+
+        // Return the file URLs to insert in the website
+        res.json({
+          data, // As expected by grapesjs (https://grapesjs.com/docs/modules/Assets.html#uploading-assets)
+        } as ApiWebsiteAssetsWriteResponse)
+
+      } catch(e) {
+        console.error('Error uploading assets', e)
+        if(e instanceof WebsiteError) {
+          res.status(e.code).json({ message: e.message } as ApiResponseError)
+        } else {
+          res.status(500).json({ message: e.message } as ApiResponseError)
+        }
+      }
+    })
+  })
+
+  /**
+   * Get the desired backend
+   * Can be the default backend or a specific one
+   */
+  async function getStorageProvider(session: any, backendId?: string): Promise<StorageProvider> {
+    const storageProvider = await getBackend(config, session, BackendType.STORAGE, backendId) //  ?? config.getStorageProviders()[0]
+
+    if(!storageProvider) {
+      throw new WebsiteError('No storage provider found', 404)
+    }
+
+    if(!await storageProvider.isLoggedIn(session)) {
+      throw new WebsiteError('Not logged in', 401)
+    }
+
+    return storageProvider as StorageProvider
+  }
+
+  /**
+   * Website a website data or list all websites
+   */
+  async function readWebsite(session: any, id: string, backendId?: string): Promise<WebsiteData | Readable> {
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // List websites or get a website
+    // Get a website data
+    const file = await storageProvider.readFile(session, id, WEBSITE_DATA_FILE_NAME)
+    if(typeof file.content === 'string') return JSON.parse(file.content)
+    else if(file.content instanceof Buffer) return JSON.parse(file.content.toString())
+    else if(file.content instanceof Readable) return file.content
+    throw new WebsiteError('Invalid website data', 500)
+  }
+
+  /**
+   * List existing websites
+   */
+  async function listWebsites(session: any, backendId?: string): Promise<WebsiteMeta[]> {
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // List websites
+    return storageProvider.listWebsites(session)
+  }
+
+  /**
+   * Write the website data to the backend
+   */
+  async function writeWebsite(session: any, id: WebsiteId, websiteData: WebsiteData, backendId?: BackendId): Promise<void> {
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // Init the storage for this website (create the folder if it does not exist)
+    // FIXME: put this after login
+    // await storageProvider.init(session, id)
+
+    // Write the website data
+    await storageProvider.writeFiles(session, id, [{
+      path: WEBSITE_DATA_FILE_NAME,
+      content: JSON.stringify(websiteData),
+    }])
+  }
+
+  /**
+   * Delete a website
+   */
+  async function deleteWebsite(session: any, id: string, backendId?: string) {
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // Delete the website
+    return await storageProvider.deleteDir(session, id, '/')
+  }
+
+  /**
+   * Read an asset
+   */
+  async function readAsset(session: any, id: string, fileName: string, backendId?: string): Promise<File> {
+    //const { session } = req
+    //const id = req.query.id
+    //const fileName = req.params[0]
+    //const uploadDir = await assetsDir(id)
+    //res.sendFile(`${uploadDir}/${fileName}`)
+
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // Read the asset from the backend
+    return await storageProvider.readFile(session, id, `/${options.assetsPath}/${fileName}`)
+  }
+
+  /**
+   * Write an asset to the backend
+   */
+  async function writeAssets(session: any, id: string, files: File[], backendId?: string): Promise<string[]> {
+    // Get the desired backend
+    const storageProvider = await getStorageProvider(session, backendId)
+
+    // Write the asset to the backend
+    await storageProvider.writeFiles(
+      session,
+      id,
+      files
+    )
+
+    // Return the files URLs with the website id
+    return files.map(({ path }) => `${path}?id=${id}`)
+  }
+}