npm package: @nappr/nappr-config
Description: Librairie de gestion de configuration. Permet de centraliser et d'accéder facilement à la configuration d'une  application.
Latest version: 0.2.2

# @nappr/nappr-config

Librairie de gestion de configuration.
Permet de centraliser et d'accéder facilement à la configuration d'une  application.

- [@nappr/nappr-config](#napprnappr-config)
  - [🔧 Installation](#-installation)
  - [🚀 Utilisation](#-utilisation)
    - [1. Configuration du Provider](#1-configuration-du-provider)
    - [2. Utilisation dans un composant React](#2-utilisation-dans-un-composant-react)
    - [3. Utilisation hors composant React](#3-utilisation-hors-composant-react)
  - [📚 API Publique](#-api-publique)
    - [useConfigByName](#useconfigbyname)
    - [ConfigService.getConfigByName](#configservicegetconfigbyname)
    - [ConfigService.isInitialized](#configserviceisinitialized)
  - [💡 Exemples](#-exemples)
    - [Configuration complexe](#configuration-complexe)
    - [Utilisation dans différents contextes](#utilisation-dans-différents-contextes)
    - [Tests](#tests)
  - [📝 Notes importantes](#-notes-importantes)
  - [📄 Licence](#-licence)


## 🔧 Installation

```bash
yarn add @nappr/nappr-config
```

## 🚀 Utilisation

### 1. Configuration du Provider

Enveloppez votre application avec le `ConfigProvider` :

```tsx
import { ConfigProvider } from '@nappr/nappr-config';

const appConfig = {
  api: {
    baseUrl: 'https://api.example.com',
    timeout: 5000,
  },
  features: {
    enableAnalytics: true,
    enableNotifications: false,
  },
};

function App() {
  return (
    <ConfigProvider appConfig={appConfig}>
      <YourApp />
    </ConfigProvider>
  );
}
```

### 2. Utilisation dans un composant React

Utilisez le hook `useConfig` dans vos composants :

```tsx
import { useConfig } from '@nappr/nappr-config';

function MyComponent() {
  const apiUrl = useConfig<string>('api.baseUrl');
  const timeout = useConfig<number>('api.timeout');
  const enableAnalytics = useConfig<boolean>('features.enableAnalytics');

  return <div>API URL: {apiUrl}</div>;
}
```

### 3. Utilisation hors composant React

Utilisez le service statique `ConfigService` dans vos fichiers utilitaires, services, etc. :

```typescript
import { ConfigService } from '@nappr/nappr-config';

// Dans un fichier utilitaire ou service
export function createApiClient() {
  const baseUrl = ConfigService.getConfigByName<string>('api.baseUrl');
  const timeout = ConfigService.getConfigByName<number>('api.timeout');

  return new ApiClient({ baseUrl, timeout });
}
```

## 📚 API Publique

### useConfigByName

Hook React pour récupérer une valeur de configuration.

```tsx
const layout = useConfigByName<LayoutConfigInterface>('layout');
// const baseUrl = useConfigByName<string>('api.baseUrl');
```

### ConfigService.getConfigByName

Récupère une valeur de configuration par son nom.

```typescript
const baseUrl = ConfigService.getConfigByName<string>('api.baseUrl');
```

### ConfigService.isInitialized

Vérifie si le service a été initialisé.

```typescript
const isInitialized = ConfigService.isInitialized();
```

## 💡 Exemples

### Configuration complexe

```typescript
const appConfig = {
  api: {
    baseUrl: 'https://api.example.com',
    timeout: 5000,
    retries: 3,
  },
  features: {
    enableAnalytics: true,
    enableNotifications: false,
    enableDarkMode: true,
  },
  ui: {
    theme: 'dark',
    language: 'fr',
    itemsPerPage: 20,
  },
};
```

### Utilisation dans différents contextes

```tsx
// Dans un composant React
function ApiComponent() {
  const baseUrl = useConfigByName<string>('api.baseUrl');
  const timeout = useConfigByName<number>('api.timeout');

  useEffect(() => {
    fetch(`${baseUrl}/data`, { timeout });
  }, [baseUrl, timeout]);

  return <div>Loading...</div>;
}

// Dans un service
import { ConfigService } from '@nappr/nappr-config';

export class ApiService {
  private baseUrl: string;
  private timeout: number;

  constructor() {
    this.baseUrl = ConfigService.getConfigByName<string>('api.baseUrl');
    this.timeout = ConfigService.getConfigByName<number>('api.timeout');
  }

  async fetchData() {
    // Utilisation de la configuration
  }
}

// Dans un utilitaire
import { ConfigService } from '@nappr/nappr-config';

export function getApiEndpoint(path: string): string {
  const baseUrl = ConfigService.getConfigByName<string>('api.baseUrl');
  return `${baseUrl}${path}`;
}
```

### Tests

```typescript
import { ConfigService } from '@nappr/nappr-config';

describe('MyComponent', () => {
  beforeEach(() => {
    ConfigService.initialize({
      api: { baseUrl: 'http://test-api.com' },
    });
  });

  afterEach(() => {
    ConfigService.reset();
  });
});
```

## 📝 Notes importantes

1. **Provider requis** : Tous les composants utilisant `useConfig` doivent être enfants de `ConfigProvider`
1. **Initialisation** : Le `ConfigProvider` initialise automatiquement le `ConfigService`
1. **Immutabilité** : La configuration fournie via `appConfig` n'est pas modifiée par le module
&. **Chemin pointé** : Utilisez la notation pointée pour accéder aux valeurs imbriquées (ex: `"api.baseUrl"`)

## 📄 Licence

Ce projet est privé et réservé à l'usage interne.