Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: using FetchAsteroidWatchWidget #624

Merged
merged 2 commits into from
Sep 18, 2024
Merged

fix: using FetchAsteroidWatchWidget #624

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
10fcc99
using FetchAsteroidWatchWidget
stephiescastle Sep 18, 2024
85c8ae0
fixing mock component
stephiescastle Sep 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions apps/vue-storybook/.storybook/_mock-components.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
// import and assign mock components
import { action } from '@storybook/addon-actions'
import DsnWidget from '@explorer-1/vue/src/components/DsnWidget/DsnWidget.vue'
import AsteroidWatchWidget from '@explorer-1/vue/src/components/AsteroidWatchWidget/AsteroidWatchWidget.vue'

export default (app) => {
// nuxt-link mock component
Expand All @@ -27,4 +28,7 @@ export default (app) => {

// use static dsn widget instead of fetch
app.component('FetchDsnWidget', DsnWidget)

// use static asteroid watch widget instead of fetch
app.component('FetchAsteroidWatchWidget', AsteroidWatchWidget)
}
49 changes: 19 additions & 30 deletions packages/vue/src/templates/www/PageAsteroidWatchContent/PageAsteroidWatchContent.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,21 @@
<script setup lang="ts">
import { reactive } from 'vue'
import NavSecondary from './../../../components/NavSecondary/NavSecondary.vue'
import LayoutHelper from './../../../components/LayoutHelper/LayoutHelper.vue'
import DetailHeadline from './../../../components/DetailHeadline/DetailHeadline.vue'
import HeroMedia from './../../../components/HeroMedia/HeroMedia.vue'
import ShareButtons from './../../../components/ShareButtons/ShareButtons.vue'
import BlockStreamfield from './../../../components/BlockStreamfield/BlockStreamfield.vue'

interface PageAsteroidWatchContentProps {
data: any
}
const props = withDefaults(defineProps<PageAsteroidWatchContentProps>(), {
data: undefined
})

const { data } = reactive(props)
</script>
<template>
<div
v-if="data"
Expand Down Expand Up @@ -30,7 +48,7 @@
</LayoutHelper>

<template v-if="data.slug === 'next-five-approaches'">
<AsteroidWatchWidget class="lg:mb-18 mb-10" />
<FetchAsteroidWatchWidget class="lg:mb-18 mb-10" />
</template>

<!-- share buttons -->
Expand All @@ -48,32 +66,3 @@
<BlockStreamfield :data="data.body" />
</div>
</template>
<script>
import { defineComponent } from 'vue'
import NavSecondary from './../../../components/NavSecondary/NavSecondary.vue'
import LayoutHelper from './../../../components/LayoutHelper/LayoutHelper.vue'
import DetailHeadline from './../../../components/DetailHeadline/DetailHeadline.vue'
import HeroMedia from './../../../components/HeroMedia/HeroMedia.vue'
import ShareButtons from './../../../components/ShareButtons/ShareButtons.vue'
import BlockStreamfield from './../../../components/BlockStreamfield/BlockStreamfield.vue'
import AsteroidWatchWidget from './../../../components/AsteroidWatchWidget/AsteroidWatchWidget.vue'

export default defineComponent({
name: 'PageAsteroidWatchContent',
components: {
NavSecondary,
LayoutHelper,
HeroMedia,
ShareButtons,
BlockStreamfield,
DetailHeadline,
AsteroidWatchWidget
},
props: {
data: {
type: Object,
required: false
}
}
})
</script>