import React from 'react';
import { Shape } from '../../common/components/shape';
import { theme } from '../../app/theme';

export const Wave: React.FC = () => {
  return (
    <>
      <Shape
        name="starred-wave"
        gradient={[{ color: theme.colors.mirage }]}
        curveTopHeight={64}
        maxHeight={500}
        data={[
          // photoshop zoom 300%
          { x: 0, y1: 0, y2: 265 },
          { x: 50, y1: 67, y2: 308 },
          { x: 100, y1: 127, y2: 319 },
          { x: 150, y1: 182, y2: 314 },
          { x: 200, y1: 233, y2: 297 },
          { x: 300, y1: 317, y2: 220 },
          { x: 400, y1: 365, y2: 95 },
          { x: 450, y1: 374, y2: 48 },
          { x: 500, y1: 374, y2: 21 },
          { x: 550, y1: 368, y2: 5 },
          { x: 600, y1: 355, y2: 0 },
          { x: 650, y1: 334, y2: 2 },
          { x: 700, y1: 310, y2: 17 },
          { x: 750, y1: 281, y2: 50 },
          { x: 800, y1: 251, y2: 104 },
          { x: 900, y1: 195, y2: 274 },
          { x: 1000, y1: 152, y2: 431 },
          { x: 1100, y1: 129, y2: 517 },
          { x: 1200, y1: 131, y2: 551 },
          { x: 1300, y1: 156, y2: 550 },
          { x: 1400, y1: 204, y2: 503 },
          { x: 1500, y1: 270, y2: 382 },
        ]}
      />
    </>
  );
};