-
Notifications
You must be signed in to change notification settings - Fork 686
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.
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
Update SearchFiltersPanel for Coach #12759
Changes from 26 commits
f78ec82
9ba200e
065cea6
dea67e4
15a8420
f8463be
3b5c6db
e576f4f
fe02d5e
3678ed2
1a7d8f7
a8b18e6
4d8d727
c7d4589
5009fc0
1121761
2060260
13f4ecd
d2a2b82
8b94f83
73b85ec
dc86215
c1fc917
b30f7c5
c673a02
d3ad0f9
51f196c
d16bebf
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -4,7 +4,7 @@ | |
<div v-if="loading && !loadingMore"> | ||
<KCircularLoader /> | ||
</div> | ||
<div v-else> | ||
<div v-else-if="!showSearch"> | ||
<h1 | ||
v-if="selectPracticeQuiz" | ||
class="select-folder-style" | ||
|
@@ -67,7 +67,7 @@ | |
</div> | ||
</div> | ||
|
||
<div v-if="!isTopicIdSet && bookmarks.length && !showBookmarks"> | ||
<div v-if="!isTopicIdSet && bookmarks.length && !showBookmarks && !showSearch"> | ||
<p>{{ coreString('selectFromBookmarks') }}</p> | ||
|
||
<div> | ||
|
@@ -97,12 +97,6 @@ | |
:topicsLink="topicsLink" | ||
/> | ||
|
||
<LessonsSearchBox | ||
v-if="!showBookmarks" | ||
@clear="clearSearchTerm" | ||
@searchterm="handleSearchTermChange" | ||
/> | ||
|
||
<div | ||
v-if="showNumberOfQuestionsWarning" | ||
class="shadow" | ||
|
@@ -124,6 +118,7 @@ | |
</div> | ||
|
||
<ContentCardList | ||
v-if="!showSearch" | ||
:contentList="contentList" | ||
:showSelectAll="showSelectAll" | ||
:viewMoreButtonState="viewMoreButtonState" | ||
|
@@ -176,6 +171,18 @@ | |
/> | ||
</div> | ||
</div> | ||
|
||
<SearchFiltersPanel | ||
v-if="showSearch" | ||
ref="sidePanel" | ||
v-model="searchTerms" | ||
data-test="side-panel" | ||
width="100%" | ||
:accordion="true" | ||
:showActivities="false" | ||
@close="showSearch = false" | ||
/> | ||
|
||
<KModal | ||
v-if="showCloseConfirmation" | ||
:submitText="coreString('continueAction')" | ||
|
@@ -196,6 +203,7 @@ | |
import get from 'lodash/get'; | ||
import uniqWith from 'lodash/uniqWith'; | ||
import isEqual from 'lodash/isEqual'; | ||
import flatMap from 'lodash/flatMap'; | ||
import { useMemoize } from '@vueuse/core'; | ||
import { | ||
displaySectionTitle, | ||
|
@@ -206,25 +214,31 @@ | |
import { ContentNodeResource, ChannelResource } from 'kolibri.resources'; | ||
import { ContentNodeKinds, MAX_QUESTIONS_PER_QUIZ_SECTION } from 'kolibri.coreVue.vuex.constants'; | ||
import useKResponsiveWindow from 'kolibri-design-system/lib/composables/useKResponsiveWindow'; | ||
import useBaseSearch from 'kolibri-common/composables/useBaseSearch'; | ||
import SearchFiltersPanel from 'kolibri-common/components/SearchFiltersPanel'; | ||
import { exerciseToQuestionArray } from '../../../utils/selectQuestions'; | ||
import { PageNames, ViewMoreButtonStates } from '../../../constants/index'; | ||
import BookmarkIcon from '../../lessons/LessonResourceSelectionPage/LessonContentCard/BookmarkIcon.vue'; | ||
import useQuizResources from '../../../composables/useQuizResources'; | ||
import { injectQuizCreation } from '../../../composables/useQuizCreation'; | ||
import LessonsSearchBox from '../../lessons/LessonResourceSelectionPage/SearchTools/LessonsSearchBox.vue'; | ||
import ContentCardList from '../../lessons/LessonResourceSelectionPage/ContentCardList.vue'; | ||
import ResourceSelectionBreadcrumbs from '../../lessons/LessonResourceSelectionPage/SearchTools/ResourceSelectionBreadcrumbs.vue'; | ||
|
||
export default { | ||
name: 'ResourceSelection', | ||
components: { | ||
SearchFiltersPanel, | ||
ContentCardList, | ||
BookmarkIcon, | ||
LessonsSearchBox, | ||
ResourceSelectionBreadcrumbs, | ||
}, | ||
mixins: [commonCoreStrings], | ||
setup(props, context) { | ||
const { searchTerms, search } = useBaseSearch({}); | ||
// Search if we already have search terms when we load up | ||
if (flatMap(searchTerms.value, term => Object.keys(term)).length) { | ||
search(); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We should just call (although I am not quite sure why we are calling it in the created hook and not the setup function). |
||
} | ||
const store = getCurrentInstance().proxy.$store; | ||
const route = computed(() => store.state.route); | ||
const topicId = computed(() => route.value.params.topic_id); | ||
|
@@ -701,6 +715,7 @@ | |
} | ||
|
||
return { | ||
showSearch: ref(false), | ||
nodeIsSelectableOrUnselectable, | ||
showCheckbox, | ||
displaySectionTitle, | ||
|
@@ -765,6 +780,7 @@ | |
selectPracticeQuizLabel$, | ||
numberOfQuestionsLabel$, | ||
addNumberOfQuestions$, | ||
searchTerms, | ||
}; | ||
}, | ||
props: { | ||
|
@@ -906,20 +922,6 @@ | |
count, | ||
}); | ||
}, | ||
handleSearchTermChange(searchTerm) { | ||
const query = { | ||
...this.$route.query, | ||
search: searchTerm, | ||
}; | ||
this.$router.push({ query }); | ||
}, | ||
clearSearchTerm() { | ||
const query = { | ||
...this.$route.query, | ||
}; | ||
delete query.search; | ||
this.$router.push({ query }); | ||
}, | ||
}, | ||
}; | ||
|
||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We are already defining the
topic
below, we should pass that in as thedescendant
option touseBaseSearch
to properly hook this up to the descendant restricted searching when applicable.