fix(front): #2440 make `build` happy by commenting out all remaining jQuery invocations
This commit is contained in:
		
							parent
							
								
									1972f6c8a0
								
							
						
					
					
						commit
						062fd544d6
					
				|  | @ -1,15 +1,14 @@ | ||||||
| <script setup lang="ts"> | <script setup lang="ts"> | ||||||
| import type { Tag } from '~/types' | // import type { Tag } from '~/types' | ||||||
| 
 | 
 | ||||||
| import { ref, watch, onMounted, nextTick } from 'vue' | import { ref, watch, onMounted, nextTick } from 'vue' | ||||||
| import { isEqual } from 'lodash-es' | // import { isEqual } from 'lodash-es' | ||||||
| import { useStore } from '~/store' | // import { useStore } from '~/store' | ||||||
| import { useI18n } from 'vue-i18n' | import { useI18n } from 'vue-i18n' | ||||||
| import $ from 'jquery' |  | ||||||
| 
 | 
 | ||||||
| interface Events { | // interface Events { | ||||||
|   (e: 'update:modelValue', tags: string[]): void | //   (e: 'update:modelValue', tags: string[]): void | ||||||
| } | // } | ||||||
| 
 | 
 | ||||||
| interface Props { | interface Props { | ||||||
|   modelValue: string[] |   modelValue: string[] | ||||||
|  | @ -17,87 +16,81 @@ interface Props { | ||||||
| 
 | 
 | ||||||
| const { t } = useI18n() | const { t } = useI18n() | ||||||
| 
 | 
 | ||||||
| const emit = defineEmits<Events>() | // const emit = defineEmits<Events>() | ||||||
| const props = defineProps<Props>() | const props = defineProps<Props>() | ||||||
| 
 | 
 | ||||||
| const store = useStore() | // const store = useStore() | ||||||
| 
 | 
 | ||||||
| const dropdown = ref() | const dropdown = ref() | ||||||
| 
 | 
 | ||||||
| watch(() => props.modelValue, (value) => { | watch(() => props.modelValue, (value) => { | ||||||
|   // TODO: root out jquery and all its malevolent offspring! |   return | ||||||
|   // @ts-expect-error drop up and down and up again |   // TODO: Find out if the following removal causes any regression #2440 | ||||||
|   const current = $(dropdown.value).dropdown('get value').split(',').sort() |   // const current = $(dropdown.value).dropdown('get value').split(',').sort() | ||||||
| 
 | 
 | ||||||
|   if (!isEqual([...value].sort(), current)) { |   // if (!isEqual([...value].sort(), current)) { | ||||||
|     // TODO: root out jquery and all its malevolent offspring! |   //   $(dropdown.value).dropdown('set exactly', value) | ||||||
|     // @ts-expect-error drop up and down and up again |   // } | ||||||
|     $(dropdown.value).dropdown('set exactly', value) |  | ||||||
|   } |  | ||||||
| }) | }) | ||||||
| 
 | 
 | ||||||
| const handleUpdate = () => { | // TODO: Find out if the following removal causes any regression #2440 | ||||||
|   // TODO: root out jquery and all its malevolent offspring! | // const handleUpdate = () => { | ||||||
|   // @ts-expect-error drop up and down and up again | //   const value = $(dropdown.value).dropdown('get value').split(',') | ||||||
|   const value = $(dropdown.value).dropdown('get value').split(',') | //   emit('update:modelValue', value) | ||||||
|   emit('update:modelValue', value) | //   return value | ||||||
|   return value | // } | ||||||
| } |  | ||||||
| 
 | 
 | ||||||
| onMounted(async () => { | onMounted(async () => { | ||||||
|   await nextTick() |   await nextTick() | ||||||
| 
 | 
 | ||||||
|   // TODO: root out jquery and all its malevolent offspring! |   // TODO: Find out if the following removal causes any regression #2440 | ||||||
|   // @ts-expect-error drop up and down and up again |   // $(dropdown.value).dropdown({ | ||||||
|   $(dropdown.value).dropdown({ |   //   keys: { delimiter: 32 }, | ||||||
|     keys: { delimiter: 32 }, |   //   forceSelection: false, | ||||||
|     forceSelection: false, |   //   saveRemoteData: false, | ||||||
|     saveRemoteData: false, |   //   filterRemoteData: true, | ||||||
|     filterRemoteData: true, |   //   preserveHTML: false, | ||||||
|     preserveHTML: false, |   //   apiSettings: { | ||||||
|     apiSettings: { |   //     url: store.getters['instance/absoluteUrl']('/api/v1/tags/?name__startswith={query}&ordering=length&page_size=5'), | ||||||
|       url: store.getters['instance/absoluteUrl']('/api/v1/tags/?name__startswith={query}&ordering=length&page_size=5'), |   //     // @ts-expect-error I'm not curious to research what xhr is but I'm sure it served its purpose well | ||||||
|       // @ts-expect-error I'm not curious to research what xhr is but I'm sure it served its purpose well |   //     beforeXHR: function (xhrObject) { | ||||||
|       beforeXHR: function (xhrObject) { |   //       if (store.state.auth.oauth.accessToken) { | ||||||
|         if (store.state.auth.oauth.accessToken) { |   //         xhrObject.setRequestHeader('Authorization', store.getters['auth/header']) | ||||||
|           xhrObject.setRequestHeader('Authorization', store.getters['auth/header']) |   //       } | ||||||
|         } |   //       return xhrObject | ||||||
|         return xhrObject |   //     }, | ||||||
|       }, |   //     // @ts-expect-error yes, semantic-ui has a large API. | ||||||
|       // @ts-expect-error yes, semantic-ui has a large API. |   //     onResponse (response) { | ||||||
|       onResponse (response) { |   //       response = { results: [], ...response } | ||||||
|         response = { results: [], ...response } |  | ||||||
| 
 | 
 | ||||||
|         // @ts-expect-error Semantic UI |   //       const currentSearch: string = '' | ||||||
|         const currentSearch: string = $(dropdown.value).dropdown('get query') |   //       // TODO: Find out if the following removal causes any regression #2440 | ||||||
|  |   //       // $(dropdown.value).dropdown('get query') | ||||||
| 
 | 
 | ||||||
|         if (currentSearch) { |   //       if (currentSearch) { | ||||||
|           const existingTag = response.results.find((result: Tag) => result.name === currentSearch) |   //         const existingTag = response.results.find((result: Tag) => result.name === currentSearch) | ||||||
| 
 | 
 | ||||||
|           if (existingTag) { |   //         if (existingTag) { | ||||||
|             if (response.results.indexOf(existingTag) !== 0) { |   //           if (response.results.indexOf(existingTag) !== 0) { | ||||||
|               response.results = [existingTag, ...response.results] |   //             response.results = [existingTag, ...response.results] | ||||||
|               response.results.splice(response.results.indexOf(existingTag) + 1, 1) |   //             response.results.splice(response.results.indexOf(existingTag) + 1, 1) | ||||||
|             } |   //           } | ||||||
|           } else { |   //         } else { | ||||||
|             response.results = [{ name: currentSearch }, ...response.results] |   //           response.results = [{ name: currentSearch }, ...response.results] | ||||||
|           } |   //         } | ||||||
|         } |   //       } | ||||||
|         return response |   //       return response | ||||||
|       } |   //     } | ||||||
|     }, |   //   }, | ||||||
|     fields: { remoteValues: 'results', value: 'name' }, |   //   fields: { remoteValues: 'results', value: 'name' }, | ||||||
|     allowAdditions: true, |   //   allowAdditions: true, | ||||||
|     minCharacters: 1, |   //   minCharacters: 1, | ||||||
|     onAdd: handleUpdate, |   //   onAdd: handleUpdate, | ||||||
|     onRemove: handleUpdate, |   //   onRemove: handleUpdate, | ||||||
|     onLabelRemove: handleUpdate, |   //   onLabelRemove: handleUpdate, | ||||||
|     onChange: handleUpdate |   //   onChange: handleUpdate | ||||||
|   }) |   // }) | ||||||
| 
 |   // $(dropdown.value).dropdown('set exactly', props.modelValue) | ||||||
|   // TODO: root out jquery and all its malevolent offspring! |  | ||||||
|   // @ts-expect-error drop up and down and up again |  | ||||||
|   $(dropdown.value).dropdown('set exactly', props.modelValue) |  | ||||||
| }) | }) | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -5,9 +5,8 @@ import type { Track } from '~/types' | ||||||
| import { useI18n } from 'vue-i18n' | import { useI18n } from 'vue-i18n' | ||||||
| 
 | 
 | ||||||
| import axios from 'axios' | import axios from 'axios' | ||||||
| import $ from 'jquery' |  | ||||||
| 
 | 
 | ||||||
| import { useCurrentElement, useVModel } from '@vueuse/core' | import { useVModel } from '@vueuse/core' | ||||||
| import { ref, onMounted, watch, computed } from 'vue' | import { ref, onMounted, watch, computed } from 'vue' | ||||||
| import { useStore } from '~/store' | import { useStore } from '~/store' | ||||||
| import { clone } from 'lodash-es' | import { clone } from 'lodash-es' | ||||||
|  | @ -48,7 +47,7 @@ const exclude = computed({ | ||||||
|   set: (value: boolean) => (data.value.config.not = value) |   set: (value: boolean) => (data.value.config.not = value) | ||||||
| }) | }) | ||||||
| 
 | 
 | ||||||
| const el = useCurrentElement() | // const el = useCurrentElement() | ||||||
| 
 | 
 | ||||||
| // This component appears on "create new radio" and offers filters. "New filter" => Dropdown search field | // This component appears on "create new radio" and offers filters. "New filter" => Dropdown search field | ||||||
| // TODO: Re-implement with <Input>, <select> | // TODO: Re-implement with <Input>, <select> | ||||||
|  | @ -59,14 +58,14 @@ onMounted(() => { | ||||||
|     const settings: SemanticUI.DropdownSettings = { |     const settings: SemanticUI.DropdownSettings = { | ||||||
|       // @ts-expect-error value? any! |       // @ts-expect-error value? any! | ||||||
|       onChange (value) { |       onChange (value) { | ||||||
|         // @ts-expect-error dropdown? any! |         // TODO: Find out if the following removal causes any regression #2440 | ||||||
|         value = $(this).dropdown('get value').split(',') |         // value = $(this).dropdown('get value').split(',') | ||||||
| 
 | 
 | ||||||
|         if (field.type === 'list' && field.subtype === 'number') { |         // if (field.type === 'list' && field.subtype === 'number') { | ||||||
|           value = value.map((number: string) => parseInt(number)) |         //   value = value.map((number: string) => parseInt(number)) | ||||||
|         } |         // } | ||||||
| 
 | 
 | ||||||
|         data.value.config[field.name] = value |         // data.value.config[field.name] = value | ||||||
|         fetchCandidates() |         fetchCandidates() | ||||||
|       } |       } | ||||||
|     } |     } | ||||||
|  | @ -99,8 +98,8 @@ onMounted(() => { | ||||||
|       } |       } | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     // @ts-expect-error jquery lives! |     // TODO: Find out if the following removal causes any regression #2440 | ||||||
|     $(el.value).find(selector).dropdown(settings) |     // $(el.value).find(selector).dropdown(settings) | ||||||
|   } |   } | ||||||
| }) | }) | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -1,8 +1,8 @@ | ||||||
| <script setup lang="ts"> | <script setup lang="ts"> | ||||||
| import type { InstancePolicy } from '~/types' | import type { InstancePolicy } from '~/types' | ||||||
| 
 | 
 | ||||||
