chore: remove prettier plugin astro from command and only add in plugins

Author: abhushanaj

.prettierrc.js

@@ -1,8 +1,5 @@
 /** @type {import("prettier").Config} */
 const config = {
-	// we still need to add the `prettier-plugin-astro` in the script, due to upstream pnpm issue as mentioned on astro docs
-	// Reference: https://docs.astro.build/en/editor-setup/#prettier
-
 	plugins: ['@ianvs/prettier-plugin-sort-imports', 'prettier-plugin-astro', 'prettier-plugin-tailwindcss'],
 
 	// General

package.json

@@ -15,8 +15,8 @@
 		"dev:hooks": "turbo dev --filter=@abhushanaj/react-hooks",
 		"build:hooks": "turbo build --filter=@abhushanaj/react-hooks",
 		"test:hooks": "turbo test --filter=@abhushanaj/react-hooks",
-		"prettier:format": "pnpm exec prettier . --write --plugin=prettier-plugin-astro",
-		"prettier:check": "pnpm exec prettier . --check --plugin=prettier-plugin-astro",
+		"prettier:format": "pnpm exec prettier . --write",
+		"prettier:check": "pnpm exec prettier . --check",
 		"prepare": "husky"
 	},
 	"devDependencies": {

www/src/components/demo/useIsClient/index.tsx

@@ -3,7 +3,7 @@ import ClientGate from '@/components/docs/client-gate';
 function Box({ isClientOnly }: { isClientOnly: boolean }) {
 	return (
 		<div
-			className={`flex size-20 items-center justify-center rounded-md border-2 border-white  text-white ${isClientOnly ? 'bg-green-500' : 'bg-pink-500'}`}
+			className={`flex size-20 items-center justify-center rounded-md border-2 border-white text-white ${isClientOnly ? 'bg-green-500' : 'bg-pink-500'}`}
 		/>
 	);
 }

www/src/components/demo/useList/index.tsx

@@ -25,7 +25,7 @@ function UseListExample() {
 				<div className="my-4 flex min-h-16 max-w-[80%] items-center justify-center gap-4 overflow-x-auto pb-4">
 					{list.map((i, ind) => (
 						<div
-							className={`flex min-h-[50px] min-w-[50px] items-center justify-center rounded-md  border-2 border-white p-3 ${ind === size - 1 ? 'bg-yellow-500' : ''} ${ind === 0 ? 'bg-green-500' : ''}`}
+							className={`flex min-h-[50px] min-w-[50px] items-center justify-center rounded-md border-2 border-white p-3 ${ind === size - 1 ? 'bg-yellow-500' : ''} ${ind === 0 ? 'bg-green-500' : ''}`}
 							key={ind}
 						>
 							{i}

www/src/components/demo/useQueue/index.tsx

@@ -32,7 +32,7 @@ function UseQueueExample() {
 				<div className="my-4 flex min-h-16 max-w-[80%] items-center justify-center gap-4 overflow-x-auto pb-4">
 					{queue.map((i) => (
 						<div
-							className={`flex min-h-[50px] min-w-[50px] items-center justify-center rounded-md  border-2 border-white p-3 ${i === lastItem ? 'bg-yellow-500' : ''} ${i === firstItem ? 'bg-green-500' : ''} ${firstItem === lastItem ? 'bg-pink-500' : ''}`}
+							className={`flex min-h-[50px] min-w-[50px] items-center justify-center rounded-md border-2 border-white p-3 ${i === lastItem ? 'bg-yellow-500' : ''} ${i === firstItem ? 'bg-green-500' : ''} ${firstItem === lastItem ? 'bg-pink-500' : ''}`}
 							key={i}
 						>
 							{i}

www/src/components/demo/useWasSSR/index.tsx

@@ -6,7 +6,7 @@ function Box() {
 	const wasSSRed = useWasSSR();
 	return (
 		<div
-			className={`flex size-20 items-center justify-center rounded-md border-2 border-white  text-white ${wasSSRed ? 'bg-green-500' : 'bg-red-500'}`}
+			className={`flex size-20 items-center justify-center rounded-md border-2 border-white text-white ${wasSSRed ? 'bg-green-500' : 'bg-red-500'}`}
 		/>
 	);
 }

www/src/components/demo/wrapper/index.tsx

@@ -7,7 +7,7 @@ type Props = {
 
 export function DemoWrapper({ children, title }: Props) {
 	return (
-		<div className="bg-gradient-1 not-content flex min-h-[450px] w-full flex-col items-center  rounded-md p-[2em] text-center   text-white">
+		<div className="bg-gradient-1 not-content flex min-h-[450px] w-full flex-col items-center rounded-md p-[2em] text-center text-white">
 			<h2 className="min-h-[40px] text-center text-3xl text-white">{title}</h2>
 			<div className="flex w-full flex-1 items-center justify-center">{children}</div>
 		</div>