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

Add submission request form to site #18

Open
mikesimps opened this issue Oct 25, 2018 · 8 comments
Open

Add submission request form to site #18

mikesimps opened this issue Oct 25, 2018 · 8 comments
Labels
enhancement New feature or request help wanted Extra attention is needed

Comments

@mikesimps
Copy link
Collaborator

mikesimps commented Oct 25, 2018

Create web form for public submissions. Create Form that creates Request__c record after submission.

Fields to collect

  • Repo Url
  • Submitter Name (Optional)
  • Submitter Email (Optional)

Add form to front page.

@mikesimps mikesimps added the enhancement New feature or request label Oct 25, 2018
@mikesimps
Copy link
Collaborator Author

@aheber @grekker @ChuckJonas For this I was thinking we use web-to-lead to collect the submissions. On Lead Create, a trigger will generate the Resource__c record in an "unapproved" status. Our approval is to convert the lead to create a Contact and Account (if they specify an organization). Then we put an "on convert" action for the Lead Trigger to move the Resource__c to "approved'. If we disqualify the lead, we can either delete the Resource__c record or mark it as "denied".

Thoughts?

@mikesimps mikesimps self-assigned this Oct 25, 2018
@aheber
Copy link

aheber commented Oct 25, 2018

@mikesimps in thinking through this same path we started to be concerned about the security of the action. How do we limit the fields submitted, prevent spam, etc... Unless we can figure a way to lock it down web-to-anything might be off the table.

Leaning toward having the React app use the API.

@mikesimps
Copy link
Collaborator Author

Just a few thoughts

  • Spam - we can require a captcha for submissions (I've never set this up but it looks possible)
    image
  • Even in a dev org, we have 2 licenses, one license could be used as the default lead creator and we lock them down to only be able to see the exact fields on the leads that we want them to be able to submit. If people get around the captcha they still won't be able to make a valid submission using that form.

@mikesimps mikesimps removed their assignment Oct 25, 2018
@mikesimps mikesimps added the help wanted Extra attention is needed label Oct 25, 2018
@ChuckJonas
Copy link
Collaborator

ChuckJonas commented Oct 25, 2018

would be extremely easy to update the resource object (or a submission object so we approve?) directly via heroku

@grekker
Copy link
Contributor

grekker commented Oct 25, 2018

My two cents would be:

  1. Web form in React App that calls Heroku
  2. Heroku writes to Resource__c object via API to create a new record
  3. Add a boolean/picklist to Resource__c to indicate approved items
  4. Update Heroku code that fetches Resource__c records to filter on this new field

@ChuckJonas
Copy link
Collaborator

ChuckJonas commented Oct 25, 2018

Because everyone is still pretty new to these technologies, here's a step by step of how we would implement this:

1: Add a "Submit Repository" <Button/> to either the <App/> or <Repository/>.

  • Add new boolean state property showingSubmitForm to the component. (by adding property to state interface & initializing = false in constructor
  • On button click, call this.setState({showingSubmitForm: true});
    2: Add a submit form (3) modal. set the showing property = this.state.showingSubmitForm
    3: Add a new component for the submit form.
  • For each input, add a new state property. The input should get passed the state value and update it on change: <Input value={this.state.repositoryName} onChange={(e)=>this.setState({repositoryName: e.target.value})} />
  • Add a Submit button. On submit, gather the current state of the component and call the Heroku API for submitting resources (4). It should be typed using the definition setup in shared/types.d.ts (5)
    4: Setup a new post method route in server/index.ts: EG: app.post('/api/submission', async function (request, response).
    5: Define the request data interface and store it in the shared/types.d.ts
    6: Create a new class submissionService.ts which takes the request data interface (5) as a param, and creates a new object request object in salesforce
    7: In the POST route, respond response.send() a success/fail response
    8: Back in the Form component, handle the response. If failure, display error. If success, close modal (method to do so will need to be passed from the components that controls the showingSubmitForm state)

If I have a couple minutes this evening, I'll try to submit a PR with these steps so you can really get a feel for how all this works together

ChuckJonas added a commit that referenced this issue Oct 25, 2018
@ChuckJonas
Copy link
Collaborator

ChuckJonas commented Oct 25, 2018

@grekker @aheber @mikesimps

I think this is a really good commit to get an understanding of how to make end-to-end updates. a5fa233

There's still quite a bit of polishing to do. Hopefully one of you can take this and finish it up.

Also, my impression so far is that react SLDS is no where near as well built as antd. Could be I just still don't know how to properly use it yet. Having types would help as right now you have to go to the documentation constantly to see how to use the library.

@ChuckJonas
Copy link
Collaborator

also, if you haven't done any basic react training, this tutorial series doesn't take very long and will get you up to speed: https://www.codecademy.com/learn/react-101

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

4 participants