Skip to content

Commit

Permalink
Merge pull request #482 from navikt/dependabot/npm_and_yarn/packages/…
Browse files Browse the repository at this point in the history 
…internarbeidsflate-decorator-v3/zustand-5.0.1

Bump zustand from 4.5.5 to 5.0.1 in /packages/internarbeidsflate-decorator-v3
  • Loading branch information
@LudvigHz
LudvigHz authored Nov 28, 2024
2 parents 55e6e8a + e8808eb commit 339847e
Show file tree
Hide file tree
Showing 10 changed files with 122 additions and 113 deletions.
Binary file modified bun.lockb
View file
Binary file not shown.
20 changes: 10 additions & 10 deletions packages/internarbeidsflate-decorator-v3/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,18 +28,18 @@
"devDependencies": {
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"@vitejs/plugin-react": "^4.3.3",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"concurrently": "^9.0.1",
"msw": "^2.6.0",
"postcss": "^8.4.47",
"concurrently": "^9.1.0",
"msw": "^2.6.6",
"postcss": "^8.4.49",
"postcss-import": "^16.1.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"tailwindcss": "^3.4.14",
"typescript": "^5.6.3",
"tailwindcss": "^3.4.15",
"typescript": "^5.7.2",
"vite": "^6.0.1",
"vitest": "^2.1.4",
"vitest": "^2.1.6",
"vitest-websocket-mock": "^0.4.0"
},
"peerDependencies": {
Expand All @@ -53,14 +53,14 @@
"@navikt/ds-tailwind": "^7.4.0",
"@navikt/ds-tokens": "^7.4.0",
"@navikt/navspa": "^6.1.3",
"@tanstack/query-core": "^5.59.16",
"@tanstack/query-core": "^5.61.5",
"classnames": "^2.5.1",
"use-sync-external-store": "^1.2.2",
"zustand": "^4.5.2"
"zustand": "^5.0.1"
},
"msw": {
"workerDirectory": [
"public"
]
}
}
}
150 changes: 76 additions & 74 deletions packages/internarbeidsflate-decorator-v3/public/mockServiceWorker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,42 +8,42 @@
* - Please do NOT serve this file on production.
*/

const PACKAGE_VERSION = '2.6.0';
const INTEGRITY_CHECKSUM = '07a8241b182f8a246a7cd39894799a9e';
const IS_MOCKED_RESPONSE = Symbol('isMockedResponse');
const activeClientIds = new Set();
const PACKAGE_VERSION = '2.6.6'
const INTEGRITY_CHECKSUM = 'ca7800994cc8bfb5eb961e037c877074'
const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
const activeClientIds = new Set()

self.addEventListener('install', function () {
self.skipWaiting();
});
self.skipWaiting()
})

self.addEventListener('activate', function (event) {
event.waitUntil(self.clients.claim());
});
event.waitUntil(self.clients.claim())
})

self.addEventListener('message', async function (event) {
const clientId = event.source.id;
const clientId = event.source.id

if (!clientId || !self.clients) {
return;
return
}

const client = await self.clients.get(clientId);
const client = await self.clients.get(clientId)

if (!client) {
return;
return
}

const allClients = await self.clients.matchAll({
type: 'window',
});
})

switch (event.data) {
case 'KEEPALIVE_REQUEST': {
sendToClient(client, {
type: 'KEEPALIVE_RESPONSE',
});
break;
})
break
}

case 'INTEGRITY_CHECK_REQUEST': {
Expand All @@ -53,12 +53,12 @@ self.addEventListener('message', async function (event) {
packageVersion: PACKAGE_VERSION,
checksum: INTEGRITY_CHECKSUM,
},
});
break;
})
break
}

case 'MOCK_ACTIVATE': {
activeClientIds.add(clientId);
activeClientIds.add(clientId)

sendToClient(client, {
type: 'MOCKING_ENABLED',
Expand All @@ -68,68 +68,68 @@ self.addEventListener('message', async function (event) {
frameType: client.frameType,
},
},
});
break;
})
break
}

case 'MOCK_DEACTIVATE': {
activeClientIds.delete(clientId);
break;
activeClientIds.delete(clientId)
break
}

case 'CLIENT_CLOSED': {
activeClientIds.delete(clientId);
activeClientIds.delete(clientId)

const remainingClients = allClients.filter((client) => {
return client.id !== clientId;
});
return client.id !== clientId
})

// Unregister itself when there are no more clients
if (remainingClients.length === 0) {
self.registration.unregister();
self.registration.unregister()
}

break;
break
}
}
});
})

self.addEventListener('fetch', function (event) {
const { request } = event;
const { request } = event

// Bypass navigation requests.
if (request.mode === 'navigate') {
return;
return
}

// Opening the DevTools triggers the "only-if-cached" request
// that cannot be handled by the worker. Bypass such requests.
if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
return;
return
}

// Bypass all requests when there are no active clients.
// Prevents the self-unregistered worked from handling requests
// after it's been deleted (still remains active until the next reload).
if (activeClientIds.size === 0) {
return;
return
}

// Generate unique request ID.
const requestId = crypto.randomUUID();
event.respondWith(handleRequest(event, requestId));
});
const requestId = crypto.randomUUID()
event.respondWith(handleRequest(event, requestId))
})

