Test/final

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,26 @@
+---
+name: Bug report
+about: Report a bug
+title: ''
+labels: bug
+assignees: ''
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To Reproduce**
+Steps to reproduce the behavior:
+1. Go To Profile page
+2. Click on the cover photo 
+3. ...
+
+**Text output/Error Messages**
+If any
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Additional context**
+Add any other context about the problem here.

.github/workflows/ci.yml

@@ -2,7 +2,9 @@ name: CI
 
 on:
     pull_request:
-        branches: [main, development]
+        branches: [main, development, production]
+    push:
+        branches: [fix/ci]
 
 permissions:
     contents: read
@@ -12,7 +14,7 @@ jobs:
     checks:
         runs-on: ubuntu-latest
         strategy:
-            fail-fast: true
+            fail-fast: false
 
         steps:
             - name: 🛒 Checkout code
@@ -27,20 +29,23 @@ jobs:
             - name: 📦 Install dependencies
               run: npm ci
 
+            - name: 🧪 Run unit tests with coverage
+              run: npm run test:coverage
+
+            - name: 🏗️ Build Nuxt app
+              run: npm run build
+
+            - name: 🎨 Check Prettier formatting
+              run: npm run format
+
             - name: 🎨 Check Prettier formatting
-              run: npx prettier --check "**/*.{js,ts,vue,json,css,md}"
+              run: npm run format:check
 
             - name: 🧹 Run ESLint
               run: npm run lint
 
-            - name: 🧪 Run unit tests with coverage
-              run: npm run test:coverage
-
             - name: SonarCloud Scan
-              uses: SonarSource/sonarcloud-github-action@master
+              uses: SonarSource/sonarqube-scan-action@v6
               env:
-                GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}  # Needed to get PR information, if any
-                SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
-
-            - name: 🏗️ Build Nuxt app
-              run: npm run build
+                  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # Needed to get PR information, if any
+                  SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

.github/workflows/pr_title_check.yml

@@ -1,67 +1,67 @@
 name: PR Title Check
 
 on:
-  pull_request:
-    types: [opened, edited, synchronize, reopened]
+    pull_request:
+        types: [opened, edited, synchronize, reopened]
 
 jobs:
-  check-pr-title:
-    name: Check PR Title Format
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
+    check-pr-title:
+        name: Check PR Title Format
+        runs-on: ubuntu-latest
+        steps:
+            - name: Checkout code
+              uses: actions/checkout@v4
 
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: '20'
+            - name: Setup Node.js
+              uses: actions/setup-node@v4
+              with:
+                  node-version: '20'
 
-      - name: Install dependencies
-        run: npm install --save-dev @commitlint/config-conventional
+            - name: Install dependencies
+              run: npm install --save-dev @commitlint/config-conventional
 
-      - name: Validate PR title
-        env:
-          PR_TITLE: ${{ github.event.pull_request.title }}
-        run: |
-          echo "$PR_TITLE" | npx commitlint --config commitlint.config.js
+            - name: Validate PR title
+              env:
+                  PR_TITLE: ${{ github.event.pull_request.title }}
+              run: |
+                  echo "$PR_TITLE" | npx commitlint --config commitlint.config.js
 
