Properly handle place removals
* Transition to OSM route or index instead of staying on ghost route/ID (closes sidebar if it was a custom place) * Ensure save button and lists are in the correct state
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import Component from '@glimmer/component';
|
||||
import { service } from '@ember/service';
|
||||
import { on } from '@ember/modifier';
|
||||
import { htmlSafe } from '@ember/template';
|
||||
import { humanizeOsmTag } from '../utils/format-text';
|
||||
@@ -13,9 +14,14 @@ import { tracked } from '@glimmer/tracking';
|
||||
import { action } from '@ember/object';
|
||||
|
||||
export default class PlaceDetails extends Component {
|
||||
@service storage;
|
||||
@tracked isEditing = false;
|
||||
@tracked showLists = false;
|
||||
|
||||
get isSaved() {
|
||||
return this.storage.isPlaceSaved(this.place.id || this.place.osmId);
|
||||
}
|
||||
|
||||
get place() {
|
||||
return this.args.place || {};
|
||||
}
|
||||
@@ -38,7 +44,7 @@ export default class PlaceDetails extends Component {
|
||||
|
||||
@action
|
||||
startEditing() {
|
||||
if (!this.place.createdAt) return; // Only allow editing saved places
|
||||
if (!this.isSaved) return; // Only allow editing saved places
|
||||
this.isEditing = true;
|
||||
}
|
||||
|
||||
@@ -276,7 +282,7 @@ export default class PlaceDetails extends Component {
|
||||
<button
|
||||
type="button"
|
||||
class={{if
|
||||
this.place.createdAt
|
||||
this.isSaved
|
||||
"btn btn-secondary"
|
||||
"btn btn-outline"
|
||||
}}
|
||||
@@ -284,20 +290,21 @@ export default class PlaceDetails extends Component {
|
||||
>
|
||||
<Icon
|
||||
@name="bookmark"
|
||||
@color={{if this.place.createdAt "currentColor" "#007bff"}}
|
||||
@color={{if this.isSaved "currentColor" "#007bff"}}
|
||||
/>
|
||||
{{if this.place.createdAt "Saved" "Save"}}
|
||||
{{if this.isSaved "Saved" "Save"}}
|
||||
</button>
|
||||
|
||||
{{#if this.showLists}}
|
||||
<PlaceListsManager
|
||||
@place={{this.saveablePlace}}
|
||||
@onClose={{this.closeLists}}
|
||||
@isSaved={{this.isSaved}}
|
||||
/>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
{{#if this.place.createdAt}}
|
||||
{{#if this.isSaved}}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-outline"
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import Component from '@glimmer/component';
|
||||
import { service } from '@ember/service';
|
||||
import { action } from '@ember/object';
|
||||
import { tracked } from '@glimmer/tracking';
|
||||
import { on } from '@ember/modifier';
|
||||
import { fn } from '@ember/helper';
|
||||
import { htmlSafe } from '@ember/template';
|
||||
@@ -8,12 +9,15 @@ import onClickOutside from '../modifiers/on-click-outside';
|
||||
|
||||
export default class PlaceListsManager extends Component {
|
||||
@service storage;
|
||||
@service router;
|
||||
@tracked _forceClear = false;
|
||||
|
||||
get isSaved() {
|
||||
return !!this.args.place.createdAt;
|
||||
return this.args.isSaved;
|
||||
}
|
||||
|
||||
get placeListIds() {
|
||||
if (this._forceClear) return [];
|
||||
return this.args.place._listIds || [];
|
||||
}
|
||||
|
||||
@@ -30,7 +34,35 @@ export default class PlaceListsManager extends Component {
|
||||
@action
|
||||
async toggleSaved() {
|
||||
if (this.isSaved) {
|
||||
const { osmId, osmType } = this.args.place;
|
||||
|
||||
await this.storage.removePlace(this.args.place);
|
||||
|
||||
// Clean up the local object reference immediately to prevent UI flicker
|
||||
// or stale state if the transition is delayed/cancelled.
|
||||
if (this.args.place) {
|
||||
this.args.place.id = null;
|
||||
this.args.place.createdAt = null;
|
||||
this.args.place._listIds = [];
|
||||
this._forceClear = true;
|
||||
}
|
||||
|
||||
// Transition immediately to the canonical state
|
||||
if (osmId && osmType) {
|
||||
// Create a transient copy that looks like a fresh OSM result
|
||||
const rawPlace = { ...this.args.place };
|
||||
delete rawPlace.id;
|
||||
delete rawPlace.createdAt;
|
||||
delete rawPlace._listIds;
|
||||
|
||||
// Transition to the place route using the raw object
|
||||
// This updates the URL to 'osm:...' and renders immediately
|
||||
this.router.transitionTo('place', rawPlace);
|
||||
} else {
|
||||
// Custom place deleted -> go home
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
|
||||
if (this.args.onClose) this.args.onClose();
|
||||
} else {
|
||||
await this.storage.storePlace(this.args.place);
|
||||
|
||||
Reference in New Issue
Block a user