This commit is contained in:
Martin McKeaveney 2020-09-17 16:36:39 +01:00
parent 9032738ae8
commit bb2058a010
14 changed files with 97 additions and 82 deletions

View File

@ -77,7 +77,6 @@
"mustache": "^4.0.1",
"posthog-js": "1.3.1",
"shortid": "^2.2.15",
"svelte-filepond": "^0.0.1",
"svelte-loading-spinners": "^0.1.1",
"svelte-portal": "^0.1.0",
"svelte-simple-modal": "^0.4.2",

View File

@ -36,9 +36,12 @@
}
async function removeFile() {
const response = await api.delete(`/api/attachments/${selectedImage.fileName}`)
const response = await api.delete(
`/api/attachments/${selectedImage.fileName}`
)
files.splice(selectedImageIdx, 1)
files = files
selectedImageIdx = 0
}
function navigateLeft() {

View File

@ -7,17 +7,17 @@
</script>
<div class="file-list">
{#each files as file}
<div class="file">
{#if FILE_TYPES.IMAGE.includes(file.extension)}
<img {width} {height} src={file.clientUrl} />
{:else}
<i class="ri-file-line" />
<span class="extension">.{file.extension}</span>
<span>{file.name}</span>
{/if}
</div>
{/each}
{#each files as file}
<div class="file">
{#if FILE_TYPES.IMAGE.includes(file.extension)}
<img {width} {height} src={file.clientUrl} />
{:else}
<i class="ri-file-line" />
<span class="extension">.{file.extension}</span>
<span>{file.name}</span>
{/if}
</div>
{/each}
</div>
<style>

View File

@ -37,7 +37,7 @@
backendUiStore.update(state => {
state.selectedView = state.selectedView
onClosed()
notifier.success("Record created successfully.")
notifier.success("Record saved successfully.")
return state
})
}

View File

@ -4,6 +4,7 @@
export let meta
export let value = meta.type === "boolean" ? false : ""
export let saveRecord
let isSelect =
meta.type === "string" &&
@ -24,7 +25,6 @@
}
const handleInput = event => {
console.log(event.target.value)
if (event.target.type === "checkbox") {
value = event.target.checked
return
@ -35,12 +35,6 @@
return
}
// if (event.target.type === "file") {
// value = Array.from(event.target.files).map(file => file.path)
// console.log(value)
// return
// }
value = event.target.value
}
</script>

View File

@ -74,5 +74,5 @@ export const FIELDS = {
export const FILE_TYPES = {
IMAGE: ["png", "tiff", "gif", "raw", "jpg", "jpeg"],
CODE: ["js", "rs", "py", "java", "rb", "hs", "yml"],
DOCUMENT: ["odf", "docx", "doc", "pdf", "csv"]
DOCUMENT: ["odf", "docx", "doc", "pdf", "csv"],
}

View File

@ -53,7 +53,9 @@
</Button>
{/if}
</div>
<img src="/_builder/assets/deploy-rocket.jpg" alt="Rocket flying through sky"/>
<img
src="/_builder/assets/deploy-rocket.jpg"
alt="Rocket flying through sky" />
</section>
<style>

View File

@ -110,7 +110,7 @@ exports.uploadAppAssets = async function({
filePath,
s3Key: filePath.replace(appAssetsPath, `assets/${appId}`),
s3,
metadata: { accountId }
metadata: { accountId },
})
uploads.push(appAssetUpload)
})
@ -123,20 +123,20 @@ exports.uploadAppAssets = async function({
for (let file of fileUploads.uploads) {
if (file.uploaded) continue
const attachmentUpload = prepareUploadForS3({
filePath: file.path,
s3Key: `assets/${appId}/attachments/${file.name}`,
s3,
metadata: { accountId }
})
const attachmentUpload = prepareUploadForS3({
filePath: file.path,
s3Key: `assets/${appId}/attachments/${file.name}`,
s3,
metadata: { accountId },
})
uploads.push(attachmentUpload)
uploads.push(attachmentUpload)
// mark file as uploaded
file.uploaded = true
// mark file as uploaded
file.uploaded = true
}
db.put(fileUploads);
db.put(fileUploads)
}
try {

View File

@ -1,20 +1,21 @@
const send = require("koa-send")
const { resolve, join } = require("path")
const {
budibaseAppsDir,
budibaseTempDir,
} = require("../../../utilities/budibaseDir")
const CouchDB = require("../../../db")
const setBuilderToken = require("../../../utilities/builder/setBuilderToken")
const { ANON_LEVEL_ID } = require("../../../utilities/accessLevels")
const jwt = require("jsonwebtoken")
const fetch = require("node-fetch")
const fileProcessor = require("./fileProcessor")
const fs = require("fs")
const uuid = require("uuid")
const {
budibaseAppsDir,
budibaseTempDir,
} = require("../../utilities/budibaseDir")
const CouchDB = require("../../db")
const setBuilderToken = require("../../utilities/builder/setBuilderToken")
const { ANON_LEVEL_ID } = require("../../utilities/accessLevels")
const fileProcessor = require("../../utilities/fileProcessor")
exports.serveBuilder = async function(ctx) {
let builderPath = resolve(__dirname, "../../../../builder")
let builderPath = resolve(__dirname, "../../../builder")
if (ctx.file === "index.html") {
setBuilderToken(ctx)
}
@ -23,13 +24,14 @@ exports.serveBuilder = async function(ctx) {
exports.deleteLocalFileUpload = async function(ctx) {
try {
const db = new CouchDB(ctx.user.instanceId);
const db = new CouchDB(ctx.user.instanceId)
let fileUploads = await db.get("_local/fileuploads")
fileUploads.uploads = fileUploads.uploads.filter(upload => upload.fileName !== ctx.fileName)
// TODO: possibly remove the file as well
await db.put(fileUploads);
fileUploads.uploads = fileUploads.uploads.filter(
upload => upload.fileName !== ctx.params.fileName
)
await db.put(fileUploads)
ctx.body = {
message: `${ctx.fileName} deleted.`
message: `${ctx.fileName} deleted.`,
}
} catch (err) {
ctx.throw(500, err)
@ -39,10 +41,15 @@ exports.deleteLocalFileUpload = async function(ctx) {
exports.processLocalFileUpload = async function(ctx) {
const { files } = ctx.request.body
const attachmentsPath = resolve(budibaseAppsDir(), ctx.user.appId, "attachments")
const attachmentsPath = resolve(
budibaseAppsDir(),
ctx.user.appId,
"attachments"
)
// create attachments dir if it doesnt exist
!fs.existsSync(attachmentsPath) && fs.mkdirSync(attachmentsPath, { recursive: true })
!fs.existsSync(attachmentsPath) &&
fs.mkdirSync(attachmentsPath, { recursive: true })
const filesToProcess = files.map(file => {
const fileExtension = [...file.path.split(".")].pop()
@ -55,35 +62,37 @@ exports.processLocalFileUpload = async function(ctx) {
extension: fileExtension,
outputPath: join(attachmentsPath, fileName),
clientUrl: join("/attachments", fileName),
// productionUrl: `https://cdn.app.budi.live/assets/${appId}/attachments/${fileName}`
}
})
// TODO: read the file (into memory first, then we will stream it)
const fileProcessOperations = filesToProcess.map(file => fileProcessor.process(file))
const fileProcessOperations = filesToProcess.map(file =>
fileProcessor.process(file)
)
try {
// TODO: get file sizes of images after resize
const responses = await Promise.all(fileProcessOperations);
const responses = await Promise.all(fileProcessOperations)
let fileUploads
let pendingFileUploads
// local document used to track which files need to be uploaded
// db.get throws an error if the document doesn't exist
// need to use a promise to default
const db = new CouchDB(ctx.user.instanceId);
await db.get("_local/fileuploads")
.then(data => fileUploads = data)
.catch(() => fileUploads = {
_id: "_local/fileuploads",
uploads: []
const db = new CouchDB(ctx.user.instanceId)
await db
.get("_local/fileuploads")
.then(data => {
pendingFileUploads = data
})
.catch(() => {
pendingFileUploads = { _id: "_local/fileuploads", uploads: [] }
})
fileUploads.uploads = [...filesToProcess, ...fileUploads.uploads]
fileUploads.uploads = [...filesToProcess, ...pendingFileUploads.uploads]
await db.put(fileUploads)
ctx.body = filesToProcess
} catch (err) {
ctx.throw(500, err);
ctx.throw(500, err)
}
}
@ -133,13 +142,13 @@ exports.serveApp = async function(ctx) {
}
exports.serveAttachment = async function(ctx) {
const appId = ctx.user.appId;
const appId = ctx.user.appId
const attachmentsPath = resolve(budibaseAppsDir(), appId, "attachments")
// Serve from CloudFront
if (process.env.CLOUD) {
const S3_URL = `https://${appId}.app.budi.live/assets/${appId}/attachments/${ctx.file}`
const S3_URL = `https://cdn.app.budi.live/assets/${appId}/attachments/${ctx.file}`
const response = await fetch(S3_URL)
const body = await response.text()

View File

@ -23,8 +23,16 @@ if (env.NODE_ENV !== "production") {
}
router
.post("/api/attachments/process", authorized(BUILDER), controller.processLocalFileUpload)
.delete("/api/attachments/:fileName*", authorized(BUILDER), controller.deleteLocalFileUpload)
.post(
"/api/attachments/process",
authorized(BUILDER),
controller.processLocalFileUpload
)
.delete(
"/api/attachments/:fileName",
authorized(BUILDER),
controller.deleteLocalFileUpload
)
.get("/componentlibrary", controller.serveComponentLibrary)
.get("/assets/:file*", controller.serveAppAsset)
.get("/attachments/:file*", controller.serveAttachment)

View File

@ -38,7 +38,7 @@ async function startApp() {
app.server = require("./app")
win = new BrowserWindow({
width: 1920,
height: 1080
height: 1080,
})
win.setTitle(APP_TITLE)
win.loadURL(APP_URL)

View File

@ -1,20 +1,20 @@
const fs = require("fs");
const sharp = require("sharp");
const fsPromises = fs.promises;
const fs = require("fs")
const sharp = require("sharp")
const fsPromises = fs.promises
const FORMATS = {
IMAGES: ["png", "jpg", "jpeg", "gif", "svg", "tiff", "raw"],
}
function processImage({ path, outputPath }) {
return sharp(path)
return sharp(path)
.resize(300)
.toFile(outputPath)
}
function process(file) {
if (FORMATS.IMAGES.includes(file.extension.toLowerCase())) {
return processImage(file);
return processImage(file)
}
// No processing required