<turbo-stream action="update" target="social_header"><template>
  <div class="card-header border-0 p-0 p-lg-3 mb-3 mb-lg-0 position-relative">
  <div class="row align-items-center justify-content-between">
    <div class="col-lg-4 col-12 d-none d-lg-block">
      <h6 class="card-title text-gradient-blue d-inline-flex mb-0">Social Feed</h6>
    </div>
    <div class="col-lg-8 col-12 mobile-searchbar">
      <turbo-frame id="post_filter">
  <form data-controller="form-validation post form-activity" action="/social/posts/filter" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="i-rNN0SyhNRQDtv4VhLTmWBNOEAdpS1Dbz3zI-yBEXcHd1U7AqjfeeYy4NlLczqZ3AU5V86_zbr5AnJBhyN7ug" />
    <input type="hidden" name="username" id="username" value="dmdb-inc" />
    
    <div class="d-flex align-items-center justify-content-between gap-3">
      <div class="position-relative w-100">
        <div class="w-100 position-relative card-border d-flex align-items-center justify-content-start rounded-5 overflow-hidden   max-w-420px">
  <div class="h-100 bg-transparent border-0 p-3 d-flex align-items-center justify-content-center mail-search-icon">
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M11.5 21C16.7467 21 21 16.7467 21 11.5C21 6.25329 16.7467 2 11.5 2C6.25329 2 2 6.25329 2 11.5C2 16.7467 6.25329 21 11.5 21Z" stroke="var(--white)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
      <path d="M22 22L20 20" stroke="var(--white)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
    </svg>
  </div>
  <input type="search" name="description" id="description" class="border-0 bg-transparent filled-bg-none p-3 ps-0 pe-6 w-100 " placeholder="Search" aria-label="Search" data-action="input-&gt;post#searchPost" />
  <div class="position-absolute align-items-center justify-content-center px-3 top-0 end-0 h-100 bg-transparent d-none" id="mail-search-loader">
    <div class="cv-spinner d-flex align-items-center justify-content-center h-100">
      <span class="spinner-border text-primary" style="width: 1.2rem; height: 1.2rem;"></span>
    </div>
  </div>
  <span class="position-absolute end-0 top-0 h-100 d-flex align-items-center px-3 cursor-pointer d-none " data-action="click-&gt;post#clear" id="close_icon">
    <span class="fa fa-times fs-18 text-white fw-normal" aria-hidden="true"></span>
