Persist and restore selected project and environment across page reloads

- Add refreshOrganization/refreshProject/refreshEnvironment to context store — update value and localStorage without clearing child selections
- OrgSelector: use refreshOrganization when same org is already stored, preventing the chain that was clearing project and environment
- ProjectSelector: watch org ID (not object ref) so refresh doesn't retrigger; add autoSelectProject to restore stored project or auto-select single project
- EnvironmentTabBar: watch project ID; skip env-clear on initial mount; add autoSelectEnvironment to restore stored env or fall back to first
- Fix test fixtures missing isPrimary field; update EnvironmentTabBar tests to match v-select implementation; add tests for restore behavior

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-11 11:26:19 -07:00
parent 0531e1943f
commit c0a1f4d194
22 changed files with 251 additions and 71 deletions

View File

@@ -3,7 +3,7 @@ import { setActivePinia, createPinia } from 'pinia';
import { useContextStore } from '@/stores/context';
import type { OrganizationResponse, ProjectResponse, EnvironmentResponse } from '@/types/api';
const mockOrg: OrganizationResponse = { id: 1, name: 'Acme', createdAt: '2026-01-01T00:00:00Z' };
const mockOrg: OrganizationResponse = { id: 1, name: 'Acme', createdAt: '2026-01-01T00:00:00Z', isPrimary: false };
const mockProject: ProjectResponse = {
id: 10,
name: 'Website',
@@ -119,6 +119,57 @@ describe('useContextStore', () => {
});
});
describe('WhenRefreshOrganizationIsCalled', () => {
it('ThenOrgIsUpdatedWithoutClearingProjectOrEnvironment', () => {
const store = useContextStore();
store.setOrganization(mockOrg);
store.setProject(mockProject);
store.setEnvironment(mockEnv);
const updatedOrg = { ...mockOrg, name: 'Acme Updated' };
store.refreshOrganization(updatedOrg);
expect(store.currentOrganization).toEqual(updatedOrg);
expect(store.currentProject).toEqual(mockProject);
expect(store.currentEnvironment).toEqual(mockEnv);
});
it('ThenOrgIsPersistedToLocalStorage', () => {
const store = useContextStore();
const updatedOrg = { ...mockOrg, name: 'Acme Updated' };
store.refreshOrganization(updatedOrg);
const stored = JSON.parse(localStorage.getItem('mic_ctx_organization')!);
expect(stored).toEqual(updatedOrg);
});
});
describe('WhenRefreshProjectIsCalled', () => {
it('ThenProjectIsUpdatedWithoutClearingEnvironment', () => {
const store = useContextStore();
store.setProject(mockProject);
store.setEnvironment(mockEnv);
const updatedProject = { ...mockProject, name: 'Website Updated' };
store.refreshProject(updatedProject);
expect(store.currentProject).toEqual(updatedProject);
expect(store.currentEnvironment).toEqual(mockEnv);
});
});
describe('WhenRefreshEnvironmentIsCalled', () => {
it('ThenEnvironmentIsUpdatedAndPersisted', () => {
const store = useContextStore();
const updatedEnv = { ...mockEnv, name: 'Production Updated' };
store.refreshEnvironment(updatedEnv);
expect(store.currentEnvironment).toEqual(updatedEnv);
const stored = JSON.parse(localStorage.getItem('mic_ctx_environment')!);
expect(stored).toEqual(updatedEnv);
});
});
describe('WhenClearContextIsCalled', () => {
it('ThenAllContextIsRemovedFromStateAndStorage', () => {
const store = useContextStore();