sirtimbly/bewcloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Optionally skip domain in cookie (#43)

Browse Source 
If you're using a reverse proxy like Cloudflare Tunnels, you can now set `CONFIG_SKIP_COOKIE_DOMAIN_SECURITY="true"` to avoid login issues.

Also makes some UX tweaks to Expenses, and fixes a style issue for Chrome in Windows (#44).

Fixes #43
Fixes #44
This commit is contained in:
Bruno Bernardino
2025-03-02 07:24:28 +00:00
parent 07bbfbb0a5
commit 05c20ec0a2
6 changed files with 43 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.env.sample
View File

@@ -19,3 +19,4 @@ CONFIG_FILES_ROOT_PATH="data-files"
CONFIG_ENABLE_EMAILS="false" # if true, email verification will be required for signups (using Brevo)
CONFIG_ENABLE_FOREVER_SIGNUP="true" # if true, all signups become active for 100 years
# CONFIG_ALLOWED_COOKIE_DOMAINS="example.com,example.net" # can be set to allow more than the BASE_URL's domain for session cookies
# CONFIG_SKIP_COOKIE_DOMAIN_SECURITY="true" # if true, the cookie domain will not be strictly set and checked against. This skipping slightly reduces security, but is usually necessary for reverse proxies like Cloudflare Tunnel.

18
components/expenses/BudgetModal.tsx
View File

@@ -85,13 +85,15 @@ export default function BudgetModal(
<label class='text-slate-300 block pb-1' for='budget_value'>Value</label>
<input
class='input-field'
type='text'
type='number'
name='budget_value'
id='budget_value'
value={newBudgetValue.value}
onInput={(event) => {
newBudgetValue.value = Number(event.currentTarget.value);
}}
min='0'
inputmode='decimal'
placeholder='100'
/>
</fieldset>
@@ -100,7 +102,7 @@ export default function BudgetModal(
{budget
? (
<button
class='px-5 py-2 bg-slate-600 hover:bg-red-600 text-white cursor-pointer rounded-md mr-2'
class='px-5 py-2 bg-red-600 text-white cursor-pointer rounded-md mr-2 opacity-30 hover:opacity-100'
onClick={() => onClickDelete()}
>
Delete
@@ -109,16 +111,16 @@ export default function BudgetModal(
: null}
<button
class='px-5 py-2 bg-slate-600 hover:bg-slate-500 text-white cursor-pointer rounded-md mr-2'
onClick={() => onClickSave(newBudgetName.value, newBudgetMonth.value.substring(0, 7), newBudgetValue.value)}
>
{budget ? 'Update' : 'Create'}
</button>
<button
class='px-5 py-2 bg-slate-600 hover:bg-slate-500 text-white cursor-pointer rounded-md ml-2'
onClick={() => onClose()}
>
{budget ? 'Cancel' : 'Close'}
</button>
<button
class='px-5 py-2 bg-slate-700 hover:bg-slate-500 text-white cursor-pointer rounded-md ml-2'
onClick={() => onClickSave(newBudgetName.value, newBudgetMonth.value.substring(0, 7), newBudgetValue.value)}
>
{budget ? 'Update' : 'Create'}
</button>
</footer>
</section>
</>

15
components/expenses/ExpenseModal.tsx
View File

@@ -119,6 +119,7 @@ export default function ExpenseModal(
onInput={(event) => {
newExpenseCost.value = Number(event.currentTarget.value);
}}
inputmode='decimal'
placeholder='10.99'
/>
</fieldset>
@@ -222,7 +223,7 @@ export default function ExpenseModal(
{expense
? (
<button
class='px-5 py-2 bg-slate-600 hover:bg-red-600 text-white cursor-pointer rounded-md mr-2'
class='px-5 py-2 bg-red-600 text-white cursor-pointer rounded-md mr-2 opacity-30 hover:opacity-100'
onClick={() => onClickDelete()}
>
Delete
@@ -231,6 +232,12 @@ export default function ExpenseModal(
: null}
<button
class='px-5 py-2 bg-slate-600 hover:bg-slate-500 text-white cursor-pointer rounded-md mr-2'
onClick={() => onClose()}
>
{expense ? 'Cancel' : 'Close'}
</button>
<button
class='px-5 py-2 bg-slate-700 hover:bg-slate-500 text-white cursor-pointer rounded-md ml-2'
onClick={() => {
onClickSave(
newExpenseCost.value as number,
@@ -243,12 +250,6 @@ export default function ExpenseModal(
>
{expense ? 'Update' : 'Create'}
</button>
<button
class='px-5 py-2 bg-slate-600 hover:bg-slate-500 text-white cursor-pointer rounded-md ml-2'
onClick={() => onClose()}
>
{expense ? 'Cancel' : 'Close'}
</button>
</footer>
</section>
</>

14
lib/auth.ts
View File

@@ -6,7 +6,7 @@ import 'std/dotenv/load.ts';
import { baseUrl, generateHash, isRunningLocally } from './utils/misc.ts';
import { User, UserSession } from './types.ts';
import { createUserSession, deleteUserSession, getUserByEmail, validateUserAndSession } from './data/user.ts';
import { isCookieDomainAllowed } from './config.ts';
import { isCookieDomainAllowed, isCookieDomainSecurityDisabled } from './config.ts';
const JWT_SECRET = Deno.env.get('JWT_SECRET') || '';
export const PASSWORD_SALT = Deno.env.get('PASSWORD_SALT') || '';
@@ -173,6 +173,10 @@ export async function logoutUser(request: Request) {
domain: resolveCookieDomain(request),
};
if (isCookieDomainSecurityDisabled()) {
delete cookie.domain;
}
const response = new Response('Logged Out', {
status: 303,
headers: { 'Location': '/', 'Content-Type': 'text/html; charset=utf-8' },
@@ -222,6 +226,10 @@ export async function createSessionCookie(
domain: resolveCookieDomain(request),
};
if (isCookieDomainSecurityDisabled()) {
delete cookie.domain;
}
setCookie(response.headers, cookie);
return response;
@@ -246,6 +254,10 @@ export async function updateSessionCookie(
domain: resolveCookieDomain(request),
};
if (isCookieDomainSecurityDisabled()) {
delete cookie.domain;
}
setCookie(response.headers, cookie);
return response;

6
lib/config.ts
View File

@@ -30,6 +30,12 @@ export function isCookieDomainAllowed(domain: string) {
return allowedDomains.includes(domain);
}
export function isCookieDomainSecurityDisabled() {
const isCookieDomainSecurityDisabled = Deno.env.get('CONFIG_SKIP_COOKIE_DOMAIN_SECURITY') === 'true';
return isCookieDomainSecurityDisabled;
}
export function isEmailEnabled() {
const areEmailsAllowed = Deno.env.get('CONFIG_ENABLE_EMAILS') === 'true';

5
static/styles.css
View File

@@ -2,6 +2,11 @@
@tailwind components;
@tailwind utilities;
html {
/* This is needed to ensure that the system color scheme is dark and matches the dark theme of the app */
color-scheme: dark;
}
h1 {
@apply text-4xl font-bold;
}