feat: 5263 - configurable jwt expiration

src/lib/actions/analytics.ts

@@ -156,6 +156,7 @@ export enum Submit {
  AuthPasswordDictionaryUpdate = 'submit_auth_password_dictionary_update',
  AuthPersonalDataCheckUpdate = 'submit_auth_personal_data_check_update',
  SessionsLengthUpdate = 'submit_sessions_length_update',
+ JwtExpirationUpdate = 'submit_jwt_expiration_update',
  SessionsLimitUpdate = 'submit_sessions_limit_update',
  SessionDelete = 'submit_session_delete',
  SessionDeleteAll = 'submit_session_delete_all',

src/routes/console/project-[project]/auth/security/+page.svelte

@@ -4,6 +4,7 @@
  import UpdatePasswordHistory from './updatePasswordHistory.svelte';
  import UpdatePersonalDataCheck from './updatePersonalDataCheck.svelte';
  import UpdateSessionLength from './updateSessionLength.svelte';
+ import UpdateJwtExpiration from './updateJwtExpiration.svelte';
  import UpdateSessionsLimit from './updateSessionsLimit.svelte';
  import UpdateUsersLimit from './updateUsersLimit.svelte';
 </script>
@@ -12,6 +13,7 @@
  <UpdateUsersLimit />
  <UpdateSessionLength />
  <UpdateSessionsLimit />
+ <UpdateJwtExpiration />
  <UpdatePasswordHistory />
  <UpdatePasswordDictionary />
  <UpdatePersonalDataCheck />

src/routes/console/project-[project]/auth/security/updateJwtExpiration.svelte

@@ -0,0 +1,62 @@
+<script lang="ts">
+ import { invalidate } from '$app/navigation';
+ import { Submit, trackError, trackEvent } from '$lib/actions/analytics';
+ import { CardGrid, Heading } from '$lib/components';
+ import { Dependencies } from '$lib/constants';
+ import { Button, InputNumber, InputSelect } from '$lib/elements/forms';
+ import { createTimeUnitPair } from '$lib/helpers/unit';
+ import { addNotification } from '$lib/stores/notifications';
+ import { sdk } from '$lib/stores/sdk';
+ import { project } from '../../store';
+
+ const projectId = $project.$id;
+ console.log('Project: ', $project);
+ const { value, unit, baseValue, units } = createTimeUnitPair($project.jwtExpiration);
+ const options = units.map((v) => ({ label: v.name, value: v.name }));
+
+ async function updateJwtExpiration() {
+ try {
+ await sdk.forConsole.projects.updateJwtExpiration(projectId, $baseValue);
+ await invalidate(Dependencies.PROJECT);
+
+ addNotification({
+ type: 'success',
+ message: 'Updated project JWT expiration successfully'
+ });
+ trackEvent(Submit.JwtExpirationUpdate);
+ } catch (error) {
+ addNotification({
+ type: 'error',
+ message: error.message
+ });
+ trackError(error, Submit.JwtExpirationUpdate);
+ }
+ }
+</script>
+
+<CardGrid>
+ <Heading tag="h2" size="7" id="session-length">JWT expiration</Heading>
+
+ <p>
+ The time limit after which a JWT becomes invalid and can no longer be used for
+ authentication or authorization purposes.
+ </p>
+ <svelte:fragment slot="aside">
+ <form class="form u-grid u-gap-16">
+ <ul class="form-list is-multiple">
+ <InputNumber id="jwt-length" label="Length" bind:value={$value} min={0} />
+ <InputSelect id="jwt-period" label="Time Period" bind:value={$unit} {options} />
+ </ul>
+ </form>
+ </svelte:fragment>
+
+ <svelte:fragment slot="actions">
+ <Button
+ disabled={$baseValue === $project.jwtExpiration}
+ on:click={() => {
+ updateJwtExpiration();
+ }}>
+ Update
+ </Button>
+ </svelte:fragment>
+</CardGrid>