cleanup

.prettierrc

@@ -3,6 +3,6 @@
 	"useTabs": true,
 	"semi": true,
 	"singleQuote": true,
-	"tabWidth": 2,
+	"tabWidth": 4,
 	"trailingComma": "es5"
 }

CONTRIBUTING.md

@@ -15,31 +15,31 @@ For instructions on how to run the server, see [server/README.md](apps/server/re
 
 ### Server
 
-- **Option 1: Poetry**:
+-   **Option 1: Poetry**:
 
-  To use multiple versions of Python, you can use `pyenv`:
-  3.10.6 is an example for our use-case.
+    To use multiple versions of Python, you can use `pyenv`:
+    3.10.6 is an example for our use-case.
 
-  - Install `pyenv` using `brew`.
-  - `pyenv install 3.10.6`.
-  - Launch shell - `pyenv shell 3.10.6`.
+    -   Install `pyenv` using `brew`.
+    -   `pyenv install 3.10.6`.
+    -   Launch shell - `pyenv shell 3.10.6`.
 
-    Install Poetry: [Read more here](https://python-poetry.org/docs/)
+        Install Poetry: [Read more here](https://python-poetry.org/docs/)
 
-    1. `poetry config virtualenvs.in-project true`
-    2. `poetry self update` to update to the latest version of Poetry.
-    3. If you used, `pyenv shell`, you can now run `poetry env use python3.10.6`.
-    4. `poetry install` to install all dependencies.
-    5. `poetry export --without-hashes --format=requirements.txt > requirements.txt` to export the requirements without hashes.
+        1. `poetry config virtualenvs.in-project true`
+        2. `poetry self update` to update to the latest version of Poetry.
+        3. If you used, `pyenv shell`, you can now run `poetry env use python3.10.6`.
+        4. `poetry install` to install all dependencies.
+        5. `poetry export --without-hashes --format=requirements.txt > requirements.txt` to export the requirements without hashes.
 
-- **Option 2: Docker**:
+-   **Option 2: Docker**:
 
-  - Docker is cool, however, I'd recommend not launching a resource-heavy container every time you want to run a development server.
-    1. Install Docker: [Read more here](https://www.docker.com/community-edition)
-    2. `docker-compose build` to build the Docker image.
-    3. `docker-compose up` to start the server.
+    -   Docker is cool, however, I'd recommend not launching a resource-heavy container every time you want to run a development server.
+        1. Install Docker: [Read more here](https://www.docker.com/community-edition)
+        2. `docker-compose build` to build the Docker image.
+        3. `docker-compose up` to start the server.
 
-- **Make sure to use the pre-commit hook**
-  1. Installation - [Read more here](https://pre-commit.com)
-  2. `pre-commit install` to install the pre-commit hooks.
-  3. `pre-commit run -a` to run the pre-commit hooks.
+-   **Make sure to use the pre-commit hook**
+    1. Installation - [Read more here](https://pre-commit.com)
+    2. `pre-commit install` to install the pre-commit hooks.
+    3. `pre-commit run -a` to run the pre-commit hooks.

README.md

@@ -21,19 +21,19 @@
 
 ### Apps
 
-- [app/landing](https://github.com/DevClad-Inc/devclad-client/tree/main/apps/landing)
-- [app/web](https://github.com/DevClad-Inc/devclad-client/tree/main/apps/web)
+-   [app/landing](https://github.com/DevClad-Inc/devclad-client/tree/main/apps/landing)
+-   [app/web](https://github.com/DevClad-Inc/devclad-client/tree/main/apps/web)
 
 ---
 
 ## Contributing
 
 ## Styling
 
-- Tabs not spaces. Tabs are 4 spaces.
-  - (Exception: server code which uses Python with `black` formatting)
-- Use `prettier` for formatting.
-- Using [Airbnb Style Guide](https://github.com/airbnb/javascript) for ESLint with some modifications.
+-   Tabs not spaces. Tabs are 4 spaces.
+    -   (Exception: server code which uses Python with `black` formatting)
+-   Use `prettier` for formatting.
+-   Using [Airbnb Style Guide](https://github.com/airbnb/javascript) for ESLint with some modifications.
 
 ## Absolute Imports
 

apps/landing/src/components/Contact.tsx

@@ -17,8 +17,13 @@ export default function Contact(): JSX.Element {
 						<span className="rounded-full border-[0.5px] border-neutral-500 px-4 py-0.5 font-mono text-xs font-semibold text-orange-300 lg:text-sm">
 							Beta 1.0
 						</span>
-						<span className="ml-4 text-xs font-medium lg:text-sm">Join our Discord</span>
-						<ChevronRightIcon className="ml-2 h-5 w-5 text-neutral-500" aria-hidden="true" />
+						<span className="ml-4 text-xs font-medium lg:text-sm">
+							Join our Discord
+						</span>
+						<ChevronRightIcon
+							className="ml-2 h-5 w-5 text-neutral-500"
+							aria-hidden="true"
+						/>
 					</a>
 				</h2>
 				<p className="mt-2 font-mono text-lg text-neutral-300">

apps/landing/src/components/Features.tsx

@@ -47,7 +47,8 @@ export function Features(): JSX.Element {
 			<div className="mx-auto max-w-md px-4 text-center sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8">
 				<h2 className="text-lg font-semibold text-neutral-300">Meet developers</h2>
 				<p className="mt-2 text-3xl font-bold tracking-tight text-neutral-100 sm:text-4xl">
-					Build a <span className="font-black text-orange-500">strong</span> network of developers.
+					Build a <span className="font-black text-orange-500">strong</span> network of
+					developers.
 				</p>
 				<p className="mx-auto mt-5 max-w-prose font-mono text-xl text-neutral-300">
 					Weekly 1—⁠on⁠—⁠1 match from a pool of vetted developers 🌎 using ML.
@@ -65,7 +66,9 @@ export function Features(): JSX.Element {
 											>
 												<feature.icon
 													className={classNames(
-														feature.icon === HandRaisedIcon ? '-rotate-[30deg]' : '',
+														feature.icon === HandRaisedIcon
+															? '-rotate-[30deg]'
+															: '',
 														'h-8 w-8'
 													)}
 													aria-hidden="true"
@@ -93,13 +96,16 @@ export function Roadmap(): JSX.Element {
 	return (
 		<div className="animate-fadeIn space-y-16 py-4 sm:py-32">
 			<div className="mx-auto max-w-md px-4 text-center sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8">
-				<h2 className="text-lg font-semibold text-neutral-300">Down the roadmap for Beta 2.0</h2>
+				<h2 className="text-lg font-semibold text-neutral-300">
+					Down the roadmap for Beta 2.0
+				</h2>
 				<p className="mt-2 text-3xl font-bold tracking-tight text-neutral-100 sm:text-4xl">
-					<span className="font-black text-fuchsia-500">Team up</span> on Projects and Hackathons
+					<span className="font-black text-fuchsia-500">Team up</span> on Projects and
+					Hackathons
 				</p>
 				<p className="mx-auto mt-5 max-w-prose font-mono text-xl text-neutral-300">
-					Spend less time configuring your workspace and more time building with minimal interfaces
-					that get you to your MVP faster.
+					Spend less time configuring your workspace and more time building with minimal
+					interfaces that get you to your MVP faster.
 				</p>
 				<div className="mt-12 flex justify-center">
 					<div className="grid max-w-prose grid-cols-1 gap-8 sm:grid-cols-2">
@@ -114,7 +120,9 @@ export function Roadmap(): JSX.Element {
 											>
 												<feature.icon
 													className={classNames(
-														feature.icon === HandRaisedIcon ? '-rotate-[30deg]' : '',
+														feature.icon === HandRaisedIcon
+															? '-rotate-[30deg]'
+															: '',
 														'animate-gradient-reverse h-8 w-8'
 													)}
 													aria-hidden="true"

apps/landing/src/components/Hero.tsx

@@ -57,7 +57,10 @@ export default function Hero(): JSX.Element {
 									Beta 1.0
 								</span>
 								<span className="ml-4 text-xs lg:text-sm">Join our Discord</span>
-								<ChevronRightIcon className="ml-2 h-5 w-5 text-neutral-500" aria-hidden="true" />
+								<ChevronRightIcon
+									className="ml-2 h-5 w-5 text-neutral-500"
+									aria-hidden="true"
+								/>
 							</a>
 							<div className="space-y-4">
 								<div className="flex text-center sm:justify-center">
@@ -68,9 +71,13 @@ export default function Hero(): JSX.Element {
 										<h1 className="text-5xl text-[#fff] sm:text-6xl sm:font-medium md:text-6xl lg:text-6xl xl:text-7xl">
 											<span className="block font-bold">
 												<span className="block">Meet developers</span>
-												<span className="block rounded-xl text-orange-100">one-on-one</span>
+												<span className="block rounded-xl text-orange-100">
+													one-on-one
+												</span>
+											</span>
+											<span className="font-bold text-fuchsia-100">
+												Team up.
 											</span>
-											<span className="font-bold text-fuchsia-100">Team up.</span>
 											<span className="font-bold text-sky-100"> Build.</span>
 										</h1>
 									</div>

apps/landing/tsconfig.json

@@ -1,5 +1,5 @@
 {
-	"extends": "../../packages/config/interface.tsconfig.json",
+	"extends": "../../packages/config/vite.tsconfig.json",
 	"compilerOptions": {
 		"baseUrl": ".",
 		"paths": {

apps/server/readme.md

@@ -2,10 +2,10 @@
 
 ## Database and Async
 
-- PostgresQL (in prod only)
-- Redis for caching and async tasks.
-- Channel layer for websocket communication.
-- Celery for scheduling async tasks.
+-   PostgresQL (in prod only)
+-   Redis for caching and async tasks.
+-   Channel layer for websocket communication.
+-   Celery for scheduling async tasks.
 
 ## Code Formatting
 

apps/userpics/README.md

@@ -4,11 +4,11 @@
 
 ## Features
 
-- [x] 🚀 Generate avatars on the fly
-- [x] 🎨 100 avatars included from [Craftwork.design](https://craftwork.design/) (I'm not affiliated with them, just a fan)
-- [x] 🎨 Abstraction over [Boring Avatars](https://boringavatars.com/) included as well.
-- [x] ✨ Tiny as fuck.
-- [x] ✨ Serverless. Configurable. Easily deployable.
+-   [x] 🚀 Generate avatars on the fly
+-   [x] 🎨 100 avatars included from [Craftwork.design](https://craftwork.design/) (I'm not affiliated with them, just a fan)
+-   [x] 🎨 Abstraction over [Boring Avatars](https://boringavatars.com/) included as well.
+-   [x] ✨ Tiny as fuck.
+-   [x] ✨ Serverless. Configurable. Easily deployable.
 
 ## Usage (Important)
 
@@ -19,19 +19,19 @@
 
 #### Available Query Params
 
-- `?name=string` - Your username. Defaults to `Cactus Jack`.
-- `?size=int` - Size of the avatar. Default is 128.
-- `?variant=string` - Variant of the avatar. Default is `beam`.
-- `?stream=bool` - Stream the SVG instead of returning a URL. Default is False.
+-   `?name=string` - Your username. Defaults to `Cactus Jack`.
+-   `?size=int` - Size of the avatar. Default is 128.
+-   `?variant=string` - Variant of the avatar. Default is `beam`.
+-   `?stream=bool` - Stream the SVG instead of returning a URL. Default is False.
 
 #### Available Variants
 
-- `marble`
-- `pixel`
-- `beam`
-- `sunset`
-- `ring`
-- `bauhaus`
+-   `marble`
+-   `pixel`
+-   `beam`
+-   `sunset`
+-   `ring`
+-   `bauhaus`
 
 All these variants and avatars (under `api/avatar/` route) are from [Boring Avatars](https://boringavatars.com/).
 
@@ -44,7 +44,7 @@ All these variants and avatars (under `api/avatar/` route) are from [Boring Avat
 
 ### Python Example
 
-- `/api/getpic/` is the endpoint to get a random avatar.
+-   `/api/getpic/` is the endpoint to get a random avatar.
 
 ```python
 def random_avatar():

apps/userpics/app/routes/index.tsx

@@ -7,7 +7,10 @@ export default function Index() {
 			<div className="flex justify-center py-10 font-mono">
 				<span className="block text-amber-300">
 					<span className="flex">
-						<a className="text-blue-300" href="https://github.com/arthtyagi/serverless-userpics">
+						<a
+							className="text-blue-300"
+							href="https://github.com/arthtyagi/serverless-userpics"
+						>
 							View on GitHub
 						</a>
 						<svg

apps/web/package.json

@@ -28,7 +28,7 @@
 		"react-hot-toast": "^2.3.0",
 		"react-intersection-observer": "^9.4.0",
 		"react-router-dom": "^6.4.0",
-		"stream-chat": "^7.1.0",
+		"stream-chat": "^8.0.0",
 		"vite-plugin-svgr": "^2.2.1"
 	},
 	"devDependencies": {

apps/web/src/components/ActionDropdown.tsx

@@ -58,7 +58,10 @@ export default function ActionDropdown({ items }: ActionDropdownProps): JSX.Elem
 											<span className="flex items-center">
 												<span className="mr-2">
 													{' '}
-													<item.icon className="h-6 w-6 flex-shrink-0" aria-hidden="true" />
+													<item.icon
+														className="h-6 w-6 flex-shrink-0"
+														aria-hidden="true"
+													/>
 												</span>
 												{item.name}
 											</span>

apps/web/src/components/AppShell.tsx

@@ -79,7 +79,11 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 								onClick={() => setSidebarExpand(!sidebarExpand)}
 								className="m-auto"
 							>
-								<img className="m-auto h-24 w-auto rounded-full" src={DevCladSVG} alt="DevClad" />
+								<img
+									className="m-auto h-24 w-auto rounded-full"
+									src={DevCladSVG}
+									alt="DevClad"
+								/>
 							</button>
 						</div>
 						<nav
@@ -110,7 +114,9 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 										)}
 										aria-hidden="true"
 									/>
-									<span className="text-md font-mono font-bold">{sidebarExpand && item.name}</span>
+									<span className="text-md font-mono font-bold">
+										{sidebarExpand && item.name}
+									</span>
 								</NavLink>
 							))}
 						</nav>
@@ -146,7 +152,12 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 				</div>
 			</div>
 			{/* Main content */}
-			<div className={classNames(sidebarExpand ? 'md:pl-48' : 'md:pl-24', 'flex flex-1 flex-col')}>
+			<div
+				className={classNames(
+					sidebarExpand ? 'md:pl-48' : 'md:pl-24',
+					'flex flex-1 flex-col'
+				)}
+			>
 				<div className="md:hidden">
 					<div className="fixed inset-x-0 bottom-0 z-10 flex flex-shrink">
 						<div className="w-full">
@@ -170,7 +181,10 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 										}
 										end
 									>
-										<tab.icon className="h-8 w-8 flex-shrink-0" aria-hidden="true" />
+										<tab.icon
+											className="h-8 w-8 flex-shrink-0"
+											aria-hidden="true"
+										/>
 										<span className="sr-only">{tab.name}</span>
 									</NavLink>
 								))}
@@ -189,8 +203,14 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 									>
 										<li>
 											<div>
-												<Link to="/" className="text-white duration-300 hover:text-orange-300">
-													<HomeIcon className="h-5 w-5 flex-shrink-0" aria-hidden="true" />
+												<Link
+													to="/"
+													className="text-white duration-300 hover:text-orange-300"
+												>
+													<HomeIcon
+														className="h-5 w-5 flex-shrink-0"
+														aria-hidden="true"
+													/>
 													<span className="sr-only">Home</span>
 												</Link>
 											</div>
@@ -210,7 +230,9 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 													<span
 														className="ml-2 font-mono text-sm font-medium text-orange-300
                           duration-300 hover:text-white"
-														aria-current={pathname === page ? 'page' : undefined}
+														aria-current={
+															pathname === page ? 'page' : undefined
+														}
 													>
 														{page}
 													</span>
@@ -272,7 +294,8 @@ export default function AppShell({ children }: { children: React.ReactNode }) {
 							{pageTitle === 'Settings' && (
 								<>
 									<h1 className="text-3xl font-bold">
-										{checkIOS() || checkMacOS() ? '⚙' : ''} {loggedInUser.first_name}
+										{checkIOS() || checkMacOS() ? '⚙' : ''}{' '}
+										{loggedInUser.first_name}
 										&apos;s Settings
 									</h1>
 									<hr className="border-1 my-8 border-neutral-200 dark:border-neutral-800" />