-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
moved react logic from template files into their own .js files
- Loading branch information
1 parent
a58ae16
commit 47e286f
Showing
10 changed files
with
316 additions
and
206 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| 'use strict'; | ||
| const e = React.createElement; | ||
|
|
||
| class Home extends React.Component { | ||
| render() { | ||
| return e( | ||
| 'div', | ||
| null, | ||
| React.createElement( | ||
| 'div', | ||
| { | ||
| className: "py-24 flex h-100", | ||
| style: {background: "linear-gradient(90deg, #667eea 0%, #764ba2 100%)"} | ||
| }, | ||
| React.createElement( | ||
| "div", | ||
| { | ||
| className: "container mx-auto px-6" | ||
| }, | ||
| React.createElement( | ||
| "h2", | ||
| { | ||
| className: "my-4 text-4xl font-bold mb-2 text-white" | ||
| }, | ||
| "DirectReport." | ||
| ), | ||
| React.createElement( | ||
| "h3", | ||
| { | ||
| className: "my-8 text-2xl mb-12 text-gray-200" | ||
| }, | ||
| "Keep track of your accomplishments each day of the workweek." | ||
| ), | ||
| React.createElement( | ||
| "div", | ||
| { | ||
| className: "my-8" | ||
| }, | ||
| React.createElement( | ||
| "a", | ||
| { | ||
| className: "my-12 px-14 py-5 text-lg font-bold text-center text-white bg-gray-400 rounded-full hover:bg-blue-800 shadow-lg uppercase", | ||
| href: "https://github.com/chriswebb09/DirectReport" | ||
| }, | ||
| "Github" | ||
| ) | ||
| ) | ||
| ) | ||
| ) | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| const domContainer = document.querySelector('#root'); | ||
| ReactDOM.render(e(Home), domContainer); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,148 @@ | ||
| const { useState, useEffect } = React; | ||
|
|
||
| const TeamData = () => { | ||
| const [teamData, setTeamData] = useState({}); | ||
| const [commentText, setCommentText] = useState("") | ||
| const [generatedEmail, setGeneratedEmail] = useState("") | ||
| const [isOpened, setIsOpened] = useState(false); | ||
| const [isHidden, setIsHidden] = useState(false); | ||
|
|
||
|
|
||
| const handleSubmit = e => { | ||
| e.preventDefault() | ||
| var dataForm = { | ||
| "prompt": commentText | ||
| }; | ||
| const formDataJsonString = JSON.stringify(dataForm); | ||
| fetch("/report", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| "Accept": "application/json" | ||
| }, | ||
| body: formDataJsonString | ||
| }).then(function(res) { | ||
| return res.json(); | ||
| }).then(function(data) { | ||
| setTeamData(data); | ||
| toggle(); | ||
| }); | ||
| }; | ||
|
|
||
| function toggle() { | ||
| setIsOpened(wasOpened => !wasOpened); | ||
| } | ||
|
|
||
| function toggleHide() { | ||
| setIsHidden(wasHidden => !wasHidden); | ||
| } | ||
|
|
||
|
|
||
| const handleClick = e => { | ||
| e.preventDefault() | ||
| var dataForm = { | ||
| "prompt": JSON.stringify(teamData) | ||
| }; | ||
| const formDataJsonString = JSON.stringify(dataForm); | ||
| fetch("/generate_email", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| "Accept": "application/json" | ||
| }, | ||
| body: formDataJsonString | ||
| }).then(function(res) { | ||
| return res.json(); | ||
| }).then(function(data) { | ||
| setGeneratedEmail(data["email"]); | ||
| toggleHide(); | ||
| }); | ||
| } | ||
|
|
||
| return ( | ||
| <div> | ||
| <h1 class="self-center text-center text-4xl text-indigo-800 tracking-wide text-center font-black mb-14 mx-20 px-20">Generate Team Report From Metadata</h1> | ||
| <div class="grid grid-cols-3 gap-10 mt-10 mb-20 mx-20"> | ||
| <div class="col-span-1 justify-center my-10" id="edit_summary_div"> | ||
| <div class="shadow-lg py-1 border-4 border-indigo-600 rounded-2xl px-30 mb-10"> | ||
| <form class=" py-2 px-2" onSubmit={handleSubmit}> | ||
| <h1 class="self-center text-center text-indigo-700 tracking-wide text-2xl text-center font-bold mb-4 mt-6">Enter Github Data</h1> | ||
| <div class="self-center mb-6 mt-5"> | ||
| <div class="py-4 px-10 mx-0 min-w-full flex flex-col items-center"> | ||
| <textarea id="prompt_input" cols="40" rows="13" class="self-center border-4 border-indigo-700 w-90 sm:w-90 text-base tracking-wide text-indigo-700 placeholder-white border rounded-2xl focus:shadow-outline" value={commentText} onChange={e => setCommentText(e.target.value)} ></textarea> | ||
| </div> | ||
| <div class="px-10 mx-0 min-w-full flex flex-col items-center"> | ||
| <button id="submit_prompt_btn" class="shadow-md w-80 sm:w-90 tracking-wide bg-white hover:bg-indigo-700 text-indigo-700 hover:text-white border-4 border-indigo-700 hover:border-gray-200 text-xl font-semibold py-4 px-10 rounded-lg mt-10" type="submit">Generate</button> | ||
| </div> | ||
| </div> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| <div id="show_summmary_div" class="col-span-1 justify-center my-10"> | ||
| <div class="shadow-lg border-4 border-indigo-700 rounded-2xl px-30 mb-10"> | ||
| <h1 class="self-center text-center text-2xl tracking-wide text-indigo-700 text-center font-bold mb-10 mt-10 mx-20 px-20">Summary</h1> | ||
| <div id="summary" class="px-5 mx-0 mb-9 mt-9"> | ||
| {isOpened && ( | ||
| <div id="summary-container" class="bg-white ml-10 mr-10 overflow-y-scroll h-90 rounded-2xl border-4 border-indigo-700 tracking-wide text-gray-500 md:text-gl dark:text-gray-400 mt-8 mb-14 px-1 py-4"> | ||
| <p id="show_summary" class="w-90 sm:w-90 overflow-y-auto break-words"> | ||
| { teamData["report"] !== undefined ? | ||
| <div className="my-7 px-5 text-lg tracking-wide text-indigo-700">{teamData["report"]["summary"]}</div> | ||
| : null | ||
| } | ||
| </p> | ||
| <div class="h-80"> | ||
| <ul className="px-5"> | ||
| {teamData["report"] && | ||
| teamData["report"]["highlights"].map(hightlight => | ||
| <li className="mb-3"> | ||
| <h3 className="font-bold text-lg mb-1 tracking-wide text-indigo-700">{hightlight.title}</h3> | ||
| <p class="w-90 sm:w-90 overflow-y-auto text-lg font-md break-words tracking-wide text-indigo-700">{hightlight.description}</p> | ||
| </li> | ||
| )} | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| )} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div id="team_member_to_select" class="col-span-1 justify-center my-10"> | ||
| <div class="shadow-lg py-1 border-4 border-indigo-700 rounded-2xl px-9 mb-9"> | ||
| <h1 class="self-center text-center text-2xl tracking-wide text-indigo-700 text-center font-bold mb-6 mt-8 mx-20 px-20"> | ||
| Team</h1> | ||
| <div id="display_team" class="mb-6 my-9"></div> | ||
| {isOpened && ( | ||
| <div className="content-center py-2 h-90 rounded-2xl ml-6 mb-12 border-4 border-indigo-700 mx-5 px-3"> | ||
| <div class="items-center my-6 mx-2 px-4 select-none"> | ||
| {teamData["team"] && | ||
| teamData["team"].map(teammember => | ||
| <button className="py-1 px-4 pb-2 pt-2.5 mr-3 my-2 shadow-md no-underline rounded-full text-indigo-700 font-sans border-4 font-bold text-sm border-indigo-700 btn-primary hover:text-white hover:bg-indigo-700 focus:outline-none active:shadow-none">{teammember.name}</button> | ||
| )} | ||
| </div> | ||
| </div> | ||
| )} | ||
| </div> | ||
| </div> | ||
| <div class="col-span-3 my-12 ml-10 mr-10 mb-10 mt-40"> | ||
| <div class="shadow-lg py-3 border-4 border-indigo-700 rounded-2xl px-30"> | ||
| <h1 class="self-center text-center text-2xl text-indigo-700 tracking-wide font-bold w-100 mb-10 mt-10">Generated Email</h1> | ||
| {isHidden && ( | ||
| <div id ="text-content" class="bg-white ml-20 mr-20 rounded-2xl py-20 tracking-wide text-gray-500 md:text-md dark:text-gray-400 px-20 mx-20 my-10"> | ||
| {generatedEmail} | ||
| </div> | ||
| )} | ||
| {isOpened && ( | ||
| <div class="py-10 px-10 min-w-full flex flex-col items-center"> | ||
| <button type="button" id="generate_email_btn" class="shadow-md w-80 sm:w-90 bg-white hover:bg-black border-4 border-indigo-700 text-indigo-700 text-xl font-semibold py-4 px-10 rounded-lg" onClick={handleClick}>Generate Email</button> | ||
| </div> | ||
| )} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| ); | ||
| }; | ||
|
|
||
| const domContainer = document.querySelector('#root'); | ||
| ReactDOM.render(<TeamData />, domContainer); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| <footer class="bottom-0 bg-white rounded-lg shadow m-4 dark:bg-gray-800"> | ||
| <div class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-between"> | ||
| <span class="text-sm text-gray-500 sm:text-center dark:text-gray-400">© 2023 <a href="/" class="hover:underline">DirectReport.™</a>. All Rights Reserved. | ||
| </span> | ||
| <ul class="flex flex-wrap items-center mt-3 text-sm font-medium text-gray-500 dark:text-gray-400 sm:mt-0"> | ||
| <li><a href="#" class="mr-4 hover:underline md:mr-6 ">About</a></li> | ||
| <li><a href="#" class="mr-4 hover:underline md:mr-6">Privacy Policy</a></li> | ||
| <li><a href="#" class="mr-4 hover:underline md:mr-6">Licensing</a></li> | ||
| <li><a href="#" class="hover:underline">Contact</a></li> | ||
| </ul> | ||
| </div> | ||
| </footer> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| <nav class="bg-gray-900 text-white w-screen"> | ||
| <div class="px-14 py-6 flex w-full items-center"> | ||
| <a class="ml-14 w-3/4 text-2xl font-bold" href="/">DirectReport.</a> | ||
| <ul class="flex px-6 font-semibold font-heading space-x-18"> | ||
| <li><a class="px-6 text-xl hover:text-gray-200" href="/teamreport">Reports</a></li> | ||
| <li><a class="px-6 text-xl hover:text-gray-200" href="https://chriswebb09.github.io/DirectReport/">Docs</a></li> | ||
| <li><a class="px-6 text-xl hover:text-gray-200" href="/account">Account</a></li> | ||
| </ul> | ||
| </div> | ||
| </nav> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.