Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: elevate download with donation to component level #3869

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

mchen10
Copy link

@mchen10 mchen10 commented Sep 27, 2024

PR Checklist

PR Type

What kind of change does this PR introduce?

  • Bugfix (fixes an issue)
  • Feature (adds functionality)
  • Code style update
  • Refactoring (no functional changes)
  • Build related changes
  • CI related changes
  • Documentation changes
  • Other... Please describe:

What is the current behavior?

The donation modal only shows up in one place in the app that uses DownloadWithDonationAsk.

What is the new behavior?

We want to start showing the modal everywhere where files are downloaded, so I'm elevating DownloadWithDonationAsk to the component level. Immediately, this means that for research update downloads, we will show the donation modal.

Screen.Recording.2024-09-26.at.8.11.27.PM.mov

Does this PR introduce a breaking change?

  • Yes
  • No

Git Issues

Closes #3858

What happens next?

Thanks for the contribution! We try to make sure all PRs are reviewed ahead of our monthly maintainers call (first Monday of the month)

If the PR is working as intended it'll be merged and included in the next platform release, if not changes will be requested and re-reviewed once updated.

If you need more immediate feedback you can try reaching out on Discord in the Community Platform development channel.

@mchen10
Copy link
Author

mchen10 commented Sep 27, 2024

I would love to get some advice on verifying that the component level test + Storybook are correct.

For the component level test, I'm running yarn test from src/components, and I'm pretty sure the test is failing, but I can't actually find any logs or indication for why the failure is happening.

Storybook just isn't loading for me properly either; a combo of TypeError: Failed to fetch dynamically imported module: http://localhost:6006/src/DownloadFileFromLink/DownloadFileFromLink.stories.tsx and Cannot find module '@babel/preset-react'. The former is only happening for DownloadFileFromLink, which makes me suspect something is just wrong with the component/Storybook, but the latter error is happening across Storybook, which feels like something is wrong with my storybook setup.

Figured it out! Was trying to import from oa-components from the component package

@@ -0,0 +1,16 @@
export interface IUploadedFileMeta {
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let me know your thoughts on this! The type is important, but since components are hosted in a separate package, I couldn't access the type in the src/pages package.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That type hasn't been updated in years, so it feels like there won't be too much maintenance burden between the two identical types

Copy link

@jsonDoge jsonDoge Sep 27, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding thoughts, I'd say two options:

  • [Speed is the way] cheap and quick duplicate and leave a comment about other existing matches.
  • [Clean clean clean] there seems to be a shared folder which builds to oa-shared package, which in turn can be used everywhere. This would probably be a good place to put it as there already are some interfaces.

Note: the IImageGalleryItem looks almost exactly like this interface. Extra point to put to shared and creating something like a common interface like FileMeta and extending other ones.

*also I assume you were talking about the src/stores/storage.tsx - IUploadedFileMeta matching interface, if there are even more - more points towards "Clean clean clean".

But would wait for some long time contributors to voice their thoughts too :)

Copy link
Member

@benfurber benfurber Sep 30, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We're generally on a "clean, clean, clean" path atm. Speed lead approaches can be valid but that on this project has created too many issues as contributors change so the areas with technical debt/issues is knowledge not passed on. And yes, typings to 'oa-shared' is the current direction.

#3789 does a lot of type updates, which we're about to merge in and will likely cause a bunch of conflicts with this branch, apologies.

@mchen10 mchen10 force-pushed the 3858-elevate-download-with-donation branch from 7922e02 to 3c825f8 Compare September 27, 2024 03:38
@mchen10 mchen10 force-pushed the 3858-elevate-download-with-donation branch from 3c825f8 to 4496a19 Compare September 27, 2024 03:54
Copy link

cypress bot commented Sep 27, 2024

onearmy-community-platform    Run #6287

Run Properties:  status check passed Passed #6287  •  git commit 4496a19aa2: refactor: elevate download with donation to component level
Project onearmy-community-platform
Branch Review pull/3869
Run status status check passed Passed #6287
Run duration 04m 30s
Commit git commit 4496a19aa2: refactor: elevate download with donation to component level
Committer Michael
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 0
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 65
View all changes introduced in this branch ↗︎

Copy link
Member

@benfurber benfurber left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, thanks @mchen10!

Comment on lines +59 to +63
themeStoreDonationProps={{
body: donationThemes?.body,
iframeSrc: donationThemes?.iframeSrc,
imageURL: donationThemes?.imageURL,
}}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

theme is accessible in the component library, so I don't think this is necessary.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure the right component has been updated here. DownloadFileFromLink certainly isn't right as it includes files now as well as links. I was quite happy with the naming of DownloadWithDonationAsk - does what it says on the tin.

import { DownloadCounter } from '../DownloadCounter/DownloadCounter'
import { DownloadStaticFile } from '../DownloadStaticFile/DownloadStaticFile'

import type { IThemeStoreDonationProps, IUploadedFileMeta } from './types'
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

IUploadedFileMeta can definitely be imported from shared.

Comment on lines +15 to +16
fileLink: string | undefined
files: (IUploadedFileMeta | File | null)[] | undefined
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As one or the other will be provided. Both should be optional.

@benfurber
Copy link
Member

Hey @mchen10, how are you getting on?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: No status
Status: 💬 Changes Requested/with author
Development

Successfully merging this pull request may close these issues.

Drop non-"forDonationRequest" file downloads
3 participants