mirror of
https://github.com/liamcottle/reticulum-meshchat.git
synced 2026-04-28 00:20:48 +00:00
add dropdown menu to nomadnetwork favourites list to rename and remove
This commit is contained in:
parent
64adad27f8
commit
9031c1a3d7
3 changed files with 98 additions and 2 deletions
19
meshchat.py
19
meshchat.py
|
|
@ -1294,6 +1294,25 @@ class ReticulumMeshChat:
|
|||
"message": "Favourite has been added!",
|
||||
})
|
||||
|
||||
# rename favourite
|
||||
@routes.post("/api/v1/favourites/{destination_hash}/rename")
|
||||
async def index(request):
|
||||
|
||||
# get path params
|
||||
destination_hash = request.match_info.get("destination_hash", "")
|
||||
|
||||
# get request data
|
||||
data = await request.json()
|
||||
display_name = data.get("display_name")
|
||||
|
||||
# update display name if provided
|
||||
if len(display_name) > 0:
|
||||
database.FavouriteDestination.update(display_name=display_name).where(database.FavouriteDestination.destination_hash == destination_hash).execute()
|
||||
|
||||
return web.json_response({
|
||||
"message": "Favourite has been renamed",
|
||||
})
|
||||
|
||||
# delete favourite
|
||||
@routes.delete("/api/v1/favourites/{destination_hash}")
|
||||
async def index(request):
|
||||
|
|
|
|||
|
|
@ -5,7 +5,9 @@
|
|||
:nodes="nodes"
|
||||
:favourites="favourites"
|
||||
:selected-destination-hash="selectedNode?.destination_hash"
|
||||
@node-click="onNodeClick"/>
|
||||
@node-click="onNodeClick"
|
||||
@rename-favourite="onRenameFavourite"
|
||||
@remove-favourite="onRemoveFavourite"/>
|
||||
|
||||
<div class="flex flex-col flex-1 overflow-hidden min-w-full sm:min-w-[500px] dark:bg-zinc-950">
|
||||
<!-- node -->
|
||||
|
|
@ -835,6 +837,40 @@ export default {
|
|||
// load default node page
|
||||
this.loadNodePage(node.destination_hash, this.defaultNodePagePath);
|
||||
|
||||
},
|
||||
async onRenameFavourite(favourite) {
|
||||
|
||||
// ask user for new display name
|
||||
const displayName = await DialogUtils.prompt("Rename this favourite");
|
||||
if(displayName == null){
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
// rename on server
|
||||
await axios.post(`/api/v1/favourites/${favourite.destination_hash}/rename`, {
|
||||
display_name: displayName,
|
||||
});
|
||||
|
||||
// reload favourites
|
||||
await this.getFavourites();
|
||||
|
||||
} catch(e) {
|
||||
console.log(e);
|
||||
DialogUtils.alert("Failed to rename favourite");
|
||||
}
|
||||
|
||||
},
|
||||
onRemoveFavourite: function(favourite) {
|
||||
|
||||
// ask user to confirm
|
||||
if(!confirm("Are you sure you want to remove this favourite?")){
|
||||
return;
|
||||
}
|
||||
|
||||
this.removeFavourite(favourite);
|
||||
|
||||
},
|
||||
onCloseNodeViewer: function() {
|
||||
|
||||
|
|
|
|||
|
|
@ -30,6 +30,38 @@
|
|||
<div class="text-gray-900 dark:text-gray-100">{{ favourite.display_name }}</div>
|
||||
<div class="text-gray-500 dark:text-gray-400 text-sm">{{ formatDestinationHash(favourite.destination_hash) }}</div>
|
||||
</div>
|
||||
<div class="ml-auto my-auto">
|
||||
<DropDownMenu>
|
||||
<template v-slot:button>
|
||||
<IconButton class="bg-transparent dark:bg-transparent">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-5">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5ZM12 12.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5ZM12 18.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5Z" />
|
||||
</svg>
|
||||
</IconButton>
|
||||
</template>
|
||||
<template v-slot:items>
|
||||
|
||||
<!-- rename button -->
|
||||
<DropDownMenuItem @click="onRenameFavourite(favourite)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-5">
|
||||
<path fill-rule="evenodd" d="M5.25 2.25a3 3 0 0 0-3 3v4.318a3 3 0 0 0 .879 2.121l9.58 9.581c.92.92 2.39 1.186 3.548.428a18.849 18.849 0 0 0 5.441-5.44c.758-1.16.492-2.629-.428-3.548l-9.58-9.581a3 3 0 0 0-2.122-.879H5.25ZM6.375 7.5a1.125 1.125 0 1 0 0-2.25 1.125 1.125 0 0 0 0 2.25Z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
<span>Rename Favourite</span>
|
||||
</DropDownMenuItem>
|
||||
|
||||
<!-- remove favourite button -->
|
||||
<div>
|
||||
<DropDownMenuItem @click="onRemoveFavourite(favourite)">
|
||||
<svg class="size-5 text-red-500" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 0 0 6 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 1 0 .23 1.482l.149-.022.841 10.518A2.75 2.75 0 0 0 7.596 19h4.807a2.75 2.75 0 0 0 2.742-2.53l.841-10.52.149.023a.75.75 0 0 0 .23-1.482A41.03 41.03 0 0 0 14 4.193V3.75A2.75 2.75 0 0 0 11.25 1h-2.5ZM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4ZM8.58 7.72a.75.75 0 0 0-1.5.06l.3 7.5a.75.75 0 1 0 1.5-.06l-.3-7.5Zm4.34.06a.75.75 0 1 0-1.5-.06l-.3 7.5a.75.75 0 1 0 1.5.06l.3-7.5Z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
<span class="text-red-500">Remove Favourite</span>
|
||||
</DropDownMenuItem>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</DropDownMenu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="mx-auto my-auto text-center leading-5">
|
||||
|
|
@ -127,10 +159,13 @@
|
|||
|
||||
import Utils from "../../js/Utils";
|
||||
import MaterialDesignIcon from "../MaterialDesignIcon.vue";
|
||||
import DropDownMenu from "../DropDownMenu.vue";
|
||||
import IconButton from "../IconButton.vue";
|
||||
import DropDownMenuItem from "../DropDownMenuItem.vue";
|
||||
|
||||
export default {
|
||||
name: 'NomadNetworkSidebar',
|
||||
components: {MaterialDesignIcon},
|
||||
components: {DropDownMenuItem, IconButton, DropDownMenu, MaterialDesignIcon},
|
||||
props: {
|
||||
nodes: Object,
|
||||
favourites: Array,
|
||||
|
|
@ -150,6 +185,12 @@ export default {
|
|||
onFavouriteClick(favourite) {
|
||||
this.onNodeClick(favourite);
|
||||
},
|
||||
onRenameFavourite(favourite) {
|
||||
this.$emit("rename-favourite", favourite);
|
||||
},
|
||||
onRemoveFavourite(favourite) {
|
||||
this.$emit("remove-favourite", favourite);
|
||||
},
|
||||
formatTimeAgo: function(datetimeString) {
|
||||
return Utils.formatTimeAgo(datetimeString);
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue