@extends('layouts.app')

@section('title', 'Add Ingredient')

@section('content')
<div class="container">
    <div class="page-heading">
        <div>
            <div class="eyebrow">Nutrition Database</div>
            <h1>Add Ingredient</h1>
            <p>Add nutrition values per 100 grams.</p>
        </div>
    </div>

    <div class="card">
        <form method="POST" action="{{ route('dashboard.ingredients.store') }}">
            @csrf


<div class="grid grid-2">
    <div class="form-group">
        <label>Ingredient name</label>
        <input
            name="name"
            value="{{ old('name', $ingredient->name ?? '') }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Calories per 100g</label>
        <input
            type="number"
            step="0.01"
            name="calories_per_100g"
            value="{{ old('calories_per_100g', $ingredient->calories_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Protein per 100g</label>
        <input
            type="number"
            step="0.01"
            name="protein_per_100g"
            value="{{ old('protein_per_100g', $ingredient->protein_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Carbohydrates per 100g</label>
        <input
            type="number"
            step="0.01"
            name="carbohydrates_per_100g"
            value="{{ old('carbohydrates_per_100g', $ingredient->carbohydrates_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Fat per 100g</label>
        <input
            type="number"
            step="0.01"
            name="fat_per_100g"
            value="{{ old('fat_per_100g', $ingredient->fat_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Fiber per 100g</label>
        <input
            type="number"
            step="0.01"
            name="fiber_per_100g"
            value="{{ old('fiber_per_100g', $ingredient->fiber_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Sugar per 100g</label>
        <input
            type="number"
            step="0.01"
            name="sugar_per_100g"
            value="{{ old('sugar_per_100g', $ingredient->sugar_per_100g ?? 0) }}"
            required
        >
    </div>

    <div class="form-group">
        <label>Sodium mg per 100g</label>
        <input
            type="number"
            step="0.01"
            name="sodium_per_100g"
            value="{{ old('sodium_per_100g', $ingredient->sodium_per_100g ?? 0) }}"
            required
        >
    </div>
</div>

<div class="form-group">
    <label>Allergens, separated by commas</label>
    <input
        name="allergens"
        value="{{ old('allergens', isset($ingredient) ? implode(', ', $ingredient->allergens ?? []) : '') }}"
        placeholder="milk, eggs, wheat"
    >
</div>

<div class="form-group">
    <label>Dietary tags, separated by commas</label>
    <input
        name="dietary_tags"
        value="{{ old('dietary_tags', isset($ingredient) ? implode(', ', $ingredient->dietary_tags ?? []) : '') }}"
        placeholder="vegan, gluten free, high protein"
    >
</div>


            <button class="btn btn-primary">
                Create Ingredient
            </button>
        </form>
    </div>
</div>
@endsection