{{template "base" .}}

{{define "content"}}
    <div class="container">
        <div class="row">
            <div class="col">
                <h1 class="mt-3">User Profile</h1>
                <hr>

                <!-- decide whether or not to display profile pic-->
                <!-- ne = not equal -->
                {{if ne .User.ProfilePic.FileName ""}}
                    <img class="img-fluid" style="max-width: 600px;" src="/static/img/{{.User.ProfilePic.FileName}}" alt="profile-pic">
                {{else}}
                    <p>No profile image uploaded yet... :)</p>
                {{end}}

                <hr>
                <form action="/user/upload-profile-pic" method="post" enctype="multipart/form-data">
                    <label for="formFile" class="form-label">Choose an image</label>
                    <input class="form-control" type="file" name="image" id="formFile" accept="image/gif, image/jpeg, image/png">
                    <input class="btn btn-primary mt-3" type="submit" value="upload">
                </form>
            </div>
        </div>
    </div>
{{end}}
