How to stop sending "favorited" tiddlers to the bottom of the template?

, ,
#1

I am having trouble with the code for the view template below. A summary of its purpose is to display transcluded message tiddlers into one conversation tiddler. The issue is with the favoriting system I have implemented. The first time a message is favorited it is sent to the bottom of the conversation tiddler, when I want it to stay put. However, if all messages have been favorited the buttons work as intended, but this is not the proper use. Any help is appreciated!

<$vars conversation={{!!conversation_title}} conversation_index="1">

<div class="conversation-title">
<h1>{{!!conversation_title}}</h1>
</div>
 
<$macrocall $name="exportButton" 
            exportFilter=<<currentTiddler>>
            lingoBase="$:/language/Buttons/ExportTiddler/" 
            baseFilename=<<currentTiddler>>/>

<$list filter="[conversation_id{!!title}sort[created]]" counter="num">

<$details summary={{!!author}} open="yes">

<$list filter="[is[current]!favorite[true]]">
<div style="text-align: right;">
<$button class="tc-btn-invisible" tooltip="Unfavorite this message">
{{star-unfilled.png}}
<$action-setfield $tiddler=<<currentTiddler>> favorite="true"/>
</$button>
</div>
</$list>

<$list filter="[is[current]favorite[true]]">
<div style="text-align: right;">
<$button class="tc-btn-invisible" tooltip="Unfavorite this message">
{{star-filled.png}}
<$action-setfield $tiddler=<<currentTiddler>> favorite="false"/>
</$button>
</div>
</$list>

<br>
<div class="message_block">
<$transclude mode="block"/>
</div>
<div class="annotation_button">
<$macrocall $name="annotate" message-id={{!!message_id}}/>
<hr>
<i>Generated <$text text={{{ [{!!timestamp}format:date[DDth mmm YYYY 0hh:0mm:0ss]] }}}/></i><br>
Tokens: <$editor-counter field="text" mode=word/> || 
<$link/><br>

<$list filter="[timestamp{!!timestamp}chatgptelement[]nsort[timestamp]nth{!!title}]">
<$vars tiddler-title={{!!title}}>

<div class="associating image with message">
<$details summary="Associate an image with this message">

<$macrocall $name='image-picker' actions="
<$action-setfield $tiddler='$:/_MyImage' $value=<<imageTitle>>/>"/>

<$image source={{$:/_MyImage}} width="100"/>
<br>
<$button> Add {{$:/_MyImage}} to this <$link to={{!!title}}>prompt</$link>
<$action-setfield $tiddler={{$:/_MyImage}} message={{!!title}} chatgptelement="added-image"/>
</$button>

</$details>
</div>

<div class="picture in message">
<$list filter="[chatgptelement[added-image]message{!!title}]">
<div>
<$image source=<<currentTiddler>> width="100"/>
<br> <$button> Remove this <$link to=<<currentTiddler>>>image</$link> from this 
<$link to=<<tiddler-title>>>prompt</$link>
<$action-setfield message="" chatgptelement=""/>
</$button>
</div>
</$list>
</div>
</$vars>
</$list>```
#2

Do you mean:

…or I’m not quite sure I understand what you’re asking for.

And that is a very long code that you are hoping people should read to help you. Could you extract the relevant part?

P.S

  • Instead of encapsulating your buttons in divs just to apply text-align, you might instead want to add a class to the buttons, that you define somewhere (e.g in a styleblock or, properly, in a separate stylesheet tiddler).
  • <$link to={{!!title}}>prompt</$link> can be written <$link>prompt</$link> because the widget assumes the currentTiddler.
#3

Welcome @Andrew_H to the forum. I am on my mobile. A quick scan of you code suggests you are not using an appropriate sort on you lists, so you just use get a default sort order.

#4

It looks like you’re making two lists, and then you’re perplexed about why the favorites are at the bottom. But of course they will all be after the non-favorites if you have two lists, and the list of favorites comes only after the list of non-favorites…

You probably want one single list, where items in that one list (sorted by whatever you want — such as date) display certain elements differently depending on whether they’re favorites or not. To make that detail work out well, I recommend using the Conditional Shortcut Syntax to specify what buttons/actions should appear if it isn’t a favorite (<% if [<currentTiddler>!favorite[true]] %>) and then (in <% else %> section) what buttons/actions should appear if it is a favorite.

Feel free to follow up if I’m not following your situation, or if you’re unsure how to work with the conditional shortcut syntax.