</span></div>

      </div>
      <div class="menu-options social-filter">
        <div class="dropdown dropdown-center">
          <button type="button" class="btn card-border rounded-circle border-3 p-3" id="post-filter-dropdown" data-bs-toggle="dropdown" data-action="click->post#toggleDropDown" aria-expanded="false" data-bs-auto-close="outside">
            <img src="https://www.dmdb.com/assets/svgs/filter-a0810f98a1f5e04532a8b76da130807b8907624ed00230ab3d38908cef4a2a92.svg" />
          </button>
          <div class="dropdown-menu dropdown-menu-end end-0 p-0" aria-labelledby="post-filter-dropdown">
            <div class="card-border rounded-3 post-filter-without-news post-filter-box d-flex flex-column gap-3 align-items-start justify-content-start p-3">
              <h6 class="form-label mb-0 fw-normal fs-16">Sort by</h6>
              <div class="d-grid grid-cols-2 grid-cols-sm-1 gap-2 gap-sm-3">
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_new_to_old" type="radio" value="new_to_old" checked="checked" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_new_to_old">
                      Newest to Oldest
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_old_to_new" type="radio" value="old_to_new" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_old_to_new">
                      Oldest to Newest
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_most_likes" type="radio" value="most_likes" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_most_likes">
                      Most Likes
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_most_views" type="radio" value="most_views" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_most_views">
                      Most Views
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_most_comments" type="radio" value="most_comments" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_most_comments">
                      Most Comments
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_most_saves" type="radio" value="most_saves" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_most_saves">
                      Most Saves
                    </label>
                  </div>
                  <div class="form-check d-flex align-items-center justify-content-start gap-2 m-0 p-0 w-100">
                    <input class="form-check-input flex-shrink-0 m-0" id="post_filter_sorting_most_reposts" type="radio" value="most_reposts" name="sorting" />
                    <label class="form-check-label fs-16 w-100" for="post_filter_sorting_most_reposts">
                      Most Reposts
                    </label>
                  </div>
              </div>
              <div class="w-100 h-px border-bottom"></div>
              <div class="w-100">
                <label class="form-label" for="hash_tag">Search by Hashtag</label>
                <div class="position-relative">
                  <div class="position-absolute h-100 d-flex align-items-center ms-3 w-30px">
                    <svg width="24" height="24" viewBox="0 0 24 24" class="w-xxl-100 w-xl-100 w-lg-100 w-md-75 w-75" fill="none" xmlns="http://www.w3.org/2000/svg">
  <path d="M11.5 21C16.7467 21 21 16.7467 21 11.5C21 6.25329 16.7467 2 11.5 2C6.25329 2 2 6.25329 2 11.5C2 16.7467 6.25329 21 11.5 21Z" stroke="var(--white)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
  <path d="M22 22L20 20" stroke="var(--white)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>

                  </div>
                  <input class="form-control rounded-5 ps-8" placeholder="Enter hashtag, e.g. #music" type="text" name="hash_tag" id="hash_tag" />
                  <input type="hidden" name="search" id="search" value="true" />
                </div>
              </div>
              <div class="w-100 h-px border-bottom"></div>
              <div class="w-100">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input name="post_date_range" type="hidden" value="0" /><input class="form-check-input m-0" id="post_date_range" data-action="change-&gt;post#toggleDateRange" type="checkbox" value="1" name="post_date_range" />
                  <label class="form-check-label text-gray" for="post_date_range">Date Range</label>
                </div>
                <div class="date-range-block d-flex flex-column align-items-start gap-2 w-100 d-none mt-3" data-post-target="dateRangeBlock">
                  <div class="w-100">
                    <label class="form-label required" for="date_range_from">From</label>
                    <div class="d-flex align-items-start justify-content-start gap-3">
                      <div class="flatpickr-container position-relative w-100">
  <label class="cursor-pointer d-block" for="date_range_from">
    <input class="date-range-from" placeholder="Enter Start date" data-click-opens="false" data-mask-target="date" data-action="change-&gt;post#selectStartDate" data-max-date="today" data-min-date="&quot;1916-04-05&quot;" data-post-target="dateRangeFrom" data-controller="flatpickr mask" type="text" name="date_range_from" id="date_range_from" />
    <span class="bg-transparent border-0 position-absolute p-3 top-0 end-0 text-gradient-pink d-flex align-items-center justify-content-center">
      <svg class="text-white" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path d="M8 2V4.9985M16 2V4.9985M20.75 17.5922H3.25M11.9064 10.1732C10.8535 10.1732 10 11.0263 10 12.0786C10 13.1309 10.8535 13.984 11.9064 13.984C12.9592 13.984 13.8127 13.1309 13.8127 12.0786C13.8127 11.0263 12.9592 10.1732 11.9064 10.1732ZM11.9064 10.1732C12.7837 10.1732 13.495 9.46228 13.495 8.58534C13.495 7.7084 12.7837 6.9975 11.9064 6.9975C11.029 6.9975 10.3177 7.7084 10.3177 8.58534C10.3177 9.46228 11.029 10.1732 11.9064 10.1732ZM16 3.49925C19.33 3.67916 21 4.94853 21 9.64618V15.8231C21 19.941 20 22 15 22H9C4 22 3 19.941 3 15.8231V9.64618C3 4.94853 4.67 3.68916 8 3.49925H16Z" stroke="#AE8A27" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
      </svg>
    </span>
</label></div>
                    </div>
                  </div>
                  <div class="w-100">
                    <label class="form-label required" for="date_range_to">To</label>
                    <div class="d-flex align-items-start justify-content-start gap-3">
                      <div class="flatpickr-container position-relative w-100">
  <label class="cursor-pointer d-block" for="date_range_to">
    <input class="date-range-to" placeholder="Enter End date" data-click-opens="false" data-mask-target="date" data-max-date="today" data-min-date="&quot;1916-04-05&quot;" data-post-target="dateRangeTo" data-controller="flatpickr mask" type="text" name="date_range_to" id="date_range_to" />
    <span class="bg-transparent border-0 position-absolute p-3 top-0 end-0 text-gradient-pink d-flex align-items-center justify-content-center">
      <svg class="text-white" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path d="M8 2V4.9985M16 2V4.9985M20.75 17.5922H3.25M11.9064 10.1732C10.8535 10.1732 10 11.0263 10 12.0786C10 13.1309 10.8535 13.984 11.9064 13.984C12.9592 13.984 13.8127 13.1309 13.8127 12.0786C13.8127 11.0263 12.9592 10.1732 11.9064 10.1732ZM11.9064 10.1732C12.7837 10.1732 13.495 9.46228 13.495 8.58534C13.495 7.7084 12.7837 6.9975 11.9064 6.9975C11.029 6.9975 10.3177 7.7084 10.3177 8.58534C10.3177 9.46228 11.029 10.1732 11.9064 10.1732ZM16 3.49925C19.33 3.67916 21 4.94853 21 9.64618V15.8231C21 19.941 20 22 15 22H9C4 22 3 19.941 3 15.8231V9.64618C3 4.94853 4.67 3.68916 8 3.49925H16Z" stroke="#AE8A27" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
      </svg>
    </span>
