debugging token data

Author: vlahovivan

.env.sample

@@ -1,2 +1,3 @@
 VITE_API_ENDPOINT=""
-VITE_OAUTH_CLIENT_ID=""
+VITE_OAUTH_CLIENT_ID=""
+VITE_NODE_ENV=development

src/App.tsx

@@ -10,6 +10,7 @@ import Testcase from './screens/Testcase'
 import Uzrast from './screens/Uzrast'
 import About from './components/Informations'
 import { checkUserCategories } from './api/repository'
+import { logger } from './utils/logger'
 
 export type UserType = {
   name: string
@@ -46,17 +47,17 @@ function App() {
   const [categoryData, setCategoryData] = useState<Record<string, string> | undefined>(undefined)
 
   useEffect(() => {
-    console.log('token: ', token)
+    logger('token: ', token)
   }, [token])
 
   useEffect(() => {
-    console.log('user: ', user)
+    logger('user: ', user)
 
     if (!categoryData?.[user?.email || '']) {
       checkUserCategories(['none'])
         .then(res => res.json())
         .then(userCategoryData => {
-          console.log('checkUserCategories response: ', userCategoryData)
+          logger('checkUserCategories response: ', userCategoryData)
           setCategoryData(userCategoryData)
         })
     }
@@ -69,7 +70,7 @@ function App() {
       checkUserCategories(['none'])
         .then(res => res.json())
         .then(userCategoryData => {
-          console.log('checkUserCategories response: ', userCategoryData)
+          logger('checkUserCategories response: ', userCategoryData)
           setCategoryData(userCategoryData)
 
           extractUser(pureToken)

src/api/api.ts

@@ -1,8 +1,10 @@
 import { XFER_KONTESTIS_ORG_ID } from '@/utils/kontestis'
 
-export const JSON_HEADER = {
-  // fali authorization header
-  Authorization: `${localStorage.getItem('SavedLoginToken')}`,
-  'X-Kontestis-Org-Id': XFER_KONTESTIS_ORG_ID,
-  'Content-Type': 'application/json',
+export const JSON_HEADER = () => {
+  return {
+    // fali authorization header
+    Authorization: `${localStorage.getItem('SavedLoginToken')}`,
+    'X-Kontestis-Org-Id': XFER_KONTESTIS_ORG_ID,
+    'Content-Type': 'application/json',
+  }
 }

src/api/repository.ts

@@ -5,7 +5,7 @@ import { INVITE_CODE, getContestID, getInviteCode } from '@/utils/kontestis'
 export const addToContest = () => {
   return fetch(R.joinContest(), {
     method: 'POST',
-    headers: JSON_HEADER,
+    headers: JSON_HEADER(),
     body: JSON.stringify({
       join_code: INVITE_CODE,
     }),
@@ -17,7 +17,7 @@ export const addToContestSpecific = (number: number) => {
 
   return fetch(R.joinContest(), {
     method: 'POST',
-    headers: JSON_HEADER,
+    headers: JSON_HEADER(),
     body: JSON.stringify({
       join_code: inv_code,
     }),
@@ -66,7 +66,7 @@ export const submitSolution = (problemId: string, code: string) => {
   // console.log('submitSolution', problemId, code.substring(0, 100))
   return fetch(R.submissionOfSolution(problemId), {
     method: 'POST',
-    headers: JSON_HEADER,
+    headers: JSON_HEADER(),
     body: JSON.stringify({
       language: 'output-only',
       code: code,
@@ -79,7 +79,7 @@ export type possibleProgrammingLanguages = 'python' | 'c' | 'cpp' | 'go' | 'rust
 export const submitSolution2 = (problemId: string, code: string, language: string) => {
   return fetch(R.submissionOfSolution(problemId), {
     method: 'POST',
-    headers: JSON_HEADER,
+    headers: JSON_HEADER(),
     body: JSON.stringify({
       language: language,
       code: code,
@@ -90,6 +90,6 @@ export const submitSolution2 = (problemId: string, code: string, language: strin
 export const getLeaderboard = (problemNumber: number) => {
   return fetch(R.leaderboard(getContestID(problemNumber)), {
     method: 'GET',
-    headers: JSON_HEADER,
+    headers: JSON_HEADER(),
   })
 }

src/components/Header.tsx

@@ -6,6 +6,7 @@ import { Dispatch, SetStateAction, useContext } from 'react'
 import UserDropdown from './UserDropdown'
 import { addToAllContests } from '@/api/repository'
 import LeaderboardDropdownIcon from '@/screens/leaderboard/LeaderboardDropdownIcon'
+import { logger } from '@/utils/logger'
 
 type HeaderType = {
   setToken: Dispatch<SetStateAction<string>>
@@ -39,7 +40,11 @@ const Header = ({ setToken, setIsLoggedIn }: HeaderType) => {
           return config
         })
       })
-      .then(() => addToAllContests())
+      .then(() => {
+        logger('adding to all contests...')
+        logger('token: ', localStorage.getItem('SavedLoginToken'))
+        addToAllContests()
+      })
   }
 
   return (

src/screens/Testcase.tsx

@@ -15,7 +15,7 @@ const Testcase = () => {
       .then(text => {
         fetch(`https://api.kontestis.ac/api/problem/${ids[0]}/cluster/${ids[1]}/testcase/${ids[2]}`, {
           method: 'PATCH',
-          headers: JSON_HEADER,
+          headers: JSON_HEADER(),
           body: JSON.stringify({
             input: text,
           }),

src/utils/logger.ts

@@ -0,0 +1,6 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+export const logger = (message: any, ...other: any[]) => {
+  if (import.meta.env.VITE_NODE_ENV === 'development') {
+    console.log(message, ...other)
+  }
+}