Default the desktop sidebar to open

Default the desktop sidebar to open

Deploy story

What this commit did to the running system — joined from the forge receipt chain, the part a commit page elsewhere cannot show.

Not deployed through the forge lane

No push, promotion, build, or deploy receipt references this commit (receipts are scanned over a bounded recent window). Changes shipped by full node replacement carry their proof in the release gate receipt instead.

Changed files

modified lib/openagents_web/components/layouts.ex
modified test/openagents_web/sidebar_state_test.exs

Diff

2 files changed, +17 -24

          },

          updated() {
            this.applyState(this.open, {persist: false})
            this.applyState(this.open)
          },

          destroyed() {


          handleClick(event) {
            if (event.target.closest("#sidebar-toggle")) {
              this.applyState(!this.open, {persist: true, focusSidebar: !this.open})
              this.applyState(!this.open, {focusSidebar: !this.open})
              return
            }

            if (event.target.closest("#sidebar-scrim")) {
              this.applyState(false, {persist: false, restoreFocus: true})
              this.applyState(false, {restoreFocus: true})
              return
            }

            if (!this.desktop.matches && event.target.closest("#sidebar a")) {
              this.applyState(false, {persist: false})
              this.applyState(false)
            }
          },

          handleKeydown(event) {
            if (event.key === "Escape" && this.open && !this.desktop.matches) {
              this.applyState(false, {persist: false, restoreFocus: true})
              this.applyState(false, {restoreFocus: true})
            }
          },

          restoreForViewport() {
            const open = this.desktop.matches ? this.desktopPreference() : false
            this.applyState(open, {persist: false})
          },

          desktopPreference() {
            try {
              return window.localStorage.getItem("openagents:sidebar-desktop") !== "closed"
            } catch (_error) {
              return true
            }
            const open = this.desktop.matches
            this.applyState(open)
          },

          applyState(open, options = {}) {

            scrim.setAttribute("aria-hidden", open ? "false" : "true")
            document.body.classList.toggle("sidebar-open", open && !this.desktop.matches)

            if (options.persist && this.desktop.matches) {
              try {
                window.localStorage.setItem(
                  "openagents:sidebar-desktop",
                  open ? "open" : "closed"
                )
              } catch (_error) {}
            }

            if (options.focusSidebar && !this.desktop.matches) {
              window.requestAnimationFrame(() => {
                sidebar.querySelector("a, button, summary")?.focus()

    end
  end

  describe "viewport defaults" do
    test "desktop starts open and mobile starts closed without a saved browser preference" do
      source = File.read!("lib/openagents_web/components/layouts.ex")

      assert source =~ "const open = this.desktop.matches"
      refute source =~ "openagents:sidebar-desktop"
      refute source =~ "desktopPreference()"
    end
  end

  defp parse(value) do
    :get
    |> Plug.Test.conn("/")

140	140		`},`
141	141
142	142		`updated() {`
143		-	`this.applyState(this.open, {persist: false})`
	143	+	`this.applyState(this.open)`
144	144		`},`
145	145
146	146		`destroyed() {`

152	152
153	153		`handleClick(event) {`
154	154		`if (event.target.closest("#sidebar-toggle")) {`
155		-	`this.applyState(!this.open, {persist: true, focusSidebar: !this.open})`
	155	+	`this.applyState(!this.open, {focusSidebar: !this.open})`
156	156		`return`
157	157		`}`
158	158
159	159		`if (event.target.closest("#sidebar-scrim")) {`
160		-	`this.applyState(false, {persist: false, restoreFocus: true})`
	160	+	`this.applyState(false, {restoreFocus: true})`
161	161		`return`
162	162		`}`
163	163
164	164		`if (!this.desktop.matches && event.target.closest("#sidebar a")) {`
165		-	`this.applyState(false, {persist: false})`
	165	+	`this.applyState(false)`
166	166		`}`
167	167		`},`
168	168
169	169		`handleKeydown(event) {`
170	170		`if (event.key === "Escape" && this.open && !this.desktop.matches) {`
171		-	`this.applyState(false, {persist: false, restoreFocus: true})`
	171	+	`this.applyState(false, {restoreFocus: true})`
172	172		`}`
173	173		`},`
174	174
175	175		`restoreForViewport() {`
176		-	`const open = this.desktop.matches ? this.desktopPreference() : false`
177		-	`this.applyState(open, {persist: false})`
178		-	`},`
179		-
180		-	`desktopPreference() {`
181		-	`try {`
182		-	`return window.localStorage.getItem("openagents:sidebar-desktop") !== "closed"`
183		-	`} catch (_error) {`
184		-	`return true`
185		-	`}`
	176	+	`const open = this.desktop.matches`
	177	+	`this.applyState(open)`
186	178		`},`
187	179
188	180		`applyState(open, options = {}) {`

205	197		`scrim.setAttribute("aria-hidden", open ? "false" : "true")`
206	198		`document.body.classList.toggle("sidebar-open", open && !this.desktop.matches)`
207	199
208		-	`if (options.persist && this.desktop.matches) {`
209		-	`try {`
210		-	`window.localStorage.setItem(`
211		-	`"openagents:sidebar-desktop",`
212		-	`open ? "open" : "closed"`
213		-	`)`
214		-	`} catch (_error) {}`
215		-	`}`
216		-
217	200		`if (options.focusSidebar && !this.desktop.matches) {`
218	201		`window.requestAnimationFrame(() => {`
219	202		`sidebar.querySelector("a, button, summary")?.focus()`

197	197		`end`
198	198		`end`
199	199
	200	+	`describe "viewport defaults" do`
	201	+	`test "desktop starts open and mobile starts closed without a saved browser preference" do`
	202	+	`source = File.read!("lib/openagents_web/components/layouts.ex")`
	203	+
	204	+	`assert source =~ "const open = this.desktop.matches"`
	205	+	`refute source =~ "openagents:sidebar-desktop"`
	206	+	`refute source =~ "desktopPreference()"`
	207	+	`end`
	208	+	`end`
	209	+
200	210		`defp parse(value) do`
201	211		`:get`
202	212		`\|> Plug.Test.conn("/")`