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

useStyleSheet hook doesn't follow Hook rules #831

Closed
nonameolsson opened this issue Jan 16, 2020 · 3 comments · Fixed by #833
Closed

useStyleSheet hook doesn't follow Hook rules #831

nonameolsson opened this issue Jan 16, 2020 · 3 comments · Fixed by #833
Labels
🐛 Bug 📱 Components components module-specific

Comments

@nonameolsson
Copy link

🐛 Bug Report

Using the hook useStyleSheet with ESlint Hook rules doesn't work. The code works when disabling the rule with // eslint-disable-next-line react-hooks/rules-of-hooks.
https://reactjs.org/docs/hooks-rules.html#eslint-plugin

To Reproduce

  1. Follow instructions in https://akveo.github.io/react-native-ui-kitten/docs/components/themed-component/overview#usestylesheet.
import React from 'react';
import {
  Layout,
  Text,
  useStyleSheet,
} from '@ui-kitten/components';

export const UseStyleSheetSimpleUsageShowcase = () => {
  const styles = StyleSheet.create();

  return (
    <Layout style={styles.container}>
      <Text category='h4' status='control'>
        I use success color as background!
      </Text>
    </Layout>
  );
};

const StyleSheet = useStyleSheet({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'color-success-default',
  },
});

Expected behavior

No warnings/errors should show up.

Link to runnable example or repository (highly encouraged)

UI Kitten and Eva version

Package Version
@eva-design/eva 4.4.0-beta.2
@ui-kitten/components 4.4.0-beta.2

Environment information

  System:
    OS: macOS Mojave 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
  Binaries:
    Node: 12.13.1 - /usr/local/bin/node
    Yarn: 1.21.1 - ~/.yarn/bin/yarn
    npm: 6.13.6 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.6010548
    Xcode: 11.0/11A420a - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0
    react-native: https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz => 0.61.4
  npmGlobalPackages:
    react-native-cli: 2.0.1
@artyorsh
Copy link
Collaborator

artyorsh commented Jan 17, 2020

This is why this version is beta.
There are few advices on how to make it better and currently we're looking for how to update it with less breaking changes

You can view conversation here: #782

@nonameolsson
Copy link
Author

Thanks! I should have searched amongst existing the issues more before creating this one.

@artyorsh
Copy link
Collaborator

Let's keep it open so we can track the progress. Thanks for reporting

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐛 Bug 📱 Components components module-specific
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants