JSFiddle - React, Tailwind, and code Playground

HTML

<li class="menu-item">
  <a href="#" class="active">
    <span>Posts</span>
  </a>
  <ul class="sub-menu">
    <li><a href="#">Ver Posts</a></li>
    <li><a href="#">Novo Post</a></li>
  </ul>
</li>

JavaScript

$(document).ready(function() {
  var activeIndex = localStorage.getItem("activeDiv");
    
  if (JSON.parse(activeIndex) == 'true') {
    $('.sub-menu').show();
  } else {
    $('.sub-menu').hide();
  }
})

$(".menu-item > a").click(function() {
  
//Se sub-menu estiver aberto, esconde e passa 'false' para 'activeDiv'  
  if ($(this).next().is(":visible")) {
    $(".sub-menu").slideUp();
    localStorage.setItem("activeDiv", JSON.stringify('false'));
  }
 
 //Se sub-menu estiver escondido, abre e passa 'true' para 'activeDiv'
  if (!$(this).next().is(":visible")) {
    $(this).next().slideDown();
    localStorage.setItem("activeDiv", JSON.stringify('true'));
  }

  $('.active').removeClass('active');
  $(this).addClass('active');

});