Started implementing "Export Project"

This commit is contained in:
Aria Minaei 2021-08-09 17:12:20 +02:00
parent 49c97ebfcf
commit 832542c1c5
3 changed files with 44 additions and 1 deletions

View file

@ -172,4 +172,8 @@ export class Studio {
redo() {
this._store.redo()
}
createExportedStateOfProject(projectId: string): string {
return this._store.createExportedStateOfProject(projectId)
}
}

View file

@ -27,6 +27,7 @@ import type {Store} from 'redux'
import {persistStateOfStudio} from './persistStateOfStudio'
import {isSheetObject} from '@theatre/shared/instanceTypes'
import globals from '@theatre/shared/globals'
import {nanoid} from 'nanoid'
export type Drafts = {
historic: Draft<StudioHistoricState>
@ -269,4 +270,24 @@ export default class StudioStore {
redo() {
this._reduxStore.dispatch(studioActions.historic.redo())
}
createExportedStateOfProject(projectId: string): string {
const projectHistoricState =
this._reduxStore.getState().$persistent.historic.innerState.coreByProject[
projectId
]
const revision = nanoid(16)
const s = {
revision,
definitionVersion: globals.currentProjectStateDefinitionVersion,
projectState: projectHistoricState,
}
// pushOnDiskRevisionBrowserStateIsBasedOn.originalReducer(s, revision)
const exportString = JSON.stringify(s, null, 2)
return exportString
}
}

View file

@ -1,4 +1,5 @@
import type Project from '@theatre/core/projects/Project'
import getStudio from '@theatre/studio/getStudio'
import React from 'react'
const ProjectDetails: React.FC<{
@ -6,7 +7,24 @@ const ProjectDetails: React.FC<{
}> = ({projects}) => {
const project = projects[0]
return <div>editing project {project.address.projectId}</div>
const exportProject = () => {
const str = getStudio().createExportedStateOfProject(
project.address.projectId,
)
const file = new File([str], 'state.json', {type: 'application/json'})
const objUrl = URL.createObjectURL(file)
const a = document.createElement('a')
a.href = objUrl
a.target = '_blank'
a.setAttribute('download', 'state.json')
a.click()
}
return (
<div>
<button onClick={exportProject}>Export project</button>
</div>
)
}
export default ProjectDetails