David Maxiviper117

description
Code Issue Investigator (Analysis & Reporting Only)

You are a Code Issue Investigator agent—your mission is to autonomously diagnose and analyze any code problem the user describes, using all available tools, but without making any code edits. Instead, you will investigate, identify issues, and report potential solutions or next steps.

Continue iterating until you have a clear, thorough diagnostic report addressing the root cause, then summarize your findings. Do not apply fixes—only analyze and recommend.

Workflow

Laravel Blade Organization Patterns

1. Layout Inheritance

resources/views/layouts/app.blade.php

<!doctype html>
<html>

🎨 Primary Color Roles

Role	Description	Typical Use Cases
`Primary`	The main brand or theme color. Highly visible and dominant in the UI.	Filled buttons, active states, top app bar, tabs
`On Primary`	Color used for text and icons on top of Primary. Ensures legibility.	Text inside filled buttons, icons on colored bars
`Primary Container`	A softer, often lighter version of Primary used for containers.	Background for cards, dialogs, or selected UI elements
`On Primary Container`	Color for text/icons on top of Primary Container.	Headings, text, and icons in primary-colored containers

Cache Class with Automatic Cleanup

This guide demonstrates how to use an updated Cache class in your Node.js or TypeScript projects. The class includes a Time-to-Live (TTL) mechanism for cache entries, automatic cleanup of expired items, and a method to stop the cleanup process when needed.

1. Cache Class Code

Copy the following code into a file (e.g., Cache.ts):

export class Cache<T> {

Guide: Implementing CSRF Protection in SvelteKit

Cross-Site Request Forgery (CSRF) is a security vulnerability where an attacker tricks users into submitting unintended requests. This guide will show you how to implement CSRF protection in your SvelteKit app using a server hook.

Step 1: Configure SvelteKit to Allow Custom CSRF Handling

By default, SvelteKit has built-in CSRF protection that checks the request’s origin. Since we are implementing our own CSRF middleware, we must disable SvelteKit’s built-in CSRF origin check.

Open your svelte.config.ts (or svelte.config.js) and update it like this:

CSRF Token Setup Using Root Layout’s Server Load Function

This guide shows you how to generate a CSRF token once in your root layout so that every page automatically receives the token, reducing duplication and ensuring consistency across your SvelteKit app.

1. Generate and Store the CSRF Token in `+layout.server.ts`

Create (or update) your root layout server file (+layout.server.ts) to check for an existing CSRF token in cookies. If not present, generate a new token using Node’s crypto module and set it in a cookie:

	{
	"PHP Public Function": {
	"prefix": "p-func-public",
	"body": [
	"public function ${1:functionName}(${2:parameters})",
	"{",
	"\t${3:// function body}",
	"}"
	],
	"description": "Create a public function"

	# List the NAMES of the environment variables you want to pick up
	$envVarNames = @(
	'PHP83',
	'PHP84',
	'NODEJS_HOME'
	)

	# Wrap the existing PATH once for a fast “contains” check
	$wrappedPath = ';' + ($env:PATH.TrimEnd(';')) + ';'

	FROM php:8.4.5-fpm

	# Update package list and install dependencies
	RUN apt-get update && apt-get install -y \
	#-- Needed only for compiling native PHP extensions
	build-essential \
	#-- Required for gd extension
	libpng-dev \
	#-- Required for gd extension
	libjpeg-dev \

	/**
	* Defer animations for elements that are not initially in view.
	* It removes animation classes starting with "animate-" from elements that are not visible,
	* stores those classes, and re-applies them when the element scrolls into the viewport.
	*/
	export function deferAnimations() {
	// Helper to check if an element is in the viewport
	function isInViewport(el: HTMLElement): boolean {
	const rect = el.getBoundingClientRect();
	return rect.bottom > 0 && rect.top < window.innerHeight;