outrightmental / agendar Goto Github PK

• Button in lower right corner shows standard Enter Fullscreen icon, click to enter Fullscreen mode
• Upon entering Fullscreen Mode, button changes to standard Exit Fullscreen icon, click to close Fullscreen mode
• Alerts thrown on error, or if browser does not support modern Fullscreen mode

Testing on mobile, it seems that the app is completely blank upon opening. Sometimes is appear in a fresh tab, then disappears after reloading.

Seems similar to https://stackoverflow.com/questions/55568697/blank-page-after-running-build-on-create-react-app

This would be resolved according to https://create-react-app.dev/docs/deployment/ by setting homepage: "." in the package.json

Pending #17 displaying all calendars, it would be ideal for a user to be able to configure which calendars to display

According to https://medium.com/swlh/deploy-create-react-app-to-github-pages-using-github-actions-4e95ae7fd65f

• Save secret ACTIONS_DEPLOY_KEY generated from CI with write access to repo
• Build action to prepare artifacts in a folder for shipment
• Deploy action pushes artifacts to target branch
• Target branch set to serve GitHub pages
• CNAME configured for agendar.outright.io
• HTTPS enabled for https://agendar.outright.io

• Typography and layout of a single calendar event, spans entire width of screen, has default gray base color

Currently unable to login

Don't enter the steady green Now state until the exact second the event has already begun-- by which time you are already attending, right!?

In the app, put a link in the upper left to an About page, including:

• How it works, the fact that we don't access your google data at all, only add value in the presentation layer
• Link to GitHub repository to examine code, deployment and hosting directly through GitHub, and contribute to the project
• Link to Privacy and Terms pages for Outright Mental
• Link to Charney Kaye with note about author's personal utility and the shift towards working from everywhere
• Link to Outright Mental

From our post on HN: HUD for being on time to remote meetings while coding

sand500 1 day ago [–]Site doesn't look quite right on a 4k monitor

lathiat 1 day ago [–]Also broken on Mobile Safari

jtvjan 1 day ago [–]Black text on black background with Firefox Android 68.4.2

Currently it's a pain point to remember to switch between dev and prod env params in the config.js file.

Instead of hard coding the client ids, although they aren't actually secret, it'll be a just-works development/production tooling.

Search for a meta tag we must not currently be using because its value is set through a template variable we certainly aren't using, REACT_APP_GOOGLE_ID_OF_WEB_CLIENT

this is on a mobile device

As a baseline, we'd re-implement the web app using React Native.

To Do

• React native project builds and tests on GitHub actions
• OAuth login to react native web app
• Establish Google OAuth app for React Native App
• OAuth login to react native android app
• Re-implement all features from original web app in native app

Done

• Scaffold React native project
• Redux store
• Engine with tick

In order to complete the user experience of loading their data, and confirm the network transaction was successful.

Currently, when the calendar loads (every 5 minutes) a status message appears instead of the events, which all disappear for a moment.

The expected behavior is that the last know events should be displayed the whole time.

Maybe the status message should appear under the clock? (this would place it on the left side below the clock on larger devices)

And update app the app state, which will update the fullscreen button state to the appropriate state for the device's actual fullscreen state

In order to pass Google OAuth approval process, and prove use in commerce.

They aren't finely time-sensitive, they aren't on your Agendar.

Current deployment mechanism is super smooth but provides no security against deployment by a PR using the keys made available in CI

Upgrade from using bare CSS

This screenshot is from a Pixel 2 size device. Expectation is that the events section would be its own scrolling section

If an upcoming or current reminder is marked done, remove it from Agendar.

As an event approaches and then is currently happening, its status will ve escalated and displayed in a signaling color.

• T-15m APPROACH is brighter gray
• T-5m STANDBY is yellow
• T-2m READY is flashing yellow
• T NOW is green (until event end is past)

In the menu, modify how long into the future we are searching for events.

Current setting is 24 hours.

Defaults are specified in the original feature #34

User opens fullscreen mode, then something else on the device exits fullscreen mode, and we fail to detect it. Failure to exit fullscreen mode should not create alert and fail. It should gracefully assume that we have made a mistake, and quietly set the app state back to isFullscreen: false

If an event has been canceled or my attendance removed, don't show it

Filter out any event whose description contains "This event was added from Goals in Google Calendar."

Content displayed on the site should be written on the index.html page in specially tagged elements.

When the React app starts, it will read these special elements to populate its content inside the menu content

• Remove the bare "logout" link
• Remove the bare "about" link
• Upper right corner is a hamburger app menu with dropdown-- use minimal added style
• Menu includes link to Logout
• Menu includes link to About page

• Logo design
• Logo set for Google OAuth consent screen
• Logo set for all favicon and local media
• Font like https://clock.outright.io/
• Initial load screen should have black background, have logo and say Agendar instead of "Create React App"

• Create application and get credential secrets
• Add google sign in to react app https://codeburst.io/adding-google-sign-in-to-your-webapp-a-react-example-dcec8c73cb9f
• Logout button

• Use google api to read all calendars and events for this user, ala https://developers.google.com/calendar/quickstart/js
• Display events that are happening now or have occurred within the past 24 hours
• Keep view fresh to "now" all day long
• Invalidate cache and re-fetch calendar events after 1 hour has elapsed

• Clock ported from https://clock.outright.io/
• Responsive, in narrow widths the clock appears above the event list, others the clock appears as a left column

If a user has access to multiple calendars, we want to aggregate and display events on all visible calendars.

Nice-to-have is the ability to select and deselect which of the available calendars are being aggregated to view.

Add into README, for now just show status of last github action deploying main branch