feat: Added a frontend page to activate and redirect

backend/accounts/templates/activation_mail.html

@@ -3,5 +3,5 @@
 
 Please click on the link below to confirm your registration:
 
-http://{{ domain }}{% url 'activate' uidb64=uid token=token %}
+{{ protocol }}://{{ domain }}/activate?uuid={{uuid}}&token={{token}}
 {% endautoescape %}

backend/accounts/views.py

@@ -14,6 +14,7 @@
 from .models import Account
 from .serializers import AccountSerializer
 from .token import account_activation_token
+from django.conf import settings
 
 logger = logging.getLogger(__name__)
 
@@ -24,12 +25,12 @@ def activateEmail(request, user, to_email):
     mail_subject = 'Activate your user account.'
     message = render_to_string('activation_mail.html', {
         'user': user.first_name,
-        'domain': get_current_site(request).domain,
-        'uid': urlsafe_base64_encode(force_bytes(user.email)),
+        'domain': "localhost:3000" if settings.DEBUG else settings.PRODUCTION_URL,
+        'uuid': urlsafe_base64_encode(force_bytes(user.email)),
         'token': account_activation_token.make_token(user),
         'protocol': 'https' if request.is_secure() else 'http'
     })
-    email = send_mail(mail_subject, message, 'theprogclubiiitdmj.ac.in',[to_email])
+    email = send_mail(mail_subject, message,settings.EMAIL_HOST_USER ,[to_email])
     logger.info(f"Email sent to {to_email} with response {email}")
 
 class CreateAccountView(CreateAPIView):

backend/core/settings/base.py

@@ -13,6 +13,8 @@
 
 DEBUG = os.environ.get('DEBUG') != 'False'
 
+PRODUCTION_URL = 'https://getit.iiitdmj.ac.in'
+
 ALLOWED_HOSTS = ['*']
 
 CORS_ORIGIN_ALLOW_ALL = False

frontend/pages/Signin.vue

@@ -96,8 +96,10 @@ import { useRouter } from "vue-router";
 import { extractPath } from "~/utils/url";
 import { toast } from "vue3-toastify";
 
+
 export default {
   name: "Signin",
+  
   setup() {
     const credentials = {
       email: "",
@@ -113,12 +115,6 @@ export default {
     if (store.isAuthenticated) {
       router.push(last);
     }
-    if(router.currentRoute.value.query.msg){
-      toast.success(router.currentRoute.value.query.msg, {
-            autoClose: 2000,
-            position: toast.POSITION.BOTTOM_CENTER,
-          });
-    }
     const submitForm = async (e) => {
       e.preventDefault();
       const data = await store.login(credentials);
@@ -134,6 +130,15 @@ export default {
       handleSignup,
     };
   },
+  mounted() {
+    const router = useRouter();
+    if(router.currentRoute.value.query.msg){
+      toast.success(router.currentRoute.value.query.msg,{
+        autoClose: 2000,
+        position: toast.POSITION.BOTTOM_CENTER,
+      });
+    }
+  }
 };
 </script>
 <style scoped>

frontend/pages/activate.vue

@@ -0,0 +1,39 @@
+<template>
+    <div class="flex flex-col items-center justify-center h-[80svh] gap-4">
+        <p class="font-semibold text-4xl">{{ activationStatus }}</p>
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useRouter } from "vue-router";
+
+const config = useRuntimeConfig();
+const activationStatus = ref('');
+const router = useRouter();
+
+
+async function activateUser() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const uuid = urlParams.get('uuid');
+    const token = urlParams.get('token');
+    let status = '';
+    try {
+        const response = await $fetch(`${config.public.API_BASE_URL}/api/accounts/activate/${uuid}/${token}`);
+        status = await response.text();
+        if (response.type === '200') {
+            router.push({ path: '/signin', query: { msg: 'account activated' } });
+        }
+    } catch (error) {
+        console.error(error);
+        status = 'Activation failed';
+    }
+
+    return status;
+}
+
+onMounted(async () => {
+    const status = await activateUser();
+    activationStatus.value = status +' !!';
+});
+</script>