<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="174178" data-post-id="174178">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="LostKobrakai" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/LostKobrakai/120/3072_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  LostKobrakai
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I’m wondering if you actually need to send the historical data separately to the frontend? The JS doesn’t really care where the data is coming from (unless it should be marked differently somehow).</p>
<aside class="quote no-group" data-username="bglusman" data-post="11" data-topic="31258">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/48/9459_2.png" class="avatar"> bglusman:</div>
<blockquote>
<p>but there’s two different <code>initialData</code> functions</p>
</blockquote>
</aside>
<p>This is because they’re for different types of charts/metrics, see the classes around them.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174178" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/12">Post #11</a>
	                </div>
	            </div>
              <div id="likers-container-174178" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174178"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #11"></div>
  </section>
</div>
    <div class="postbit" id="174230" data-post-id="174230">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I didn’t think so initially, but passing it in as data assigns doesn’t work/is ignored, perhaps because of the initialData function?  I can play around with later or you’re welcome to/I can try and package up a little app that’s using this integration to demo/play with more easily extracted from my actual app’s usage if you think useful.  I don’t think it should be marked differently, though its an interesting question, I could see perhaps wanting a marker at the dividing line, but I think that would be a future refinement if so.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174230" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/13">Post #12</a>
	                </div>
	            </div>
              <div id="likers-container-174230" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174230"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #12"></div>
  </section>
</div>
    <div class="postbit" id="174257" data-post-id="174257">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Actually, you’re right, though the way I have it working without modifying JS feels a bit dirty/maybe you have an idea for a better place, it works if I do a <code>send_update</code> immediately after the render of <code>live_component</code> like so:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">   &lt;%= if @metrics do %&gt;
      &lt;div class="phx-dashboard-metrics-grid row"&gt;
      &lt;%= for {metric, id} &lt;- @metrics do %&gt;
        &lt;%= live_component @socket, ChartComponent, id: id, metric: metric %&gt;
        &lt;% send_update(ChartComponent, id: id, data: history_for(metric, @historical_data)) %&gt;
      &lt;% end %&gt;
      &lt;/div&gt;
    &lt;% end %&gt;
</code></pre>
<p>but putting a side effect there feels a bit dirty, perhaps there’s a better hook available to call immediately after render? Dunno… but locally its working beautifully this way so that’s a start…</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174257" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/14">Post #13</a>
	                </div>
	            </div>
              <div id="likers-container-174257" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174257"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #13"></div>
  </section>
</div>
    <div class="postbit" id="174258" data-post-id="174258">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="LostKobrakai" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/LostKobrakai/120/3072_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  LostKobrakai
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I would’ve looked at doing it within mount of <code>ChartComponent</code>, so <code>data</code> is filled from the start.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174258" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/15">Post #14</a>
	                </div>
	            </div>
              <div id="likers-container-174258" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174258"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #14"></div>
  </section>
</div>
    <div class="postbit" id="174259" data-post-id="174259">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>oh yeah that makes more sense <img src="https://forum.elixirforum.com/images/emoji/apple/upside_down_face.png?v=15" title=":upside_down_face:" class="emoji" alt=":upside_down_face:" loading="lazy" width="20" height="20"> I’ll try that now, thanks!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174259" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/16">Post #15</a>
	                </div>
	            </div>
              <div id="likers-container-174259" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174259"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #15"></div>
  </section>
</div>
    <div class="postbit" id="174261" data-post-id="174261">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hmm, but I dont have access to the assigns in ChartComponent mount, I thought maybe they were in the socket on socket.assigns but that just has flash and myself at mount…</p>
<p>In any case, working version is pushed up, may try and refactor from there to use mount and/or add some tests or something but still welcome code reviews from anyone following this before I open PR, to both save José and company time and also increase chance of it being accepted!</p>
<p>Link again is <a href="https://github.com/bglusman/phoenix_live_dashboard/tree/historical_data" class="inline-onebox" rel="noopener nofollow ugc">GitHub - bglusman/phoenix_live_dashboard at historical_data · GitHub</a> I’ll open a PR into my master branch if I can to avoid bothering the main project until ready but allow code review…</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174261" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/17">Post #16</a>
	                </div>
	            </div>
              <div id="likers-container-174261" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174261"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #16"></div>
  </section>
</div>
    <div class="postbit" id="174297" data-post-id="174297">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Found a small improvement noticing that live_component accepts a do block, so can add a do block and call my send_update there and that works well enough… if I don’t hear ideas from anyone else I think I’ll accept that as reasonable place to do after-render work for a live component, since it is designed to take that block…</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174297" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/18">Post #17</a>
	                </div>
	            </div>
              <div id="likers-container-174297" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174297"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #17"></div>
  </section>