-      - name: Comment on PR if title is invalid
-        if: failure()
-        uses: actions/github-script@v7
-        with:
-          script: |
-            github.rest.issues.createComment({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              body: `❌ **PR Title Check Failed**
+            - name: Comment on PR if title is invalid
+              if: failure()
+              uses: actions/github-script@v7
+              with:
+                  script: |
+                      github.rest.issues.createComment({
+                        issue_number: context.issue.number,
+                        owner: context.repo.owner,
+                        repo: context.repo.repo,
+                        body: `❌ **PR Title Check Failed**
 
-              Your PR title does not follow the conventional commit format.
+                        Your PR title does not follow the conventional commit format.
 
-              **Expected format:** \`type(scope): subject\`
+                        **Expected format:** \`type(scope): subject\`
 
-              **Allowed types:**
-              - \`feat\`: A new feature
-              - \`fix\`: A bug fix
-              - \`docs\`: Documentation changes
-              - \`style\`: Code style changes (formatting, etc.)
-              - \`refactor\`: Code refactoring
-              - \`perf\`: Performance improvements
-              - \`test\`: Adding or updating tests
-              - \`chore\`: Maintenance tasks
-              - \`ci\`: CI/CD changes
+                        **Allowed types:**
+                        - \`feat\`: A new feature
+                        - \`fix\`: A bug fix
+                        - \`docs\`: Documentation changes
+                        - \`style\`: Code style changes (formatting, etc.)
+                        - \`refactor\`: Code refactoring
+                        - \`perf\`: Performance improvements
+                        - \`test\`: Adding or updating tests
+                        - \`chore\`: Maintenance tasks
+                        - \`ci\`: CI/CD changes
 
-              **Examples:**
-              - \`feat: add user authentication\`
-              - \`fix(api): resolve data fetching issue\`
-              - \`docs: update README with setup instructions\`
+                        **Examples:**
+                        - \`feat: add user authentication\`
+                        - \`fix(api): resolve data fetching issue\`
+                        - \`docs: update README with setup instructions\`
 
-              **Rules:**
-              - Type must be lowercase
-              - Subject must not start with uppercase
-              - Subject must not end with a period
-              - Maximum length: 100 characters
+                        **Rules:**
+                        - Type must be lowercase
+                        - Subject must not start with uppercase
+                        - Subject must not end with a period
+                        - Maximum length: 100 characters
 
-              Please update your PR title and try again.`
-            })
+                        Please update your PR title and try again.`
+                      })

.sonarlint/connectedMode.json

@@ -0,0 +1,5 @@
+{
+    "sonarCloudOrganization": "alialaa88",
+    "projectKey": "AliAlaa88_Yapper-frontend",
+    "region": "EU"
+}

.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+  "sonarlint.connectedMode.project": {
+    "connectionId": "yapper",
+    "projectKey": "AliAlaa88_Yapper-frontend"
+  }
+}

app/core/serviceRegistry.ts

@@ -4,7 +4,7 @@ import { createAuthService } from '../modules/auth/services'
 import { createMediaService } from '../modules/Common/services'
 import { createTimelineService } from '../modules/TimeLine/services'
 import { createSearchService } from '../modules/search/services'
-import { exploreService } from "~/modules/explore/services";
+import { exploreService } from '~/modules/explore/services'
 import { settingsService } from '~/modules/settings/services/settingsService'
 import { listService } from '~/modules/Common/services/listService'
 
@@ -22,7 +22,7 @@ export const serviceFactories = {
     exploreService: exploreService,
     chatService: createChatService,
     listService: () => listService,
-    notificationsService : createNotificationsService,
+    notificationsService: createNotificationsService,
 }
 
 export type Services = {

app/layouts/main-layout.vue

@@ -52,7 +52,10 @@ const { width } = useWindowSize()
 const { locale, locales } = useI18n()
 const { sidebarWidth } = useSidebarState()
 const isSearch = computed(
-    () => route.path.startsWith('/explore') || route.path.startsWith('/search') || route.path.startsWith('/notifications'),
+    () =>
+        route.path.startsWith('/explore') ||
+        route.path.startsWith('/search') ||
+        route.path.startsWith('/notifications'),
 )
 
 const isRTL = computed(() => {

app/layouts/profile.vue

@@ -27,8 +27,8 @@
                             type="button"
                             class="flex h-8 w-8 items-center justify-center rounded-full hover:bg-hover transition-colors"
                             :aria-label="$t('timeline.banner.search')"
-                            @click="router.push({ name: 'explore', state: {user: username}})"
-                            >
+                            @click="router.push({ name: 'explore', state: { user: username } })"
+                        >
                             <Search :size="24" class="text-primary" />
                         </button>
                     </div>

app/middleware/auth.ts

@@ -1,7 +1,7 @@
 import { useUserStore } from '../modules/auth/stores/userStore'
 export default defineNuxtRouteMiddleware(async (to) => {
     const authPages = ['/auth/login', '/auth/register', '/auth']
-    const isAuthPage = authPages.some(page => to.path.startsWith(page))
+    const isAuthPage = authPages.some((page) => to.path.startsWith(page))
 
     const userStore = useUserStore()
     const token = userStore.getAccessToken()

app/modules/Common/components/Button/Button.vue

@@ -1,10 +1,13 @@
 <template>
     <button
         :id="id"
-        :class="[buttonClass, {
-            'cursor-not-allowed': isLoading || disabled,
-            'cursor-pointer': !isLoading && !disabled
-        }]"
+        :class="[
+            buttonClass,
+            {
+                'cursor-not-allowed': isLoading || disabled,
+                'cursor-pointer': !isLoading && !disabled,
+            },
+        ]"
         :disabled="isLoading || disabled"
         @click="handleClick"
         @mouseover="handleMouseOver"
@@ -21,15 +24,14 @@
 
 <script setup lang="ts">
 const props = defineProps<{
-    id?: string;
-    buttonText?: string;
-    isLoading?: boolean;
-    disabled?: boolean;
-    buttonClass?: string;
-    loadingText?: string;
+    id?: string
+    buttonText?: string
+    isLoading?: boolean
+    disabled?: boolean
+    buttonClass?: string
+    loadingText?: string
 }>()
 
-
 const emit = defineEmits<{
     click: []
     mouseover: []
@@ -48,5 +50,4 @@ function handleMouseOver() {
 function handleMouseOut() {
     emit('mouseout')
 }
-
 </script>

app/modules/Common/components/Loading/LoadingSpinner.vue

@@ -5,7 +5,7 @@
         :style="{
             borderColor: 'var(--accent-color)',
             borderTopColor: 'transparent',
-            borderRightColor: 'transparent'
+            borderRightColor: 'transparent',
         }"
     />
 </template>
@@ -34,5 +34,4 @@ const sizeClasses = computed(() => {
     }
     return sizes[props.size]
 })
-
 </script>

app/modules/Common/components/Logo/Logo.vue

@@ -1,6 +1,6 @@
 <template>
     <div :class="divClass">
-        <component :is="isDark ? LogoWhite : LogoBlack" :imgClass="imgClass" />
+        <component :is="isDark ? LogoWhite : LogoBlack" :img-class="imgClass" />
     </div>
 </template>
 

app/modules/Common/components/Logo/LogoBlack.vue

@@ -1,5 +1,5 @@
 <template>
-    <img :src="logoBlack" alt="Yapper logo black" :class="imgClass" />
+    <img :src="logoBlack" alt="Yapper logo black" :class="imgClass" >
 </template>
 
 <script setup lang="ts">

app/modules/Common/components/Logo/LogoWhite.vue

@@ -1,5 +1,5 @@
 <template>
-    <img :src="logoWhite" alt="Yapper logo white" :class="imgClass" />
+    <img :src="logoWhite" alt="Yapper logo white" :class="imgClass" >
 </template>
 
 <script setup lang="ts">