logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://hacktivis.me/git/pleroma-fe.git

search.js (3436B)


  1. import FollowCard from '../follow_card/follow_card.vue'
  2. import Conversation from '../conversation/conversation.vue'
  3. import Status from '../status/status.vue'
  4. import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
  5. import map from 'lodash/map'
  6. import { library } from '@fortawesome/fontawesome-svg-core'
  7. import {
  8. faCircleNotch,
  9. faSearch
  10. } from '@fortawesome/free-solid-svg-icons'
  11. import { uniqBy } from 'lodash'
  12. library.add(
  13. faCircleNotch,
  14. faSearch
  15. )
  16. const Search = {
  17. components: {
  18. FollowCard,
  19. Conversation,
  20. Status,
  21. TabSwitcher
  22. },
  23. props: [
  24. 'query'
  25. ],
  26. data () {
  27. return {
  28. loaded: false,
  29. loading: false,
  30. searchTerm: this.query || '',
  31. userIds: [],
  32. statuses: [],
  33. hashtags: [],
  34. currenResultTab: 'statuses',
  35. statusesOffset: 0,
  36. lastStatusFetchCount: 0,
  37. lastQuery: ''
  38. }
  39. },
  40. computed: {
  41. users () {
  42. return this.userIds.map(userId => this.$store.getters.findUser(userId))
  43. },
  44. visibleStatuses () {
  45. const allStatusesObject = this.$store.state.statuses.allStatusesObject
  46. return this.statuses.filter(status =>
  47. allStatusesObject[status.id] && !allStatusesObject[status.id].deleted
  48. )
  49. }
  50. },
  51. mounted () {
  52. this.search(this.query)
  53. },
  54. watch: {
  55. query (newValue) {
  56. this.searchTerm = newValue
  57. this.search(newValue)
  58. }
  59. },
  60. methods: {
  61. newQuery (query) {
  62. this.$router.push({ name: 'search', query: { query } })
  63. this.$refs.searchInput.focus()
  64. },
  65. search (query, searchType = null) {
  66. if (!query) {
  67. this.loading = false
  68. return
  69. }
  70. this.loading = true
  71. this.$refs.searchInput.blur()
  72. if (this.lastQuery !== query) {
  73. this.userIds = []
  74. this.hashtags = []
  75. this.statuses = []
  76. this.statusesOffset = 0
  77. this.lastStatusFetchCount = 0
  78. }
  79. this.$store.dispatch('search', { q: query, resolve: true, offset: this.statusesOffset, type: searchType })
  80. .then(data => {
  81. this.loading = false
  82. const oldLength = this.statuses.length
  83. // Always append to old results. If new results are empty, this doesn't change anything
  84. this.userIds = this.userIds.concat(map(data.accounts, 'id'))
  85. this.statuses = uniqBy(this.statuses.concat(data.statuses), 'id')
  86. this.hashtags = this.hashtags.concat(data.hashtags)
  87. this.currenResultTab = this.getActiveTab()
  88. this.loaded = true
  89. // Offset from whatever we already have
  90. this.statusesOffset = this.statuses.length
  91. // Because the amount of new statuses can actually be zero, compare to old lenght instead
  92. this.lastStatusFetchCount = this.statuses.length - oldLength
  93. this.lastQuery = query
  94. })
  95. },
  96. resultCount (tabName) {
  97. const length = this[tabName].length
  98. return length === 0 ? '' : ` (${length})`
  99. },
  100. onResultTabSwitch (key) {
  101. this.currenResultTab = key
  102. },
  103. getActiveTab () {
  104. if (this.visibleStatuses.length > 0) {
  105. return 'statuses'
  106. } else if (this.users.length > 0) {
  107. return 'people'
  108. } else if (this.hashtags.length > 0) {
  109. return 'hashtags'
  110. }
  111. return 'statuses'
  112. },
  113. lastHistoryRecord (hashtag) {
  114. return hashtag.history && hashtag.history[0]
  115. }
  116. }
  117. }
  118. export default Search