change order of technology component

src/data/loaders/portfolio.ts

@@ -0,0 +1,119 @@
+import { createServerFn } from '@tanstack/react-start'
+import type { TExperience, TEducation, TSkillGroup } from '#/types/strapi'
+import {
+  experiences as fallbackExperiences,
+  educations as fallbackEducations,
+  skillGroups as fallbackSkillGroups,
+} from '#/data/portfolio'
+
+const STRAPI_BASE = process.env['STRAPI_URL'] ?? 'https://strapi.moshariri.com'
+
+const buildHeaders = (): Record<string, string> => {
+  const token = process.env['STRAPI_API_TOKEN']
+  return token ? { Authorization: `Bearer ${token}` } : {}
+}
+
+const fetchFromStrapi = async <T>(path: string): Promise<{ data: T[] }> => {
+  const url = `${STRAPI_BASE}/api${path}`
+  console.log(`[Strapi] → GET ${url}`)
+  const response = await fetch(url, { headers: buildHeaders() })
+  if (!response.ok) {
+    throw new Error(`Strapi request failed: ${response.status} ${url}`)
+  }
+  const json = (await response.json()) as { data: T[] }
+  console.log(`[Strapi] ← GET ${url} (${json.data.length} items)`)
+  return json
+}
+
+export const fetchExperiences = createServerFn({ method: 'GET' }).handler(
+  async (): Promise<TExperience[]> => {
+    try {
+      const { data } = await fetchFromStrapi<TExperience>(
+        '/experiences?sort=order:asc&populate=*',
+      )
+      return data.map((item) => ({
+        id: item.id,
+        company: item.company,
+        role: item.role,
+        employmentType: item.employmentType,
+        startDate: item.startDate,
+        endDate: item.endDate,
+        location: item.location,
+        bullets: item.bullets ?? [],
+        tech: item.tech ?? [],
+        order: item.order,
+      }))
+    } catch (err) {
+      console.error('[Strapi] fetchExperiences failed, using fallback:', err)
+      return fallbackExperiences.map((e, i) => ({
+        id: i,
+        company: e.company,
+        role: e.role,
+        employmentType:
+          e.type === 'Full-time' ? 'full-time' : ('part-time' as const),
+        startDate: e.startDate,
+        endDate: e.endDate ?? undefined,
+        location: e.location,
+        bullets: [...e.bullets],
+        tech: [...e.tech],
+        order: i,
+      }))
+    }
+  },
+)
+
+export const fetchEducations = createServerFn({ method: 'GET' }).handler(
+  async (): Promise<TEducation[]> => {
+    try {
+      const { data } = await fetchFromStrapi<TEducation>(
+        '/educations?sort=order:asc&populate=*',
+      )
+      return data.map((item) => ({
+        id: item.id,
+        institution: item.institution,
+        degree: item.degree,
+        fieldOfStudy: item.fieldOfStudy,
+        startYear: item.startYear,
+        endYear: item.endYear,
+        grade: item.grade,
+        order: item.order,
+      }))
+    } catch (err) {
+      console.error('[Strapi] fetchEducations failed, using fallback:', err)
+      return fallbackEducations.map((e, i) => ({
+        id: i,
+        institution: e.institution,
+        degree: e.degree,
+        fieldOfStudy: undefined,
+        startYear: e.startYear,
+        endYear: e.endYear,
+        grade: e.grade ?? undefined,
+        order: i,
+      }))
+    }
+  },
+)
+
+export const fetchSkillGroups = createServerFn({ method: 'GET' }).handler(
+  async (): Promise<TSkillGroup[]> => {
+    try {
+      const { data } = await fetchFromStrapi<TSkillGroup>(
+        '/skill-groups?sort=order:asc&populate=*',
+      )
+      return data.map((item) => ({
+        id: item.id,
+        category: item.category,
+        skills: item.skills ?? [],
+        order: item.order,
+      }))
+    } catch (err) {
+      console.error('[Strapi] fetchSkillGroups failed, using fallback:', err)
+      return fallbackSkillGroups.map((g, i) => ({
+        id: i,
+        category: g.category,
+        skills: [...g.skills],
+        order: i,
+      }))
+    }
+  },
+)

src/data/strapi-sdk.ts

@@ -1,6 +1,6 @@
 import { strapi } from '@strapi/client'
 
-// Strapi base URL (without /api)
+// Strapi base URL (without /api) — client-safe env var only
 const STRAPI_BASE = import.meta.env.VITE_STRAPI_URL ?? 'http://localhost:1337'
 
 // Initialize the Strapi SDK with /api endpoint