enso/app/gui2/stories/GraphEditor.story.vue
somebody1234 ebf4cd5c1f
Inline modules in app/ide-desktop/ (#10305)
- Remove unnecessary modules
- Remove `ts-plugin-namespace-auto-import` as it was a workaround to use the non-conventional `import *` convention
- Remove `esbuild-plugin-copy-directories` as it is unuse
- Inline modules that are only ever used once
- Inline `project-manager-shim` into `gui2` - it is only used during `gui2`'s dev mode
- Inline `content-config` into `client`
- Flatten `app/ide-desktop/lib/` to `app/ide-desktop/`
- Flatten `app/ide-desktop/lib/dashboard/` to `app/dashboard/`

# Important Notes
- As mentioned above, all remaining modules have been moved up from `app/ide-desktop/lib/` to `app/ide-desktop/`. It's not ideal but I'd rather hold off on moving them anywhere else before we have a consensus on what should go where.
- (That is to say, this may not be the final directory structure - but I figure it's fine to get *something* done so that hopefully the rest of the restructuring is simpler.)
2024-07-17 09:10:42 +00:00

78 lines
2.2 KiB
Vue

<script setup lang="ts">
import { reactive, ref } from 'vue'
import GraphEditor from '@/components/GraphEditor.vue'
import { useSuggestionDbStore } from '@/stores/suggestionDatabase'
import { ToastContainer } from 'react-toastify'
import 'react-toastify/dist/ReactToastify.css'
import { createReactWrapper } from 'vue-react-wrapper'
import MockProjectStoreWrapper from '../mock/MockProjectStoreWrapper.vue'
import HstCode from './histoire/HstCode.vue'
const text = ref(`\
from Standard.Base import all
from Standard.Base.Runtime.Ref import Ref
from Standard.Test import Bench
options = Bench.options . set_warmup (Bench.phase_conf 1 2) . set_measure (Bench.phase_conf 3 2)
collect_benches = Bench.build builder->
range_size = 100000000
data = 0.up_to range_size
builder.group "Range" options group_builder->
group_builder.specify "iterate" <|
cell = Ref.new 0
data . each _->
x = cell.get
cell.put x+1
cell.get . should_equal range_size
main =
benches = collect_benches
result = run_main benches
third_node = 2 + 2
`)
/**
* Note: These props should be synced with the props in
* `app/dashboard/src/App.tsx`.
* We need this here, as the React component is not part of the dashboard and not usually
* available in the demo scenes. Using this wrapper enables us to see toasts in the absence
* of the dashboard/React.
*/
const toastProps = reactive({
position: 'top-center',
theme: 'light',
closeOnClick: false,
draggable: false,
toastClassName: 'text-sm leading-cozy bg-selected-frame rounded-lg backdrop-blur-default',
limit: 3,
})
const WrappedToastContainer = createReactWrapper(ToastContainer, toastProps)
</script>
<template>
<Story
title="Editor"
group="graph"
:layout="{ type: 'single', iframe: false }"
:setupApp="
() => {
useSuggestionDbStore()
}
"
responsiveDisabled
autoPropsDisabled
>
<WrappedToastContainer />t
<MockProjectStoreWrapper v-model="text">
<Suspense><GraphEditor /></Suspense>
</MockProjectStoreWrapper>
<template #controls><HstCode v-model="text" title="code" /></template>
</Story>
</template>