feat(muk): Migrate use micro region hook

[aboungnaseng-ovhcloud]

🎯 Overview

Refactored the useTranslatedMicroRegions hook to use centralized translations from @ovh-ux/manager-common-translations instead of maintaining duplicate translation files locally. Improved code organization and added comprehensive Storybook documentation.

🗑️ Cleanup - Translation Files Removed (8 files, -2,304 lines)

Removed duplicate translation files that are now provided by @ovh-ux/manager-common-translations:

- translations/Messages_de_DE.json (288 lines)
- translations/Messages_en_GB.json (288 lines)
- translations/Messages_es_ES.json (288 lines)
- translations/Messages_fr_CA.json (288 lines)
- translations/Messages_fr_FR.json (288 lines)
- translations/Messages_it_IT.json (288 lines)
- translations/Messages_pl_PL.json (288 lines)
- translations/Messages_pt_PT.json (288 lines)
- translations/index.ts

♻️ Refactored Code

useTranslatedMicroRegions.tsx

Before:

import './translations';
const { t } = useTranslation();

After:

import { NAMESPACES } from '@ovh-ux/manager-common-translations';
const { t } = useTranslation(NAMESPACES.REGION);

Key Changes:

• ✅ Uses centralized NAMESPACES.REGION constant
• ✅ No longer imports local translations
• ✅ Consistent with other hooks across the project
• ✅ Improved translation key existence checking with i18n.exists()

useTranslatedMicroRegions.utils.ts (NEW)

Extracted utility functions for better separation of concerns:

• getMacroRegion(region: string) - Parses region string to extract macro-region identifier
• isLocalZone(region: string) - Detects if a region is a local zone (contains 'LZ' pattern)

📚 Documentation Added

Storybook Stories (NEW)

useTranslatedMicroRegions.stories.tsx with 5 interactive examples:

1. StandardRegion - GRA-1 (Gravelines)
2. LocalZone - EU-WEST-LZ-MAD-A (Madrid Local Zone)
3. SingleSegment - WES1 (West)
4. MultiSegment - US-EAST-VA-1 (Virginia)
5. UnknownRegion - Edge case handling

Comprehensive Documentation (NEW)

documentation.mdx includes:

• ✅ Overview of OVHcloud region naming conventions
• ✅ Basic usage examples
• ✅ API reference with TypeScript signatures
• ✅ Region format examples (4 different formats)
• ✅ Technical explanation of macro-region extraction
• ✅ Translation key patterns
• ✅ 3 practical use cases:
  • Display region in dropdown
  • Show region hierarchy
  • Filter by continent
• ✅ Local zone detection guide
• ✅ Best practices
• ✅ Complete API reference table

🏗️ Code Organization

Test Files Reorganized

- src/hooks/region/useTranslatedMicroRegions.spec.tsx
+ src/hooks/region/__tests__/useTranslatedMicroRegions.spec.tsx

Export Structure

Updated src/hooks/index.ts:

- export { useTranslatedMicroRegion } from './region/useTranslatedMicroRegions';
+ export { useTranslatedMicroRegions } from './region';
+ export { getMacroRegion, isLocalZone } from './region/useTranslatedMicroRegions.utils';

Created src/hooks/region/index.ts:

export { useTranslatedMicroRegions } from './useTranslatedMicroRegions';
export * from './useTranslatedMicroRegions.utils';

📊 API

Hook Returns

Method	Type	Description
translateMicroRegion	(region: string) => string	Full region name with zone
translateMacroRegion	(region: string) => string	Geographic area name
translateContinentRegion	(region: string) => string	Continent name

Utility Functions

Function	Type	Description
getMacroRegion	(region: string) => string	Extract macro-region from region code
isLocalZone	(region: string) => boolean	Check if region is a local zone

✅ Benefits

1. Reduced Bundle Size - Removed 2,304 lines of duplicate translations
2. Single Source of Truth - Translations now managed in @ovh-ux/manager-common-translations
3. Better Maintainability - No need to sync translations across multiple files
4. Improved Documentation - Interactive examples and comprehensive guide
5. Better Code Organization - Utilities separated from main hook
6. Consistent Exports - Follows project patterns

📊 Statistics

• 16 files changed
• +374 additions
• -2,352 deletions
• Net: -1,978 lines (improved code efficiency)

🔗 Reference

• Ticket: #MANAGER-19192
• Namespace: NAMESPACES.REGION
• Package: @ovh-ux/manager-common-translations