add a sign in button in the navigation menu. it should be on the right side. and when clicked, if the user is signed out, navigation to the sign-in page. on the sign in page

import { cn } from "@/lib/utils"

import { Button } from "@/components/ui/button"

import {

Card,

CardContent,

CardDescription,

CardHeader,

CardTitle,

} from "@/components/ui/card"

import { Input } from "@/components/ui/input"

import { Label } from "@/components/ui/label"

export function LoginForm({

className,

...props

}: React.ComponentProps<"div">) {

return (

<div className={cn("flex flex-col gap-6", className)} {...props}>  

  <Card>  

    <CardHeader>  

      <CardTitle>Login to your account</CardTitle>  

      <CardDescription>  

        Enter your email below to login to your account  

      </CardDescription>  

    </CardHeader>  

    <CardContent>  

      <form>  

        <div className="flex flex-col gap-6">  

          <div className="grid gap-3">  

            <Label htmlFor="email">Email</Label>  

            <Input  

              id="email"  

              type="email"  

              placeholder="m@example.com"  

              required  

            />  

          </div>  

          <div className="grid gap-3">  

            <div className="flex items-center">  

              <Label htmlFor="password">Password</Label>  

              <a  

                href="#"  

                className="ml-auto inline-block text-sm underline-offset-4 hover:underline"  

              >  

                Forgot your password?  

              </a>  

            </div>  

            <Input id="password" type="password" required />  

          </div>  

          <div className="flex flex-col gap-3">  

            <Button type="submit" className="w-full">  

              Login  

            </Button>  

            <Button variant="outline" className="w-full">  

              Login with Google  

            </Button>  

          </div>  

        </div>  

        <div className="mt-4 text-center text-sm">  

          Don&apos;t have an account?{" "}  

          <a href="#" className="underline underline-offset-4">  

            Sign up  

          </a>  

        </div>  

      </form>  

    </CardContent>  

  </Card>  

</div>  

)

}