/*
 * File: DashboardHeader.tsx
 * Description: Dashboard header component displaying ER department overview and statistics
 * Design & Developed by Tech4Biz Solutions
 * Copyright (c) Spurrin Innovations. All rights reserved.
 */

import React from 'react';
import {
  View,
  Text,
  StyleSheet,
} from 'react-native';
import { theme } from '../../../theme/theme';
import { ERDashboard } from '../../../shared/types/dashboard';

interface DashboardHeaderProps {
  dashboard: ERDashboard;
}

export const DashboardHeader: React.FC<DashboardHeaderProps> = ({
  dashboard,
}) => {
  return (
    <View style={styles.container}>
      <View style={styles.header}>
        <Text style={styles.title}>Emergency Department</Text>
        <Text style={styles.subtitle}>
          {dashboard.shiftInfo.currentShift} Shift • {dashboard.shiftInfo.attendingPhysician}
        </Text>
      </View>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    backgroundColor: theme.colors.background,
    borderRadius: theme.borderRadius.large,
    padding: theme.spacing.lg,
    marginBottom: theme.spacing.lg,
    ...theme.shadows.medium,
  },
  title: {
    fontSize: theme.typography.fontSize.displayMedium,
    fontFamily: theme.typography.fontFamily.bold,
    color: theme.colors.textPrimary,
    marginBottom: theme.spacing.xs,
  },
  subtitle: {
    fontSize: theme.typography.fontSize.bodyMedium,
    color: theme.colors.textSecondary,
  },
});

/*
 * End of File: DashboardHeader.tsx
 * Design & Developed by Tech4Biz Solutions
 * Copyright (c) Spurrin Innovations. All rights reserved.
 */