Skip to content

Commit

Permalink
updating set-mode to use composable state manager
Browse files Browse the repository at this point in the history
  • Loading branch information
BryonLewis committed Feb 1, 2024
1 parent a994335 commit ce36132
Show file tree
Hide file tree
Showing 6 changed files with 129 additions and 138 deletions.
8 changes: 4 additions & 4 deletions client/src/components/AnnotationEditor.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,13 +28,13 @@ export default defineComponent({
emits: ['update:annotation', 'delete:annotation'],
setup(props, { emit }) {
const speciesList = computed(() => {
return props.species.map((item) => (item.common_name));
return props.species.map((item) => (item.species_code || item.common_name)).sort();
});
const speciesEdit: Ref<string[]> = ref( props.annotation?.species?.map((item) => item.common_name) || []);
const speciesEdit: Ref<string[]> = ref( props.annotation?.species?.map((item) => item.species_code || item.common_name) || []);
const comments: Ref<string> = ref(props.annotation?.comments || '');
watch(() => props.annotation, () => {
if (props.annotation?.species) {
speciesEdit.value = props.annotation.species.map((item) => item.common_name);
speciesEdit.value = props.annotation.species.map((item) => item.species_code || item.common_name);
}
if (props.annotation?.comments) {
comments.value = props.annotation.comments;
Expand Down Expand Up @@ -91,7 +91,7 @@ export default defineComponent({
</v-row>
</v-card-title>
<v-row>
<v-select
<v-autocomplete
v-model="speciesEdit"
multiple
closable-chips
Expand Down
6 changes: 1 addition & 5 deletions client/src/components/AnnotationList.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,6 @@ export default defineComponent({
type: Number as PropType<number | null>,
default: null,
},
mode: {
type: String as PropType<'creation' | 'editing' | 'disabled'>,
required: true,
}
},
emits: ['select'],
setup(props) {
Expand Down Expand Up @@ -58,7 +54,7 @@ export default defineComponent({
Annotations
<v-spacer />
<v-btn
:disabled="mode === 'creation'"
:disabled="annotationState === 'creating'"
@click="annotationState = 'creating'"
>
Add<v-icon>mdi-plus</v-icon>
Expand Down
2 changes: 0 additions & 2 deletions client/src/components/SpectrogramViewer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,6 @@ export default defineComponent({
"selected",
"geoViewerRef",
"hoverData",
"set-mode",
],
setup(props, { emit }) {
const containerRef: Ref<HTMLElement | undefined> = ref();
Expand Down Expand Up @@ -221,7 +220,6 @@ export default defineComponent({
@update:annotation="updateAnnotation($event)"
@create:annotation="createAnnotation($event)"
@set-cursor="setCursor($event)"
@set-mode="$emit('set-mode', $event)"
/>
<div
ref="imageCursorRef"
Expand Down
5 changes: 2 additions & 3 deletions client/src/components/geoJS/LayerManager.vue
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export default defineComponent({
default: false,
},
},
emits: ["selected", "update:annotation", "create:annotation", "set-cursor", "set-mode"],
emits: ["selected", "update:annotation", "create:annotation", "set-cursor"],
setup(props, { emit }) {
const {
annotationState,
Expand Down Expand Up @@ -67,7 +67,6 @@ export default defineComponent({
const event = (type: string, data: any) => {
// Will handle clicking, selecting and editing here
if (type === "update:mode") {
emit("set-mode", data.mode);
setAnnotationState(data.mode);
}
if (type === "update:cursor") {
Expand Down Expand Up @@ -263,7 +262,7 @@ export default defineComponent({
editAnnotationLayer.getMode() === "disabled" &&
props.selectedId === null
) {
emit("set-mode", "disabled");
annotationState.value === 'disabled';
editAnnotationLayer.featureLayer.clear();
}
});
Expand Down
2 changes: 1 addition & 1 deletion client/src/use/useState.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const colorScale: Ref<d3.ScaleOrdinal<string, string, never> | undefined> = ref(
const selectedUsers: Ref<string[]> = ref([]);
const currentUser: Ref<string> = ref('');

type AnnotationState = "" | "editing" | "creating";
type AnnotationState = "" | "editing" | "creating" | "disabled";
export default function useState() {
const setAnnotationState = (state: AnnotationState) => {
annotationState.value = state;
Expand Down
Loading

0 comments on commit ce36132

Please sign in to comment.