this is my postcss.config.mjs

`const config = {
  plugins: {
    "@tailwindcss/postcss": {},
  },
};
export default config;`

imported tailwind in globals.css as well 
`@import "tailwindcss";`

this is the component inside the ui/src folder 
Appbar.tsx
'import { Button } from "./button";

interface AppbarProps {
    user?: {
        name?: string | null;
    },
    // TODO: can u figure out what the type should be here?
    onSignin: () =>void , // mean i my type will take function and its doesnt care what it returns
    onSignout:() =>void 
} 

export const Appbar = ({
    user,
    onSignin,
    onSignout
}: AppbarProps) => {
    return <div className="flex justify-between border-b px-4">
        <div className="text-lg flex flex-col justify-center">
            PayZoo
        </div>
        <div className="flex flex-col justify-center pt-2">
            <Button onClick={user ? onSignout : onSignin}>{user ? "Logout" : "Login"}</Button>
        </div>
    </div>
}'