1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-19 13:19:41 +02:00

Feature: Global Timeline (#2265)

* extended query filter to accept nested tables

* decoupled timeline api from recipe slug

* modified frontend to use simplified events api

* fixed nested loop index ghosting

* updated existing tests

* gave mypy a snack

* added tests for nested queries

* fixed "last made" render error

* decoupled recipe timeline from dialog

* removed unused props

* tweaked recipe get_all to accept ids

* created group global timeline
added new timeline page to sidebar
reformatted the recipe timeline
added vertical option to recipe card mobile

* extracted timeline item into its own component

* fixed apploader centering

* added paginated scrolling to recipe timeline

* added sort direction config
fixed infinite scroll on dialog
fixed hasMore var not resetting during instantiation

* added sort direction to user preferences

* updated API docs with new query filter feature

* better error tracing

* fix for recipe not found response

* simplified recipe crud route for slug/id
added test for fetching by slug/id

* made query filter UUID validation clearer

* moved timeline menu option below shopping lists

---------

Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>
This commit is contained in:
Michael Genson 2023-04-25 12:46:00 -05:00 committed by GitHub
parent 0e397b34fd
commit fe17922bb8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 871 additions and 506 deletions

View file

@ -14,17 +14,20 @@
{{ $globals.icons.timelineText }}
</v-icon>
</v-btn>
<RecipeDialogTimeline v-model="showTimeline" :slug="slug" :recipe-name="recipeName" />
<BaseDialog v-model="showTimeline" :title="timelineAttrs.title" :icon="$globals.icons.timelineText" width="70%">
<RecipeTimeline v-model="showTimeline" :query-filter="timelineAttrs.queryFilter" max-height="70vh" />
</BaseDialog>
</template>
<span>{{ $t('recipe.open-timeline') }}</span>
</v-tooltip>
</template>
<script lang="ts">
import { defineComponent, ref } from "@nuxtjs/composition-api";
import RecipeDialogTimeline from "./RecipeDialogTimeline.vue";
import { computed, defineComponent, ref, useContext } from "@nuxtjs/composition-api";
import RecipeTimeline from "./RecipeTimeline.vue";
export default defineComponent({
components: { RecipeDialogTimeline },
components: { RecipeTimeline },
props: {
buttonStyle: {
@ -41,13 +44,26 @@ export default defineComponent({
},
},
setup() {
setup(props) {
const { $vuetify, i18n } = useContext();
const showTimeline = ref(false);
function toggleTimeline() {
showTimeline.value = !showTimeline.value;
}
return { showTimeline, toggleTimeline };
const timelineAttrs = computed(() => {
let title = i18n.tc("recipe.timeline")
if ($vuetify.breakpoint.smAndDown) {
title += ` ${props.recipeName}`
}
return {
title,
queryFilter: `recipe.slug="${props.slug}"`,
}
})
return { showTimeline, timelineAttrs, toggleTimeline };
},
});
</script>