| import { computed, ref, reactive, nextTick, watch } from 'vue' | import { computed, ref, reactive } from 'vue' | ||||||
| import { useCurrentElement } from '@vueuse/core' | // import { useCurrentElement } from '@vueuse/core' | ||||||
| import { humanSize } from '~/utils/filters' | import { humanSize } from '~/utils/filters' | ||||||
| import { useI18n } from 'vue-i18n' | import { useI18n } from 'vue-i18n' | ||||||
| import { useStore } from '~/store' | import { useStore } from '~/store' | ||||||
|  | @ -104,12 +104,12 @@ const fetchStats = async () => { | ||||||
| fetchStats() | fetchStats() | ||||||
| fetchData() | fetchData() | ||||||
| 
 | 
 | ||||||
| const el = useCurrentElement() | // TODO: Find out if the following removal causes any regression #2440 | ||||||
| watch(object, async () => { | // const el = useCurrentElement() | ||||||
|   await nextTick() | // watch(object, async () => { | ||||||
|   // @ts-expect-error JQuery owhere to be found... | //   await nextTick() | ||||||
|   $(el.value).find('select.dropdown').dropdown() | //   $(el.value).find('select.dropdown').dropdown() | ||||||
| }) | // }) | ||||||
| 
 | 
 | ||||||
| const getQuery = (field: string, value: string) => `${field}:"${value}"` | const getQuery = (field: string, value: string) => `${field}:"${value}"` | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue
	
	 upsiflu
						upsiflu