// src/components/CameraPermissionButton.stories.tsx
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { CameraPermissionButton } from './CameraPermissionButton';
import { action } from '@storybook/addon-actions';

import { useCameraPermission } from '../hooks/useCameraPermission';
import { PermissionStatus } from './PermissionStatus';


export default {
  title: 'Components/CameraPermissionButton',
  component: CameraPermissionButton,
} as ComponentMeta<typeof CameraPermissionButton>;

const Template: ComponentStory<typeof CameraPermissionButton> = (args) => {
  const { permissionState } = useCameraPermission();
  return (
  <>
  <CameraPermissionButton {...args} />
  
  <PermissionStatus permissionType="camera" state={permissionState} />
  
  </>
    )
};

export const Default = Template.bind({});
Default.args = {
  buttonText: 'Request Camera Permission',
  className: 'camera-button',
  onGranted: action('Permission granted'),
  onDenied: action('Permission denied'),
};