Skip to content
This repository has been archived by the owner on Oct 4, 2023. It is now read-only.

[C-2676] Rough release date modal #3610

Merged
merged 20 commits into from
Jun 20, 2023
Merged

Conversation

amendelsohn
Copy link
Contributor

@amendelsohn amendelsohn commented Jun 15, 2023

Description

  • Styled display component for release date field
  • Release date modal
  • Un-styled date picker input

Future work:

  • Style the date picker
  • Extract the shared modal display and styling into a common pattern/component for re-use
Screenshot 2023-06-15 at 6 08 37 PM

image

Feature Flags

UPLOAD_REDESIGN_ENABLED

@amendelsohn amendelsohn requested review from a team and Kyle-Shanks and removed request for a team June 15, 2023 23:12
@amendelsohn amendelsohn requested a review from a team June 15, 2023 23:12
@socket-security
Copy link

New and updated dependency changes detected. Learn more about Socket for GitHub ↗︎

Packages Version New capabilities Transitives1 Size Publisher
@types/react-dates 🆕 21.8.3 None +2 4.28 MB types

Footnotes

  1. https://docs.socket.dev

@@ -160,5 +160,6 @@
--font-medium: 500;
--font-demi-bold: 600;
--font-bold: 700;
--font-extra-bold: 800;
Copy link
Contributor

Choose a reason for hiding this comment

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

figured we would need this at some point haha. did you have to add another font file for this or did it just work?


}

/* TODO: figure out how to do this as .modal .title */
Copy link
Contributor

Choose a reason for hiding this comment

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

do you still need to do this?

border: 1px solid var(--neutral-light-7);
border-radius: 2px;

font-family: 'Avenir Next LT Pro';
Copy link
Contributor

Choose a reason for hiding this comment

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

is this different from the --font-family css var value?

const close = () => setIsModalOpen(false)

const modal = (
<div className={styles.modal}>
Copy link
Contributor

Choose a reason for hiding this comment

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

is this outer div needed? I might have missed the styles for this being set

<div className={styles.modal}>
<Modal onClose={close} isOpen={isModalOpen}>
<ModalHeader>
<div className={styles.modalHeader}>
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: are we able to add this class name to the ModalHeader instead of adding another div?


export const DatePickerField = (props: DatePickerFieldProps) => {
const { name, label, style } = props
const [field, , helpers] = useField(name)
Copy link
Contributor

Choose a reason for hiding this comment

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

ah does it complain if you do the underscore thing? this hurts my eyes, but may be what we agreed to do

Copy link
Contributor

@Kyle-Shanks Kyle-Shanks left a comment

Choose a reason for hiding this comment

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

Good stuff! Just a few nits about styling and html bologna

@audius-infra
Copy link
Collaborator

Preview this change https://demo.audius.co/amendel-upload-release-date

@amendelsohn amendelsohn merged commit 9a98157 into main Jun 20, 2023
@amendelsohn amendelsohn deleted the amendel-upload-release-date branch June 20, 2023 17:28
audius-infra pushed a commit that referenced this pull request Jun 24, 2023
[fe5fda4] Fix entity button widths (#3650) Dylan Jeffers
[820e79e] Fix user profile always showing artist tabs (#3648) Dylan Jeffers
[bc34b6f] [C-2697] Fix mobile playlist qa issues (#3638) Dylan Jeffers
[3e8d7e8] Mobile chats recalculate container bottom on keyboard shown (#3644) Reed
[39928cf] Bump app versions for full release (#3643) Reed
[437e971] Update SDK to v3.0.3-beta.56 (#3641) Marcus Pasell
[3e42cb2] [PAY-1526] Mobile chat reaction picker shadow (#3642) Reed
[ab33206] Amplitude tracking for chat report abuse (#3639) Reed
[6f570c6] Put playlist-artwork generation behind flag (#3640) Dylan Jeffers
[2f1f40d] [C-2475] Add desktop favorites playlist tab (#3637) Dylan Jeffers
[394cacb] [PAY-1516] Chat report abuse flow (#3636) Reed
[82204ec] [C-2763] Fix desktop playlist qa issues (#3634) Dylan Jeffers
[3912407] Implement OAuth Write Popup C-2664 (#3628) nicoback2
[7e13b54] [C-2783] Add terms of service link (#3635) Dylan Jeffers
[bda6eeb] Refactor: extract reusable modal field component (#3631) Andrew Mendelsohn
[c2a59dc] [PAY-1319] Fix emoji keyboard overlapping chat text input (#3629) Reed
[14150ec] [C-2784] Refactor track page to use entity button (#3624) Dylan Jeffers
[5a3e74e] [PAY-1457] Add amplitude analytics to chat features (#3627) Marcus Pasell
[d1aee10] [PAY-1412] Reset player state on app load (#3632) Reed
[965330c] [PAY-1191] Finesse keyboard enter/exit animations (#3633) Michael Piazza
[c9c531e] Create grant upon making developer app (#3630) nicoback2
[a33de30] [PAY-1464] DMs: Go to chat after successful tip (#3625) Marcus Pasell
[646a5eb] [PLAT-1015] Remove entity manager feature flag (#3619) Raymond Jacobson
[31450e7] [PAY-1498][PAY-1477] Misc mobile DMs UI Fixes (#3626) Michael Piazza
[a08f3e7] [C-2760, C-2779] Fix header for playlist and artists tabs in explore screen (#3579) Kyle Shanks
[9a98157] [C-2676] Rough release date modal (#3610) Andrew Mendelsohn
[5e9a847] [C-2771, C-2772] Add duplicate add to playlist confirmation drawer and modal (#3601) Kyle Shanks
[49ca553] [PAY-1468] Fix mobile chats copy message button (#3623) Reed
[193ae1c] [PAY-1483] Patch RN to fix textinput multiline onchange not firing (#3622) Reed
@AudiusProject AudiusProject deleted a comment from linear bot Sep 11, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants