Marwan Shehata MarwanShehata

🎯

"Luck is what happens when preparation meets opportunity.", Seneca

14 followers · 96 following

View GitHub Profile

Recently created

Least recently created

Recently updated

Least recently updated

MarwanShehata / ts-decorator-component.ts

Last active April 4, 2025 18:45

This snippet demonstrates how to use a custom class decorator in TypeScript to dynamically enhance a class by adding new properties and methods. The `@Component` decorator injects a `uniqueID` and an `insertInDOM` method into the target class, showc

	// TS Decorators

	function Component(constructor: Function) {
	// here we can do something like add/modify/enhance/delete properties from class methods
	constructor.prototype.uniqueID = Math.random();
	constructor.prototype.insertInDOM = () => {
	console.log(`Inserting component in DOM`);
	};
	}

MarwanShehata / exhaustive-switch-never.ts

Last active April 2, 2025 15:38

This ensures that if a new kind is added to the Animals type and isn't handled in the switch, TypeScript will catch it as a type error at compile time. 🚀

	// type `never` is great for exhaustive checking, great for exhaustive switch statements
	type Bird = {
	kind: 'bird'
	legs: number
	wings: 2
	}
	type Dog = {
	kind: 'dog'
	legs: number
	}

MarwanShehata / Email-Scraper-gig.user.js

Last active March 27, 2025 04:58

	// ==UserScript==
	// @name Email Scraper
	// @namespace http://tampermonkey.net/
	// @version 0.2
	// @description Scrape emails across multiple pages and save to CSV
	// @match https://solicitors.lawsociety.org.uk/*
	// @grant GM_setValue
	// @grant GM_getValue
	// @run-at document-end
	// @license MIT

MarwanShehata / testTryCatch.ts

Created March 20, 2025 18:24 — forked from mthomason/testTryCatch.ts

A fixed version of an tryCatchWrapper for TypeScript.

	// Types for the result object with discriminated union
	type Success<T> = {
	data: T;
	error: null;
	};

	type Failure<E> = {
	data: null;
	error: E;
	};

MarwanShehata / try-catch.ts

Created March 20, 2025 17:43 — forked from t3dotgg/try-catch.ts

Theo's preferred way of handling try/catch in TypeScript

	// Types for the result object with discriminated union
	type Success<T> = {
	data: T;
	error: null;
	};

	type Failure<E> = {
	data: null;
	error: E;
	};

MarwanShehata / validator.ts

Last active October 26, 2024 19:44

This is not a library, this is just a list of functions I decided to put in a central location so I can copy them to future projects as needed. These functions are in typescript an do both compile-time (with generics) AND runtime validation. Feel fr

	// ** Types ** //

	export type TFunc = (...args: any[]) => any;
	export type TEmail = `${string}@${string}`;
	export type TColor = `#${string}`;


	// ** Variables ** //

	const EMAIL_RGX = /^(?!\.)(?!.\.\.)([A-Z0-9_'+\-.])[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\.)+[A-Z]{2,}$/i,

MarwanShehata / raceConditions

Created August 10, 2024 14:44

[https://www.youtube.com/watch?v=9LFNX5p0W-4](url)

	function slow(id, cb) {
	setTimeout(function () {
	cb(null, id)
	}, Math.random() * 3000)
	}

	let promises = []
	for (let i = 0; i < 3; i++) {
	const prom = new Promise((resolve, reject) => {
	slow(i, function (err, res) {

MarwanShehata / modal

Last active April 20, 2024 02:17

In this challenge you'll be adding a modal experience to the app. The user needs to be able to open the modal and then close it either by clicking the close icon in the modal itself, or by clicking anywhere outside of the modal. You'll need both c

MarwanShehata / countryCode

Last active April 19, 2024 05:15

The `ignore` variable in your code serves as a flag to prevent state updates after an asynchronous operation (in this case, fetching country data) has completed, especially when the component might have been unmounted or the state might have been upd

	import {
	createContext,
	memo,
	useCallback,
	useContext,
	useEffect,
	useId,
	useLayoutEffect,
	useMemo,
	useReducer,

MarwanShehata / reset.css

Created March 27, 2024 07:13

	/*
	Josh Comeau Reset https://www.joshwcomeau.com/css/custom-css-reset/ with my tweaks
	*/
	*,
	*::before,
	*::after {
	box-sizing: border-box;
	}
	* {
	margin: 0;

NewerOlder


	export default function App() {
	const [isOpen, setIsOpen] = React.useState(false);
	const ref = React.useRef(null);

	React.useEffect(() => {
	if (isOpen === true) {
	const handleEvent = (e) => {
	const element = ref.current;
	if (element && !element.contains(e.target)) {