treyhuffine

import styled from 'styled-components';

export const HeaderContainer = styled.div`
  display: flex;
  justify-content: space-between;

  @media (max-width: 640px) {
    display: ${({ isHome }) => (!isHome ? 'none' : 'flex')};
    flex-direction: column;
  }

treyhuffine

import UserHeader from './UserHeader'
export default UserHeader

treyhuffine

import styled from 'styled-components';
import { blue } from '@carbon/colors';

export const SectionTitle = styled.h3`
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
`;

export const Paragraph = styled.p`
  white-space: pre-wrap;

treyhuffine

import React, { useState, useEffect } from 'react';
import Pages from './pages';

function App() {
  const [user, setUser] = useState(null);
  useEffect(() => {
    // NOTE: Use your username below
    fetch('https://gitconnected.com/v1/portfolio/treyhuffine')
      .then(res => res.json())
      .then(user => {

treyhuffine

{
  "basics": {
    "id": "3641e126-f5e4-4478-b881-ee735dd2dbf1",
    "name": "Trey Huffine",
    "username": "treyhuffine",
    "usernameCaseSensitive": "treyhuffine",
    "karma": 247,
    "picture": "https://avatars3.githubusercontent.com/u/11709986?v=4",
    "label": "Building gitconnected.com",
    "location": "Austin, TX",

treyhuffine

.modal-button {
  background: #FFF;
  border: none;
  color: #333;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 2px;
  margin-right: 10px;
}

treyhuffine

function EmployeeDetails() {
  var name: "Mayank";
  var age = 30;
  var designation = "Developer"
  
  return {
    name: name,
    age: age,
    designation: designation
  }

treyhuffine

export interface OwnProps {
  handleIdChange: (newId: number) => void;
}

interface Props extends OwnProps {
  data: LaunchListQuery;
}

// ...
const LaunchList: React.FC<Props> = ({ data, handleIdChange }) => (

treyhuffine

interface OwnProps {
  id: number;
}

const LaunchProfileContainer = ({ id }: OwnProps) => {
  const { data, error, loading, refetch } = useLaunchProfileQuery({
    variables: { id: String(id) },
  });
  React.useEffect(() => {
    refetch();

treyhuffine

const App = () => {
  const [id, setId] = React.useState(42);
  const handleIdChange = React.useCallback(newId => {
    setId(newId);
  }, []);

  return (
    <div className="App">
      <LaunchList handleIdChange={handleIdChange} />
      <LaunchProfile id={id} />