</div>
    <div class="postbit" id="174351" data-post-id="174351">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>OK official PR is open now, added tests and more docs, hopefully its up to snuff but for anyone interested <a href="https://github.com/phoenixframework/phoenix_live_dashboard/pull/122" class="inline-onebox" rel="noopener nofollow ugc">Historical data configuration hook by bglusman · Pull Request #122 · phoenixframework/phoenix_live_dashboard · GitHub</a></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174351" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/19">Post #18</a>
	                </div>
	            </div>
              <div id="likers-container-174351" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174351"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #18"></div>
  </section>
</div>
    <div class="postbit" id="174865" data-post-id="174865">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="bglusman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/120/9459_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  bglusman
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>So over the weekend Jose reviewed the PR and then closed it with some more feedback around some cases I hadn’t considered (I also may have gotten on his badside with some confusion/ignorance about Github alerts etc <img src="https://forum.elixirforum.com/images/emoji/apple/frowning.png?v=15" title=":frowning:" class="emoji" alt=":frowning:" loading="lazy" width="20" height="20"> , but ahh well, live and learn…).  If anyone is using LiveDashboard with more complex metric types, tags and explicit units etc that they might like to enable history for, please let me know, as I don’t have any of these myself so I’d be making up fictitious use to try and cover the edge cases he mentions…  I think the main points he raises can be handled by just passing the entire metric to the callback instead of just passing the name, but if I’m reading his comments correctly the larger issue is reworking the guide/example implementation I provided to handle those other situations with good documentation and understanding when the user might not want to play back certain events from history (this part didn’t make a ton of sense to me/maybe :telemetry_poller is already saving up some events for later playback or there’s some other side effect I’m missing?).</p>
<p><a class="mention" href="/u/lostkobrakai" rel="nofollow">@LostKobrakai</a>  if you have any interest or bandwidth to discuss/weigh in on above, or <a class="mention" href="/u/axelson" rel="nofollow">@axelson</a> <a class="mention" href="/u/fhunleth" rel="nofollow">@fhunleth</a> or <a class="mention" href="/u/sfusato" rel="nofollow">@sfusato</a> since you all expressed interest (apologies if I’m failing/breaking any kind of etiquette by @'ing you guys here, no obligation to respond, apparently I’m clueless how to internet about these things <img src="https://forum.elixirforum.com/images/emoji/apple/upside_down_face.png?v=15" title=":upside_down_face:" class="emoji" alt=":upside_down_face:" loading="lazy" width="20" height="20"> ), or anyone else who has ability/desire to perhaps run my fork locally or in production and help refine the other kinds of charts/metrics José brings up to help solidify implementation and docs, contact me here or email me at brian@ my last name .me</p>
<p>(I pushed up the minimal changes I understand from José’s feedback into code and docs, but looking for further understanding from others on both!)</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174865" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/20">Post #19</a>
	                </div>
	            </div>
              <div id="likers-container-174865" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174865"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #19"></div>
  </section>
</div>
    <div class="postbit" id="174883" data-post-id="174883">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="LostKobrakai" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/LostKobrakai/120/3072_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  LostKobrakai
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="bglusman" data-post="20" data-topic="31258">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/48/9459_2.png" class="avatar"> bglusman:</div>
<blockquote>
<p>this part didn’t make a ton of sense to me/maybe :telemetry_poller is already saving up some events for later playback or there’s some other side effect I’m missing?</p>
</blockquote>
</aside>
<p>Telemetry poller is not saving any events. It periodically triggers the emission of certain telemetry events, which are not triggered by explicit actions, like e.g. current memory usage.</p>
<aside class="quote no-group" data-username="bglusman" data-post="20" data-topic="31258">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bglusman/48/9459_2.png" class="avatar"> bglusman:</div>
<blockquote>
<p>If anyone is using LiveDashboard with more complex metric types, tags and explicit units etc that they might like to enable history for, please let me know, as I don’t have any of these myself so I’d be making up fictitious use to try and cover the edge cases he mentions…</p>
</blockquote>
</aside>
<p>One thing I did when testing the charting was just hit the endpoint with a load testing tool. This will quickly bring stress to your system and fill up your metrics cache. The complexity here lies in the details. Events might be quite big (which is not a problem for just dispatching, but might when kept around). Short bursts to the system will fill up any timebased solution to extends maybe not accounted. Generally keeping much data around in memory can be problematic (see the topic on tz_world here on the forum), you don’t want to bring an application to crash for OOM reasons. Then there’s – as correctly noted - the problem of many metrics for the same base event.</p>
<p>I guess Jose’s point is that those are best solved first before thinking about best hooking the result into live_dashboard.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="174883" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/allow-hook-for-livedashboard-historical-data-at-client-connection/31258/21">Post #20</a>
	                </div>
	            </div>
              <div id="likers-container-174883" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="174883"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #20"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <a class="load-more-button" data-turbo-stream="true" href="/topics/31258/load_more?page=3">Load more posts (3 remaining)</a>
</div></template></turbo-stream>