</label></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="w-100 h-px border-bottom"></div>
              <div class="w-100">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input name="contain_media" type="hidden" value="0" /><input class="form-check-input m-0" type="checkbox" value="1" name="contain_media" id="contain_media" />
                  <label class="form-check-label text-gray" for="contain_media">Contains Media</label>
                </div>
              </div>
              <div class="d-flex align-items-center justify-content-center gap-2 w-100 mt-2">
                <button name="button" type="input" class="dropdown-close btn btn-gradient-pink text-dark fs-14 p-3 text-uppercase rounded-3 w-100" data-action="post#filterPost">Apply</button>
                <button name="button" type="button" class="dropdown-close btn btn-outline-gradient btn-gradient-outline-pink overlay-none fs-14 p-3 text-uppercase rounded-3 w-100" data-user="U01246555" data-api-action="user_posts" data-action="post#resetShowcaseFilter">
                  <span class="text-gradient-pink">Reset</span>
</button>              </div>
            </div>
            <div class="card-border rounded-3 m-0 p-0 add-filter-news last-child d-none" data-controller="news-post">
              <a data-turbo-stream="" class="dropdown-item border-bottom-warning overlay-none news-tab" data-action="click-&gt;news-post#displayCheckedButton" href="/users/dashboards/U01246555/news_posts?type=all">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input type="radio" class="form-check-input flex-shrink-0 m-0" id='all_news' value="" checked>
                  <label for="all_news" class="form-check-label fs-16 w-100">All</label>
                </div>
</a>              <a data-turbo-stream="" class="dropdown-item border-bottom-warning overlay-none news-tab" data-action="click-&gt;news-post#displayCheckedButton" href="/users/dashboards/U01246555/news_posts?type=credentialed_news">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input type="radio" class="form-check-input flex-shrink-0 m-0" id='credentialed_news' value="">
                  <label for="credentialed_news" class="form-check-label fs-16 w-100">Credentialed Reporter News</label>
                </div>
</a>              <a data-turbo-stream="" class="dropdown-item border-bottom-warning overlay-none news-tab" data-action="click-&gt;news-post#displayCheckedButton" href="/users/dashboards/U01246555/news_posts?type=non_credentialed_news">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input type="radio" class="form-check-input flex-shrink-0 m-0" id='non_credentialed_news' value="">
                  <label for="non_credentialed_news" class="form-check-label fs-16 w-100">Citizen Reporter News</label>
                </div>
</a>              <a data-turbo-stream="" class="dropdown-item border-bottom-warning overlay-none news-tab" data-action="click-&gt;news-post#displayCheckedButton" href="/users/dashboards/U01246555/news_posts?type=news_agency_news">
                <div class="form-check m-0 p-0 d-flex align-items-center justify-content-start gap-2">
                  <input type="radio" class="form-check-input flex-shrink-0 m-0" id='news_agency_news' value="">
                  <label for="news_agency_news" class="form-check-label fs-16 w-100">News Agencies</label>
                </div>
</a>            </div>
          </div>
        </div>
      </div>
    </div>
      <div class="text-end mt-3 d-md-none">
        <a class="ms-auto btn btn-outline-gradient btn-gradient-outline-pink rounded-2 p-2 fs-14" data-controller="turbo" data-turbo-method="GET" href="/individual_reporters/reporter_welcome">
          <span class="text-gradient-pink">Get Press Pass</span>
</a>      </div>
</form></turbo-frame><div class="d-md-none text-end">
</div>

    </div>
  </div>
</div>
</template></turbo-stream>  <turbo-stream action="update" target="all_posts_list"><template>
      <div class="text-center" data-controller='post'>
        <img class="img img-fluid" src="https://www.dmdb.com/assets/NoData-b9f5991ac643c070414f1d5a02d0349ce4f50b9df33265a69eed8ccde4b7bbac.svg" width="300" height="300" />
        <h6 class="text-white fs-18 text-gradient-blue">No posts found.</h6>
      </div>
</template></turbo-stream>

