git.stevedylan.dev

chore: style changes for auth 459080f4

Steve · 2026-01-08 07:50 3 file(s) · +18 −19

packages/client/src/components/auth/AuthStatus.tsx +12 −8

import { useState, useEffect, createContext, useContext, type ReactNode } from "react";
import {
	useState,
	useEffect,
	createContext,
	useContext,
	type ReactNode,
} from "react";

interface AuthState {
	authenticated: boolean;

	const { authenticated, loading, login, logout } = useAuth();

	if (loading) {
		return (
			<div className="text-sm text-gray-500">
				Checking auth...
			</div>
		);
		return <div className="text-sm text-gray-400">Checking auth...</div>;
	}

	if (authenticated) {
		return (
			<button
				type="button"
				onClick={logout}
				className="text-sm px-3 py-1.5 border border-gray-300 dark:border-gray-600 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
				className="text-sm px-3 py-1.5 border border-white"
			>
				Logout
			</button>

	return (
		<button
			onClick={login}
			className="text-sm px-3 py-1.5 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors"
			type="button"
			className="text-sm px-3 py-1.5 border border-white transition-colors"
		>
			Login with ATProto
		</button>

packages/client/src/components/post/NowAdmin.tsx +2 −2


	return (
		<AuthProvider>
			<div className="mb-6">
				<div className="flex justify-end mb-4">
			<div className="mb-6 mt-12">
				<div className="flex justify-center mb-4">
					<LoginButton />
				</div>
				<PostComposer onPostCreated={handlePostCreated} />

packages/client/src/components/post/PostComposer.tsx +4 −9

	const isOverLimit = remaining < 0;

	return (
		<form
			onSubmit={handleSubmit}
			className="mb-8 p-4 border border-gray-200 dark:border-gray-700 rounded-lg"
		>
		<form onSubmit={handleSubmit} className="mb-8 mt-12">
			<label htmlFor="post-text" className="block text-sm font-medium mb-2">
				New Update
			</label>

				onChange={(e) => setText(e.target.value)}
				placeholder="What's happening?"
				rows={3}
				className="w-full p-3 border border-gray-300 dark:border-gray-600 rounded-lg bg-gray-800 resize-none focus:outline-none text-white focus:ring-2 focus:ring-blue-500 focus:border-transparent"
				className="w-full bg-transparent p-3 border border-white  text-white"
				disabled={isSubmitting}
			/>



					{error && <span className="text-sm text-red-500">{error}</span>}

					{success && (
						<span className="text-sm text-green-500">Posted successfully!</span>
					)}
					{success && <span className="text-sm">Posted successfully!</span>}
				</div>

				<button
					type="submit"
					disabled={isSubmitting || isOverLimit || !text.trim()}
					className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
					className="px-4 py-2 border-white border text-white disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
				>
					{isSubmitting ? "Posting..." : "Post"}
				</button>

1		-	import { useState, useEffect, createContext, useContext, type ReactNode } from "react";
	1	+	import {
	2	+	useState,
	3	+	useEffect,
	4	+	createContext,
	5	+	useContext,
	6	+	type ReactNode,
	7	+	} from "react";
2	8
3	9		interface AuthState {
4	10		authenticated: boolean;

84	90		const { authenticated, loading, login, logout } = useAuth();
85	91
86	92		if (loading) {
87		-	return (
88		-	<div className="text-sm text-gray-500">
89		-	Checking auth...
90		-	</div>
91		-	);
	93	+	return <div className="text-sm text-gray-400">Checking auth...</div>;
92	94		}
93	95
94	96		if (authenticated) {
95	97		return (
96	98		<button
	99	+	type="button"
97	100		onClick={logout}
98		-	className="text-sm px-3 py-1.5 border border-gray-300 dark:border-gray-600 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
	101	+	className="text-sm px-3 py-1.5 border border-white"
99	102		>
100	103		Logout
101	104		</button>

105	108		return (
106	109		<button
107	110		onClick={login}
108		-	className="text-sm px-3 py-1.5 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors"
	111	+	type="button"
	112	+	className="text-sm px-3 py-1.5 border border-white transition-colors"
109	113		>
110	114		Login with ATProto
111	115		</button>

69	69		const isOverLimit = remaining < 0;
70	70
71	71		return (
72		-	<form
73		-	onSubmit={handleSubmit}
74		-	className="mb-8 p-4 border border-gray-200 dark:border-gray-700 rounded-lg"
75		-	>
	72	+	<form onSubmit={handleSubmit} className="mb-8 mt-12">
76	73		<label htmlFor="post-text" className="block text-sm font-medium mb-2">
77	74		New Update
78	75		</label>

82	79		onChange={(e) => setText(e.target.value)}
83	80		placeholder="What's happening?"
84	81		rows={3}
85		-	className="w-full p-3 border border-gray-300 dark:border-gray-600 rounded-lg bg-gray-800 resize-none focus:outline-none text-white focus:ring-2 focus:ring-blue-500 focus:border-transparent"
	82	+	className="w-full bg-transparent p-3 border border-white text-white"
86	83		disabled={isSubmitting}
87	84		/>
88	85

96	93
97	94		{error && <span className="text-sm text-red-500">{error}</span>}
98	95
99		-	{success && (
100		-	<span className="text-sm text-green-500">Posted successfully!</span>
101		-	)}
	96	+	{success && <span className="text-sm">Posted successfully!</span>}
102	97		</div>
103	98
104	99		<button
105	100		type="submit"
106	101		disabled={isSubmitting \|\| isOverLimit \|\| !text.trim()}
107		-	className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
	102	+	className="px-4 py-2 border-white border text-white disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
108	103		>
109	104		{isSubmitting ? "Posting..." : "Post"}
110	105		</button>

17	17
18	18		return (
19	19		<AuthProvider>
20		-	<div className="mb-6">
21		-	<div className="flex justify-end mb-4">
	20	+	<div className="mb-6 mt-12">
	21	+	<div className="flex justify-center mb-4">
22	22		<LoginButton />
23	23		</div>
24	24		<PostComposer onPostCreated={handlePostCreated} />