Skip to content

Commit 475dbdb

Browse files
authored
set project size (#130)
* set project size * improve comment, remove console log * take correct size from images * use valtio snapshot data * increase screenshot threshold * refactor way to veryfing requests, disable sw log version while running test * improve opacity check, typo * update cf tests, typos
1 parent 6d55d02 commit 475dbdb

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+499
-267
lines changed

apiTypes.ts

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
export type ApiAsset = Record<string, string | number | null | boolean | ApiAsset[]>
1+
import type { SerializedAsset } from '@mateuszjs/magic-render'
2+
3+
export type ApiAsset = Omit<
4+
SerializedAsset,
5+
'id' | 'texture_id' | 'cache_texture_id' | 'sdf_texture_id'
6+
>
27

38
export type ApiProjectMetaData = {
49
id: string
@@ -7,10 +12,12 @@ export type ApiProjectMetaData = {
712
updatedAt: string
813
}
914

10-
export type ApiProjectAssetsData = {
15+
export type ApiProjectContent = {
1116
id: string
1217
assets: ApiAsset[]
1318
updatedAt: string
19+
width: number
20+
height: number
1421
}
1522

1623
export type ApiUserBasic = {

functions/api/projects/[id]/index.test.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ describe('GET /api/projects/[id]', () => {
1414
expect(await response.json()).toEqual({
1515
id: '1',
1616
assets: [],
17+
height: 200,
18+
width: 100,
1719
updatedAt: expect.any(String),
1820
})
1921
})

functions/api/projects/[id]/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,14 @@ export const onRequestGet: Handler<'id'> = withSession(async (ctx, session) => {
77
const [project, err] = await withError(async () => {
88
const project = await ctx.env.db
99
.prepare(
10-
`SELECT id, assets, updated_at
10+
`SELECT id, assets, updated_at, width, height
1111
FROM projects
1212
WHERE id = ? AND owner_id = ?`
1313
)
1414
.bind(ctx.params.id, session.userId)
15-
.first<Pick<Project.DB, 'id' | 'assets' | 'updated_at'>>()
15+
.first<Pick<Project.DB, 'id' | 'assets' | 'updated_at' | 'width' | 'height'>>()
1616

17-
return Project.sanitizeAssetsData(project)
17+
return Project.sanitizeContent(project)
1818
})
1919

2020
if (err) {

functions/api/projects/index.test.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,11 @@ describe('POST /api/projects', () => {
2020
expect(response.status).toBe(201)
2121
const json = await response.json()
2222
expect(json).toEqual({
23-
createdAt: expect.any(String),
2423
id: '2',
2524
updatedAt: expect.any(String),
26-
name: null,
25+
width: 600,
26+
height: 400,
27+
assets: [],
2728
})
2829
})
2930

functions/api/projects/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,17 +23,17 @@ export const onRequestPost = withSession(async (ctx, session) => {
2323
.prepare(
2424
`INSERT INTO projects (width, height, assets, owner_id)
2525
VALUES (?, ?, ?, ?)
26-
RETURNING id, name, created_at, updated_at`
26+
RETURNING id, width, height, assets, updated_at`
2727
)
2828
.bind(
2929
sanitizedChanges.width,
3030
sanitizedChanges.height,
3131
sanitizedChanges.assets,
3232
session.userId
3333
)
34-
.first<Pick<Project.DB, 'id' | 'name' | 'created_at' | 'updated_at'>>()
34+
.first<Pick<Project.DB, 'id' | 'width' | 'height' | 'assets' | 'updated_at'>>()
3535

36-
return Project.sanitizeMetaData(project)
36+
return Project.sanitizeContent(project)
3737
})
3838

3939
if (err) {

functions/types/project.ts

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ApiAsset, ApiProjectAssetsData, ApiProjectMetaData } from '../../apiTypes'
1+
import { ApiAsset, ApiProjectContent, ApiProjectMetaData } from '../../apiTypes'
22

33
export type DB = {
44
id: number
@@ -12,29 +12,26 @@ export type DB = {
1212
assets: string
1313
}
1414

15-
export function sanitizeAssetsData(
16-
data: Pick<DB, 'id' | 'assets' | 'updated_at'> | null
17-
): ApiProjectAssetsData {
15+
export function sanitizeContent(
16+
data: Pick<DB, 'id' | 'assets' | 'updated_at' | 'width' | 'height'> | null
17+
): ApiProjectContent {
1818
if (!data) {
1919
throw new Error('No data was found.')
2020
}
2121

22-
const assets = (() => {
23-
try {
24-
return JSON.parse(data.assets) as ApiAsset[]
25-
} catch (err) {
26-
// console.error(err) capture this log in the future
27-
}
28-
})()
29-
30-
if (!assets || !Array.isArray(assets)) {
22+
let assets: ApiAsset[]
23+
try {
24+
assets = JSON.parse(data.assets) as ApiAsset[]
25+
} catch (err) {
3126
throw Error('An issue with assets has occurred.')
3227
}
3328

3429
return {
3530
id: data.id.toString(),
3631
assets,
3732
updatedAt: data.updated_at,
33+
width: data.width,
34+
height: data.height,
3835
}
3936
}
4037

global.d.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,12 @@ declare global {
55
creatorCanvas: HTMLCanvasElement
66
}
77
}
8+
9+
declare module 'valtio' {
10+
export function useSnapshot<T>(proxyObject: T): T
11+
// valtio/useSnapshot returns Readonly types
12+
// it's annoying to always pass "Readonly" types around
13+
// so we override the type here to return writeable types
14+
// but in this project there should never be an object obtained from useSnapshot
15+
// that excepts to be mudated
16+
}

package-lock.json

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"dependencies": {
2020
"@aws-sdk/client-s3": "^3.913.0",
2121
"@aws-sdk/s3-request-presigner": "^3.913.0",
22-
"@mateuszjs/magic-render": "^0.1.0-next.32",
22+
"@mateuszjs/magic-render": "^0.1.0-next.37",
2323
"@supabase/supabase-js": "^2.49.4",
2424
"@vercel/functions": "^2.0.0",
2525
"classnames": "^2.5.1",

src/__mocks__/@mateuszjs/magic-render.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
1-
import type { SerializedOutputAsset, CreatorAPI } from '@mateuszjs/magic-render'
1+
import type { CreatorAPI, ProjectSnapshot } from '@mateuszjs/magic-render'
22

33
let onSelectAssetCallback: (assetId: [number, number, number, number]) => void
4-
let onUpdateAssetsCallback: (assets: SerializedOutputAsset[]) => void
54
let onPreviewUpdateCallback: (canvas: HTMLCanvasElement) => void
65

76
/** this mock is created since currently github actions do not support GPU.
87
* For WebGPU physical GPU is required, so far there is no way to simulate with CPU */
98
export default function initMagicRenderMock(
9+
width: number,
10+
height: number,
1011
canvas: HTMLCanvasElement,
1112
uploadTexture: (url: string, onNewUrl: (newUrl: string) => void) => void,
12-
onAssetsUpdate: (assets: SerializedOutputAsset[]) => void,
13+
onSnapshotUpdate: (snapshot: ProjectSnapshot) => void,
1314
onAssetSelect: (assetId: [number, number, number, number]) => void,
1415
onProcessingUpdate: (inProgress: boolean) => void,
1516
onPreviewUpdate: (canvas: HTMLCanvasElement) => void,
@@ -24,13 +25,16 @@ export default function initMagicRenderMock(
2425

2526
canvas.setAttribute('data-magic-render-linked', 'true')
2627
onSelectAssetCallback = onAssetSelect
27-
onUpdateAssetsCallback = onAssetsUpdate
2828
onPreviewUpdateCallback = onPreviewUpdate
2929

3030
return Promise.resolve({
3131
addImage: jest.fn(),
3232
removeAsset: jest.fn(),
33-
resetAssets: jest.fn(),
33+
setSnapshot: jest.fn((snapshot, withSnapshot) => {
34+
if (withSnapshot) {
35+
onSnapshotUpdate(snapshot)
36+
}
37+
}),
3438
setTool: jest.fn((tool) => {
3539
onUpdateTool(tool)
3640
}),
@@ -47,10 +51,6 @@ export function __triggerSelectAsset(assetId: [number, number, number, number])
4751
onSelectAssetCallback(assetId)
4852
}
4953

50-
export function __triggerUpdateAssets(assets: SerializedOutputAsset[]) {
51-
onUpdateAssetsCallback(assets)
52-
}
53-
5454
export function __triggerPreviewUpdate(canvas: HTMLCanvasElement) {
5555
onPreviewUpdateCallback(canvas)
5656
}

0 commit comments

Comments
 (0)