feat(ktl-3977): added new case studies

blocks/case-studies/card/case-studies-card.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import cn from 'classnames';
 import styles from './case-studies-card.module.css';
 import { CaseItem } from '../case-studies';
-import { PlatformIcon } from '../platform-icon/platform-icon';
+import { PlatformIcon, FrameworkIcon } from '../technology-icon/technology-icon';
 import { Markdown } from '../../../utils/mdToHtml';
 import { Theme, ThemeProvider, useThemeWithUndefined } from '@rescui/ui-contexts';
 
@@ -75,13 +75,16 @@ const CaseStudyCardText: React.FC<CaseStudyCardProps> = ({ className, mode, ...i
                     </a>
                 }
 
-                {item.platforms && item.platforms.length > 0 &&
+                {(item.platforms && item.platforms.length > 0) || (item.frameworks && item.frameworks.length > 0) ? (
                     <div className={styles.platforms} aria-label="Platforms">
-                        {item.platforms.map((platform) =>
-                            <PlatformIcon key={platform} platform={platform} />
+                        {item.platforms?.map((platform) =>
+                            <PlatformIcon key={platform} value={platform} />
+                        )}
+                        {item.frameworks?.map((framework) =>
+                            <FrameworkIcon key={framework} value={framework} />
                         )}
                     </div>
-                }
+                ) : null}
             </div>
 
             {item.media &&

blocks/case-studies/case-studies.ts

@@ -20,6 +20,14 @@ export const PlatformNames: Record<typeof Platforms[number], string> = {
 
 export type CasePlatform = typeof Platforms[number] | 'compose-multiplatform';
 
+export const Frameworks = [
+    'spring',
+    'exposed',
+    'ktor',
+] as const;
+
+export type CaseFramework = typeof Frameworks[number];
+
 type Signature = {
     name: string;
     position: string;
@@ -48,6 +56,7 @@ export interface CaseItem {
     logo?: string[];
     signature?: Signature;
     platforms?: CasePlatform[];
+    frameworks?: CaseFramework[];
     media?: Media;
     featuredOnMainPage?: boolean;
 }

blocks/case-studies/platform-icon/platform-icon.module.css → blocks/case-studies/technology-icon/technology-icon.module.css

@@ -1,21 +1,15 @@
-.platform {
+.icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 28px;
   height: 28px;
 }
 
-/* visual compensation */
-.platform_android {
-  width: 30px;
-  height: 30px;
-}
-
-.platform svg {
+.icon svg {
   width: 100%;
   height: 100%;
   object-fit: contain;
   aspect-ratio: unset;
   container: unset;
-}
+}

blocks/case-studies/technology-icon/technology-icon.tsx

@@ -0,0 +1,69 @@
+import cn from 'classnames';
+import {
+    AndroidIcon,
+    AppleIcon,
+    ServerIcon,
+    ComputerIcon,
+    GlobusIcon,
+    SpringIcon,
+    KtorIcon,
+    ExposedIcon,
+} from '@rescui/icons';
+import { CasePlatform, CaseFramework } from '../case-studies';
+import styles from './technology-icon.module.css';
+
+type PlatformIconProps = {
+    value: CasePlatform;
+};
+
+type FrameworkIconProps = {
+    value: CaseFramework;
+};
+
+export const PlatformIcon = ({ value }: PlatformIconProps) => {
+    return (
+        <span className={cn(styles.icon)} title={value}>
+            {getPlatformIcon(value)}
+        </span>
+    );
+};
+
+export const FrameworkIcon = ({ value }: FrameworkIconProps) => {
+    return (
+        <span className={cn(styles.icon)} title={value}>
+            {getFrameworkIcon(value)}
+        </span>
+    );
+};
+
+const getPlatformIcon = (p: CasePlatform) => {
+    switch (p) {
+        case 'android':
+            return <AndroidIcon size="l" />;
+        case 'ios':
+            return <AppleIcon size="l" />;
+        case 'desktop':
+            return <ComputerIcon size="l" />;
+        case 'frontend':
+            return <GlobusIcon size="l" />;
+        case 'backend':
+            return <ServerIcon size="l" />;
+        case 'compose-multiplatform':
+            return <img src="/images/case-studies/compose-multiplatform.svg" alt="" />;
+        default:
+            return null;
+    }
+};
+
+const getFrameworkIcon = (f: CaseFramework) => {
+    switch (f) {
+        case 'spring':
+            return <SpringIcon size="l" />;
+        case 'ktor':
+            return <KtorIcon size="l" />;
+        case 'exposed':
+            return <ExposedIcon size="l" />;
+        default:
+            return null;
+    }
+};

data/case-studies/_case-study.example.yaml

@@ -29,6 +29,9 @@
 # - platforms: list of strings — platform tags shown on the card
 #     Examples: android, ios, desktop, frontend, backend, compose-multiplatform
 #
+# - frameworks: list of strings — framework tags shown on the card
+#     Examples: spring, ktor, exposed
+#
 # - media: object — media block for the card
 #     type: youtube | image
 #     When type: youtube

data/case-studies/case-studies.yml

@@ -397,6 +397,30 @@ items:
       type: image
       path: /images/case-studies/physics-wallah-card-preview.png
   #------------------------------------------------------------------------
+  - id: case-study-amazon
+    type: server-side
+    description: >-
+      How does Kotlin perform at Amazon-scale?
+
+
+      In this talk, Katie Levy, Senior Software Engineer at Amazon Fashion, shares how her team migrated a 10,000-line backend service from Java to Kotlin while powering an AI-driven size recommendation system used by hundreds of millions of customers across 19 locales.
+    logo:
+      - /images/case-studies/amazon-logo.svg
+    media:
+      type: youtube
+      videoId: rvyUgcxfang
+  #------------------------------------------------------------------------
+  - id: case-study-worldline-server-side
+    type: server-side
+    description: >-
+      Discover how Worldline powers digital banking innovation with over one million active users every month. Lead Developer Richard Marchant shares why the team chose Kotlin to build their Conversational Platform from the ground up. From faster feature development to reduced runtime errors, Kotlin’s concise syntax and safety features transformed their workflow. Now, with Kotlin Multiplatform and company-wide training, Worldline is driving a modern, collaborative future in fintech development.
+    logo:
+      - /images/case-studies/worldline-logo.svg
+    carousel: true
+    media:
+      type: youtube
+      videoId: 3IxDICQTutw
+  #------------------------------------------------------------------------
   - id: case-study-vmware
     type: multiplatform
     description: >-
@@ -599,6 +623,17 @@ items:
       - frontend
     link: https://kotlinlang.org/lp/multiplatform/case-studies/mirego
   #------------------------------------------------------------------------
+  - id: case-study-wolt
+    type: server-side
+    description: >-
+      Wolt, a technology company specializing in local commerce and delivery logistics (part of DoorDash),
+      shares how Kotlin has become a core part of their backend systems and engineering culture.
+    logo:
+      - /images/case-studies/wolt-logo.svg
+    media:
+      type: youtube
+      videoId: puBXoKkQInE
+  #------------------------------------------------------------------------
   - id: case-study-music-work
     type: multiplatform
     description: >-
@@ -713,13 +748,21 @@ items:
   - id: case-study-mercedes-benz-io
     type: server-side
     description: >-
-      The **Mercedes-Benz.io** team shares their experience migrating backend services from Java to Kotlin, highlighting the reasons behind the switch, challenges encountered, and the benefits to their development workflows.
+      Tiago, Software Architect at Mercedes-Benz.io, shares how his team builds cloud-native apps with Kotlin and Spring Boot, serving over 3.5 million users daily.
+
+
+      Discover why they moved from Java to Kotlin — cutting boilerplate, improving stability, and speeding up development. Today, Kotlin powers their backend, mobile apps, and multiplatform projects, driving faster, cleaner, and more reliable code.
+
+
+      Watch the video testimonial or [read the article](https://www.mercedes-benz.io/blog/2024-11-22-transitioning-from-java-to-kotlin-in-backend-development).
     logo:
       - /images/case-studies/mercedes-benz-logo.svg
     isExternal: true
     carousel:
       logo: /images/case-studies/carousel/mercedes-benz.svg
-    link: https://www.mercedes-benz.io/blog/2024-11-22-transitioning-from-java-to-kotlin-in-backend-development
+    media:
+      type: youtube
+      videoId: oaJpj18OqY0
   #------------------------------------------------------------------------
   - id: case-study-novatec
     type: server-side
@@ -797,13 +840,15 @@ items:
   - id: case-study-ing
     type: server-side
     description: >-
-      **ING** shares the story of introducing Kotlin on the backend in a large organization, with tips for reducing friction during adoption.
+      ING’s Mobile Banking team shares how they modernized their mission-critical payment engine using Kotlin, supporting 6 million mobile users and processing 4.5 billion payments each year. Moving from a large Java codebase to a cleaner Kotlin architecture improved code quality, stability, and resource efficiency, especially through Kotlin’s null safety and coroutines.
+      For more details, [read the article](https://medium.com/ing-blog/introducing-kotlin-at-ing-a-long-but-rewarding-story-1bfcd3dc8da0) or watch the video below.
     logo:
       - /images/case-studies/ing-logo.svg
     carousel:
       logo: /images/case-studies/carousel/ing.svg
-    isExternal: true
-    link: https://medium.com/ing-blog/introducing-kotlin-at-ing-a-long-but-rewarding-story-1bfcd3dc8da0
+    media:
+      type: youtube
+      videoId: mexcjkGZIm8
   #------------------------------------------------------------------------
   - id: case-study-intuit
     type: server-side

data/schemas/case-studies.json

@@ -75,6 +75,17 @@
           },
           "uniqueItems": true
         },
+        "frameworks": {
+          "type": "array",
+          "items": {
+            "enum": [
+              "spring",
+              "exposed",
+              "ktor"
+            ]
+          },
+          "uniqueItems": true
+        },
         "media": {
           "oneOf": [
             {

package.json

@@ -21,7 +21,7 @@
         "@rescui/colors": "^0.1.6",
         "@rescui/dropdown-menu": "^0.6.1",
         "@rescui/focus-manager": "^0.1.4",
-        "@rescui/icons": "^1.6.2",
+        "@rescui/icons": "^1.7.1",
         "@rescui/input": "^0.8.2",
         "@rescui/menu": "0.9.4",
         "@rescui/switcher": "0.12.3",