Added New component: LinearProgress

[arpitBhalla]

What kind of change does this PR introduce?

New Component LinearProgress
According to material desgin guidelines https://material.io/components/progress-indicators#linear-progress-indicators

Did you add tests for your changes?
Yupp

If relevant, did you update the documentation?

Summary

Does this PR introduce a breaking change?
Nope

Other information

[arpitBhalla]

@flyingcircle Please Review, I havn't exported this from index.ts, tests are pending, Please Share your views

[arpitBhalla]

WhatsApp.Video.2021-03-16.at.10.16.04.PM.mp4

[codecov]

Codecov Report

Merging #2867 (b0d77b7) into next (ff9001e) will decrease coverage by 0.67%.
The diff coverage is 60.86%.

❗ Current head b0d77b7 differs from pull request most recent head 6f4813a. Consider uploading reports for the commit 6f4813a to get more accurate results

@@            Coverage Diff             @@
##             next    #2867      +/-   ##
==========================================
- Coverage   89.43%   88.76%   -0.68%     
==========================================
  Files          47       48       +1     
  Lines         956      979      +23     
  Branches      372      382      +10     
==========================================
+ Hits          855      869      +14     
- Misses         66       74       +8     
- Partials       35       36       +1     

Impacted Files	Coverage Δ
src/linearProgress/LinearProgress.tsx	60.86% <60.86%> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update ff9001e...6f4813a. Read the comment docs.

[flyingcircle]

This looks awesome! I think the component should probably also extend ViewProps. You'll definitely want people to be able to extend certain capabilities such as accessibility to the component.

[arpitBhalla]

@flyingcircle Kindly review

[flyingcircle]

Code looks good just looking through it. I'll try to test it out myself here later on in a bit.

[arpitBhalla]

@flyingcircle sure sir🙂

[flyingcircle]

So I tested it out in iOS using your code. I made this adjustment:

        <Text>Linear Progress Indeterminate </Text>
        <LinearProgress style={{ marginVertical: 10 }} color="red" />
        <Text>Linear Progress Secondary color</Text>
        <LinearProgress style={{ marginVertical: 10 }} color="secondary" />
        <Text>Linear Progress with value</Text>
        <LinearProgress
          style={{ marginVertical: 10 }}
          value={progress}
          variant="determinate"
          color="red"
        />
        <Text>Linear Progress with value secondary color</Text>

        <LinearProgress
          style={{ marginVertical: 10 }}
          value={progress}
          variant="determinate"
          color="secondary"
        />
        <Button
          disabled={progress > 0}
          onPress={() => {
            setProgress(0.00001);
          }}
          title={'Start Progress'}
          containerStyle={{ margin: 10 }}
        />
        <Button
          disabled={progress === 0}
          onPress={() => {
            setProgress(0);
          }}
          title={'Restart'}
          containerStyle={{ margin: 10 }}
        />

I wasn't able to see the progress in the red bars when testing with the demo app on iOS. You currently have it where the Color is like a "dark pink" on "lighter pink". I think it may also be reasonable to have a trackColor prop so that they aren't forced into using the same color for both.

[arpitBhalla]

@flyingcircle I made Changes, Please Review

[flyingcircle]

Awesome! This looks great! I only see only minor change that should be made to the demo, but I'll post it there. Great work!

[arpitBhalla]

@flyingcircle Thanku Sir