orcasound / orcahome

Website redesign for Orcasound homepage static content http://orcasound.net
http://orcasound.net
MIT License
18 stars 29 forks source link

Proposal: GraphQL Implementation #84

Open evanjscallan opened 2 years ago

evanjscallan commented 2 years ago

Hey Team,

I was recently able to connect our graphQL database to NextJS with the idea of integrating back-end data live into Orcahome . The process essentially means one can take orcasite back-end data (at least with graphQL) and implement them into front-end components.

As an example, I've built a "Last Detection" component which takes a timestamp from the most recent user detection log and calculates the time between the timestamp and the current time. The idea is to ultimately increase the interactivity of orcahome by displaying live data to the end-user.

I've provided a link below demonstrating an example:

Working Example https://compassionate-heyrovsky-7e06ad.netlify.app/

Source Code https://github.com/evanjscallan/stylepod2

Notes: -The top text is the last timestamp grab, while the bottom element is the actual 'Last Detection' component. -The development was a brainstorm process so the code is fairly verbose and heavily biased towards class components at the moment.

Ideally what I'd like to do in the future is refactor the code and create an interchangeable 'layer' that devs can send their component through to grab back-end data. Making the data pull modular could save a lot of development time and D.R.Y. issues.

Let me know your thoughts, always open to ideas/critiques/improvements.

(P.S. special thanks to @paulcretu--major headache-saver)

scottveirs commented 1 year ago

Nice work, @evanjscallan ! I'd not seen the demo but observe now (finally) that it's still operational:

Screen Shot 2022-12-21 at 4 47 59 PM

That said, I think there may be a time zone and/or daylight savings math issue. Based on this time (local, Pacific) time stamp of the latest human annotation --

Screen Shot 2022-12-21 at 4 48 19 PM

-- but the time since the annotation should be closer to 6 hours, rather than the computed 17.

evanjscallan commented 1 year ago

Thanks for the heads up, Scott! I've been off the grid onboarding to a new job but I'll give this a look soon.

On Wed, Dec 21, 2022 at 6:53 PM Scott Veirs @.***> wrote:

Nice work, @evanjscallan https://github.com/evanjscallan ! I'd not seen the demo but observe now (finally) that it's still operational:

[image: Screen Shot 2022-12-21 at 4 47 59 PM] https://user-images.githubusercontent.com/14044595/209031014-333557bd-c0a6-49bc-b817-27ff5134512f.png

That said, I think there may be a time zone and/or daylight savings math issue. Based on this time (local, Pacific) time stamp of the latest human annotation --

[image: Screen Shot 2022-12-21 at 4 48 19 PM] https://user-images.githubusercontent.com/14044595/209031037-3afddc15-5905-438d-9208-362841344305.png

-- but the time since the annotation should be closer to 6 hours, rather than the computed 17.

— Reply to this email directly, view it on GitHub https://github.com/orcasound/orcahome/issues/84#issuecomment-1362264852, or unsubscribe https://github.com/notifications/unsubscribe-auth/AT54GGM3FIHDJOOYF72AYALWOOQ6ZANCNFSM5RILHDRA . You are receiving this because you were mentioned.Message ID: @.***>

-- Evan Scallan @.*** (972)-322-9413

UXBrendan commented 1 year ago

@evanjscallan - Let me know if this issue is complete, or if you need anything from me to move forward toward completion.

evanjscallan commented 1 year ago

@UXBrendan I'll try to give this a look this week and see if I can work out the timezone issue. Will keep you posted.

evanjscallan commented 1 year ago

@UXBrendan I believe I have a fix for the time zone issue through specifying UTC for the current date and date of last activity. I have also overhauled the util component and LastDetection button to accommodate typescript and allow for easier readability. Please see PR #93 for details.

If you'd like to test out the fix, you can simply add the component in the 'return' portion of Layout.tsx to view the button.

UXBrendan commented 1 year ago

Hi @evanjscallan

Just checking in with you about this issue. Let me know if you have any blockers or are done.

evanjscallan commented 1 year ago

Hey @UXBrendan, while I don't know of any implemented frontend use for the feature, the issue should be resolved.

evanjscallan commented 1 year ago

The issue's resolution is pending review/approval in the PR