async function handleRequest(event, requestId) {
const client = await resolveMainClient(event);
const response = await getResponse(event, client, requestId);
const client = await resolveMainClient(event)
const response = await getResponse(event, client, requestId)

// Send back the response clone for the "response:*" life-cycle events.
// Ensure MSW is active and ready to handle the message, otherwise
// this message will pend indefinitely.
if (client && activeClientIds.has(client.id)) {
(async function () {
const responseClone = response.clone();
;(async function () {
const responseClone = response.clone()

sendToClient(
client,
Expand All @@ -146,77 +146,79 @@ async function handleRequest(event, requestId) {
},
},
[responseClone.body],
);
})();
)
})()
}

return response;
return response
}

// Resolve the main client for the given event.
// Client that issues a request doesn't necessarily equal the client
// that registered the worker. It's with the latter the worker should
// communicate with during the response resolving phase.
async function resolveMainClient(event) {
const client = await self.clients.get(event.clientId);
const client = await self.clients.get(event.clientId)

if (activeClientIds.has(event.clientId)) {
return client;
return client
}

if (client?.frameType === 'top-level') {
return client;
return client
}

const allClients = await self.clients.matchAll({
type: 'window',
});
})

return allClients
.filter((client) => {
// Get only those clients that are currently visible.
return client.visibilityState === 'visible';
return client.visibilityState === 'visible'
})
.find((client) => {
// Find the client ID that's recorded in the
// set of clients that have registered the worker.
return activeClientIds.has(client.id);
});
return activeClientIds.has(client.id)
})
}

async function getResponse(event, client, requestId) {
const { request } = event;
const { request } = event

// Clone the request because it might've been already used
// (i.e. its body has been read and sent to the client).
const requestClone = request.clone();
const requestClone = request.clone()

function passthrough() {
const headers = Object.fromEntries(requestClone.headers.entries());
// Cast the request headers to a new Headers instance
// so the headers can be manipulated with.
const headers = new Headers(requestClone.headers)

// Remove internal MSW request header so the passthrough request
// complies with any potential CORS preflight checks on the server.
// Some servers forbid unknown request headers.
delete headers['x-msw-intention'];
// Remove the "accept" header value that marked this request as passthrough.
// This prevents request alteration and also keeps it compliant with the
// user-defined CORS policies.
headers.delete('accept', 'msw/passthrough')

return fetch(requestClone, { headers });
return fetch(requestClone, { headers })
}

// Bypass mocking when the client is not active.
if (!client) {
return passthrough();
return passthrough()
}

// Bypass initial page load requests (i.e. static assets).
// The absence of the immediate/parent client in the map of the active clients
// means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
// and is not ready to handle requests.
if (!activeClientIds.has(client.id)) {
return passthrough();
return passthrough()
}

// Notify the client that a request has been intercepted.
const requestBuffer = await request.arrayBuffer();
const requestBuffer = await request.arrayBuffer()
const clientMessage = await sendToClient(
client,
{
Expand All @@ -239,38 +241,38 @@ async function getResponse(event, client, requestId) {
},
},
[requestBuffer],
);
)

switch (clientMessage.type) {
case 'MOCK_RESPONSE': {
return respondWithMock(clientMessage.data);
return respondWithMock(clientMessage.data)
}

case 'PASSTHROUGH': {
return passthrough();
return passthrough()
}
}

return passthrough();
return passthrough()
}

function sendToClient(client, message, transferrables = []) {
return new Promise((resolve, reject) => {
const channel = new MessageChannel();
const channel = new MessageChannel()

channel.port1.onmessage = (event) => {
if (event.data && event.data.error) {
return reject(event.data.error);
return reject(event.data.error)
}

resolve(event.data);
};
resolve(event.data)
}

client.postMessage(
message,
[channel.port2].concat(transferrables.filter(Boolean)),
);
});
)
})
}

async function respondWithMock(response) {
Expand All @@ -279,15 +281,15 @@ async function respondWithMock(response) {
// instance will have status code set to 0. Since it's not possible to create
// a Response instance with status code 0, handle that use-case separately.
if (response.status === 0) {
return Response.error();
return Response.error()
}

const mockedResponse = new Response(response.body, response);
const mockedResponse = new Response(response.body, response)

Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
value: true,
enumerable: true,
});
})

return mockedResponse;
return mockedResponse
}
12 changes: 8 additions & 4 deletions packages/internarbeidsflate-decorator-v3/src/components/EnhetVelger.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,16 @@ import React, { ChangeEvent, useMemo } from 'react';
import { Select } from '@navikt/ds-react';
import StoreHandler from '../store/StoreHandler';
import { useAppState } from '../states/AppState';
import { useShallow } from 'zustand/shallow';

const EnhetVelger: React.FC = () => {
const { enheter, enhetId } = StoreHandler.store((state) => ({
enheter: state.veileder?.enheter,
enhetId: state.enhet.value,
}));
const useStore = useMemo(() => StoreHandler.getStore(), []);
const { enheter, enhetId } = useStore(
useShallow((state) => ({
enheter: state.veileder?.enheter,
enhetId: state.enhet.value,
})),
);
const showEnheter = useAppState((state) => state.showEnheter);

const options: React.JSX.Element[] = useMemo(() => {
Expand Down
Loading

0 comments on commit 339847e

Please sign in to comment.